File Explorer is a generalized way of referring to an application that lets end users browse and edit directory structures. The best known File Explorer is Microsoft Windows Explorer.
The built-in File Explorer in Pocket PC 2002 is not very intuitive and does not offer a way to view the directory structure in a hierarchical fashion (see Figure 1). In this article, the second of a three-part series on the.NET Compact Framework), I'll show you how to use the Compact Framework's TreeView control to develop an enhanced File Explorerone that works much more like the Windows Explorer on your desktop Windows OS.
Populating the Form with Controls
Figure 1. Nothing Fancy: The built-in File Explorer in Pocket PC 2002 leaves much to be desired.
Figure 2. Fresh Form: Populate your project's Form1 with the various controls.
To get started, launch Visual Studio .NET 2003 and create a new Smart Device Application project. Populate the default Form1 with the TreeView Control. Also add the ContextMenu and ImageList controls to your project (see Figure 2
). The ContextMenu control allows you to display a context menu when you tap (and hold) the stylus on your Pocket PC. The ImageList control acts as a container for images. I will use the ImageList control to store the icons (for open and closed folders) used by the TreeView control.
You need to associate the ContextMenu control with the TreeView control by specifying ContextMenu1 in the ContextMenu property of the TreeView control. This causes the context menu to be displayed when the TreeView control is tapped (and held for a moment).
|Figure 3. Open and Shut: Adding images to the Images collection in the ImageList control.|
The ImageList control displays the folders using icons when the TreeView control is expanded. You need to associate the ImageList control with the TreeView control by specifying ImageList1
in the ImageList property of the TreeView control.
Add three icons to the Images collection in the ImageList control: open folder, closed folder, and ordinary file. You can see the three icons in Figure 3.
Now your form is done and you're ready to add the code to make it all work.