Step 3: Create the VSFlexGrid Control

Go to the VC++ workspace window and select the Resources pane. Because this is a dialog-based MFC application, you can design the application by dragging and dropping controls on the main dialog (or form). It's almost like designing a form in Visual Basic.

Open the main dialog (called IDD_OUTLINEC_DIALOG) by double-clicking on it. Then delete the TODO label, pick a VSFlexGrid control from the Toolbox and drop it on the form. Adjust the size of the dialog and the control until you are happy with the layout.

Now right-click on the control and select Properties from the pop-up menu. Select the All pane and click the pushpin to keep the window on top of the others while you initialize the control's properties. Use the Property window to apply these settings (the same we used in the Outline Demo):

    Cols = 3

    ExtendLastCol = True

    FixedCols = 0

    Rows = 1

    FormatString = "Node|Token|Setting"

    OutlineBar = flexOutlineBarComplete

    GridLines = flexGridNone

    MergeCells = flexMergeSpill

    AllowUserResising = flexResizeColumns

Save your project and press F5 to run it. Visual C++ will build the project and you will see that the control is created and initialized properly. Click OK or Cancel when you are done.