?? ch19.htm
字號:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN"><HTML><HEAD> <META NAME="GENERATOR" Content="Symantec Visual Page Mac 1.1"> <TITLE>Teach Yourself Visual C++® 5 in 24 Hours -- Hour 19 -- Tree Views</TITLE></HEAD><BODY TEXT="#000000" BGCOLOR="#FFFFFF"><H1 ALIGN="CENTER"><IMG SRC="../button/sams.gif" WIDTH="171" HEIGHT="66" ALIGN="BOTTOM"BORDER="0"><BR><FONT COLOR="#000077">Teach Yourself Visual C++® 5 in 24 Hours</FONT></H1><CENTER><P><A HREF="../ch18/ch18.htm"><IMG SRC="../button/previous.gif" WIDTH="128" HEIGHT="28"ALIGN="BOTTOM" ALT="Previous chapter" BORDER="0"></A><A HREF="../ch20/ch20.htm"><IMGSRC="../button/next.gif" WIDTH="128" HEIGHT="28" ALIGN="BOTTOM" ALT="Next chapter"BORDER="0"></A><A HREF="../index.htm"><IMG SRC="../button/contents.gif" WIDTH="128"HEIGHT="28" ALIGN="BOTTOM" ALT="Contents" BORDER="0"></A> <HR></CENTER><H1 ALIGN="CENTER"><FONT COLOR="#000077">- Hour 19 -<BR>Tree Views</FONT></H1><P>One of the most popular controls released with Windows 95 is the tree view control.In this hour, you will learn<UL> <LI>How to use the tree view control in a dialog box<BR> <BR> <LI>How to use the tree view control as a view in an SDI application<BR> <BR> <LI>How to use the MFC classes that support the tree view control<BR> <BR> <LI>How to implement drag-and-drop and label editing in a tree view control</UL><H2><FONT COLOR="#000077"><B>What Is a Tree View Control?</B></FONT></H2><P>Tree controls are similar to the list box controls discussed in Hour 7, "UsingList Box and Combo Box Controls," except that they display information in atree, or hierarchy. Tree view controls are often used to display disk directoriesor the contents of books or other documents.</P><P><FONT COLOR="#000077"><B>New Term:</B></FONT><B> </B>In a tree view, <I>parentitems</I> are located at the root, or top level, of the tree. In a tree view, <I>childitems</I> are located under parent items.</P><P>Items in a tree view control are arranged into groups, with child items locatedunder parent items. Child items are also indented, or nested, under a parent. A childitem at one level can be the parent of child items at lower levels. The Windows Exploreris one of the applications that uses the new tree control, shown in Figure 19.1.</P><P><A NAME="01"></A><A HREF="01.htm"><B>Figure 19.1.</B></A> <BR><I>The Windows Explorer is one of the many applications that use tree view controls.</I></P><P>The tree control is a popular control because it enables you to display a greatdeal of information in a hierarchy. Unlike a list box, a small amount of high-levelinformation can be presented initially, enabling the user to decide which parts ofthe tree should be expanded. The tree control also enables information to be displayedso that relationships between different items in the control can be seen. For example,in the Explorer, subdirectories are nested in order to show their positions in thedirectory.</P><P>Tree views are also popular because they offer a wide range of options. As withlist view controls, which were discussed in Hour 18, "List View Controls,"tree view controls put the user in charge. As you see in an example later in thishour, it's very easy to enable a user to perform drag-and-drop operations in a treeview control. With a few lines of code, you can also enable a user to edit the labelsfor individual tree view items.</P><P>You can create tree view controls with several different styles. For example,many tree view controls display a bitmap next to each item. Many also display a treecontrol button next to each item. This button contains a plus sign if an item canbe expanded. If the button is clicked, the tree view expands to display the item'schildren. When it is expanded, the item displays a button with a minus sign.</P><P>Tree controls often contain a large amount of information. The user can controlthe amount of information displayed by expanding or collapsing tree items. When morehorizontal or vertical room is needed, the tree control automatically displays scrollbars.<H2><FONT COLOR="#000077"><B>MFC Support for Tree View Controls</B></FONT></H2><P>There are two ways to use tree controls in your MFC-based programs. When a treecontrol is used in a dialog box, the control is added just as buttons, list boxes,and other controls have been added in previous hours. The MFC class <TT>CTreeCtrl</TT>is used to interact with tree controls and is associated with a tree view controlusing ClassWizard.</P><P>Tree view controls can also be used in a view. The <TT>CTreeView</TT> class isa specialized view that consists of a single tree control. The <TT>CTreeView</TT>class is derived from <TT>CCtrlView</TT>, which is itself derived from <TT>CView</TT>.</P><P>Because <TT>CTreeView</TT> is derived from <TT>CView</TT>, it can be used justlike <TT>CView</TT>. For the first example in this hour, you use <TT>CTreeView</TT>as the main view in an MFC-based application.<H2><FONT COLOR="#000077"><B>Using a Tree View Control as a View</B></FONT></H2><P>For this example, create an SDI project named TreeEx using AppWizard. In AppWizardstep six, a checkered flag is displayed along with a list box containing classesthat are generated for the application. Follow these steps to use a tree view asthe application's main view:<DL> <DD>1. Select the view class in the class list box, in this case <TT>CTreeExView</TT>.<BR> <BR> 2. Select <TT>CTreeView</TT> from the Base Class combo box.<BR> <BR> 3. Click the Finish button to end the AppWizard process and display the New Project Information dialog box.<BR> <BR> 4. Click OK to generate the code for the TreeEx project.</DL><P>You can compile and run the TreeEx application; however, no items have been addedto the tree control yet. In the next section, you see how items are added to a treeview.<H3><FONT COLOR="#000077"><B>Adding Items to a <TT>CTreeView</TT></B></FONT></H3><P>As discussed earlier, the <TT>CTreeView</TT> class is derived from <TT>CView</TT>and contains a tree view control that covers the entire view surface. To get accessto the tree view control, you use the <TT>GetTreeControl</TT> function.</P><PRE><FONT COLOR="#0066FF"><TT>CTreeCtrl& tree = GetTreeCtrl();</TT></FONT></PRE><P>Note that the return value from <TT>GetTreeCtrl</TT> is a reference to a <TT>CTreeCtrl</TT>object. This means that the return value must be assigned, or bound, to a <TT>CTreeCtrl</TT>reference variable.</P><P>After you have access to the tree view control, items can be added to the controlin several different ways. The simplest methods are used when adding simple textitems without bitmap images to the tree view control. When adding simple items toa tree control, only the label for the item must be provided:</P><PRE><FONT COLOR="#0066FF"><TT>HTREEITEM hItem = tree.InsertItem( "Foo" );</TT></FONT></PRE><P>This line adds an item to the tree control at the first, or root, level. The returnvalue from <TT>InsertItem</TT> is a handle to the new item if it was inserted successfullyor <TT>NULL</TT> if the item could not be inserted.</P><P>To add an item as a child, pass the parent's handle as a parameter when insertingthe item.</P><PRE><FONT COLOR="#0066FF"><TT>tree.InsertItem( "Bar", hItem );</TT></FONT></PRE><P>The source code provided in Listing 19.1 uses the functions discussed previouslyto add eight items in the <TT>CTreeExView::OnInitialUpdate</TT> function.<H4><FONT COLOR="#000077">TYPE: Listing 19.1. Adding items to a CTreeView.</FONT></H4><PRE><FONT COLOR="#0066FF"><TT>void CTreeExView::OnInitialUpdate()</TT><TT>{</TT><TT> CTreeView::OnInitialUpdate();</TT><TT> CTreeCtrl& tree = GetTreeCtrl();</TT><TT> HTREEITEM hChapter = tree.InsertItem( "Chapter 1" );</TT><TT> tree.InsertItem( "What", hChapter);</TT><TT> tree.InsertItem( "Why", hChapter );</TT><TT> tree.InsertItem( "How", hChapter );</TT><TT> hChapter = tree.InsertItem( "Chapter 2" );</TT><TT> tree.InsertItem( "What", hChapter );</TT><TT> tree.InsertItem( "Why", hChapter );</TT><TT> tree.InsertItem( "How", hChapter );</TT></FONT></PRE><P><TT>}</TT> After you add the source code from Listing 19.1, compile and run theTreeEx project. This version of the tree view control is a minimal tree control,as shown in Figure 19.2. There are no connecting lines, no bitmaps, and no pushbuttons;in short, it's fairly simple.</P><P><A NAME="02"></A><A HREF="02.htm"><B>Figure 19.2.</B></A> <I><BR>The main view of the TreeEx example.</I><H3><FONT COLOR="#000077"><B>Applying Styles to a Tree View Control</B></FONT></H3><P>In addition to other available view and window styles, you can apply four styleoptions specifically to a tree view control:<UL> <LI><TT>TVS_HASLINES</TT> adds connecting lines between parent and child items.<BR> <BR> <LI><TT>TVS_LINESATROOT</TT> adds lines for the root items in the tree control. This attribute is ignored if <TT>TVS_HASLINES</TT> is not selected.<BR> <BR> <LI><TT>TVS_HASBUTTONS</TT> adds the plus and minus buttons for items that can be expanded.<BR> <BR> <LI><TT>TVS_EDITLABELS</TT> enables the user to edit a tree view item label.</UL><P>You usually don't need to get involved with defining the styles for a normal view;the default settings are good enough 99 percent of the time. For a tree view, however,you might want to select one or more of the optional styles by modifying the <TT>CTreeExView::PreCreateWindow</TT>function. The source code in Listing 19.2 applies all the optional attributes exceptfor <TT>TVS_EDITLABELS</TT>.<H4><FONT COLOR="#000077">TYPE: Listing 19.2. Modifying the tree view style in PreCreateWindow.</FONT></H4><PRE><FONT COLOR="#0066FF"><TT>BOOL CTreeExView::PreCreateWindow(CREATESTRUCT& cs)</TT><TT>{</TT><TT> cs.style |= ( TVS_HASLINES|TVS_LINESATROOT|TVS_HASBUTTONS );</TT><TT> return CTreeView::PreCreateWindow(cs);</TT></FONT></PRE><P><TT>}</TT> Compile and run the TreeEx example, and you'll see that the examplenow has lines and buttons, as shown in Figure 19.3. It might sound like a small addition,but it makes the control much easier to use, especially if the tree must be expandedand collapsed frequently. </P><P><A NAME="03"></A><A HREF="03.htm"><B>Figure 19.3.</B></A> <I><BR>The TreeEx application after modifying the Tree View styles.</I><BLOCKQUOTE> <P><HR><B> </B><FONT COLOR="#000077"><B>Just a Minute:</B></FONT><B> </B>At first glance, you might think that the list view and tree view controls are almost identical as far as the API goes. The key word, unfortunately, is almost.</P> <P>The biggest difference between the list view and tree view controls is in how individual items are referenced. In the list view control, an item index is used when communicating with the control. Because tree view controls allow items to be expanded and collapsed, however, the idea of an absolute index doesn't work. An item handle, or <TT>HTREEITEM</TT>, is used when referring to a tree view item.<BR> In addition, several smaller differences can tend to be a bit aggravating. For example, <TT>CListCtrl::CreateDragImage</TT> takes two parameters, whereas the equivalent <TT>CTreeCtrl</TT> function takes only one parameter. <HR></BLOCKQUOTE><H2><FONT COLOR="#000077"><B>Adding Tree View Controls to Dialog Boxes</B></FONT></H2><P>For the second example in this hour, you add a tree view control to the TreeExAbout dialog box. This version of the tree view control supports drag and drop andalso displays bitmaps for each item.</P><P>Adding a tree control to a dialog box is almost exactly like adding any othercontrol to a dialog box. Select the ResourceView tab in the project workspace windowand open the Dialog folder. Open the <TT>IDD_ABOUTBOX</TT> dialog box resource bydouble-clicking the <TT>IDD_ABOUTBOX</TT> icon or by right-clicking the icon andselecting Open from the pop-up menu.</P><P>Remove the current controls except for the OK button from <TT>IDD_ABOUTBOX</TT>.Add a tree view control to the dialog box by dragging the tree view icon onto thedialog box or by selecting a tree view control and clicking on the dialog box. Themodified dialog box is shown in Fig-ure 19.4.</P><P>As shown in Figure 19.4, the tree view control displays a simulated tree to assistin sizing the control.</P><P><A NAME="04"></A><A HREF="04.htm"><B>Figure 19.4.</B> </A><I><BR>Adding a tree view control to a dialog box.</I><BLOCKQUOTE> <P><HR><B> </B><FONT COLOR="#000077"><B>Just a Minute:</B></FONT><B> </B>A tree control is often larger than a list box due to the space required for indenting the nested child items. <HR></BLOCKQUOTE><H2><FONT COLOR="#000077"><B>Setting Tree View Control Properties</B></FONT></H2><P>The tree view control's properties are set using the Properties dialog box. Someof the properties available for tree view controls are also available for list boxes.The tree control property options include the following:<UL> <LI><I>ID</I> is used for the tree view control resource ID. A default resource ID, such as <TT>IDC_TREE1</TT>, is supplied by Developer Studio.<BR> <BR> <LI><I>Visible</I> is used to indicate that the control is initially visible. This check box is usually checked.<BR> <BR> <LI><I>Disabled</I> is used to indicate the list should be initially disabled. This check box is usually cleared.<BR> <BR> <LI><I>Group</I> is used to mark the first control in a group. This check box is usually cleared.<BR> <BR> <LI><I>Tab Stop</I> indicates that this control can be reached by pressing Tab on the keyboard. This check box is usually checked.<BR> <BR> <LI><I>Help ID</I> indicates that a context-sensitive help ID should be generated for this control.<BR> <BR> <LI><I>Has Buttons</I> indicates that the control should be drawn with buttons. Each tree control item that can be expanded has a button drawn to the left of the item. This check box is usually cleared.<BR> <BR> <LI><I>Has Lines</I> is used to indicate that lines should be drawn connecting items in the control. This check box is usually cleared.<BR> <BR> <LI><I>Border</I> is used to indicate that a border should be drawn around the tree control. This check box is usually checked.<BR> <BR> <LI><I>Lines at Root</I> indicates that lines should be drawn at the first, or "root," level of the control. This option is ignored if the Has Lines check box is not selected.<BR> <BR> <LI><I>Edit Labels</I> enables a user to change the values of labels in the control. This check box is usually cleared.<BR> <BR> ?? 快捷鍵說明
復制代碼
Ctrl + C
搜索代碼
Ctrl + F
全屏模式
F11
切換主題
Ctrl + Shift + D
顯示快捷鍵
?
增大字號
Ctrl + =
減小字號
Ctrl + -