Toolbar Scenario 1: Provide an RTF Text Editor with an OpenFile Button

See Also

With the RichTextBox control, you can create applications that incorporate an RTF text editor to allow end users to edit documents without starting up a second application. When you incorporate such a text editor into the application, you can provide a toolbar that gives the end user access to common operations such as opening a file and changing font characteristics. This simple scenario populates the Toolbar control with only one Button object. When the user clicks the button, the Open File dialog box is opened.

The following objects are used in this scenario:

• Form object named "frmRTF"
  
  
• Toolbar control named "tlbRTF"
  
  
• RichTextBox control named "rtfData"
  
  
• ImageList control named "imlToolbar"
  
  
• CommonDialog control named "dlgOpenFile"

To incorporate a toolbar into your application

1. At design time, populate an ImageList control with appropriate images.
   
   
2. Associate the ImageList control with the Toolbar control.
   
   
3. Create buttons for the toolbar at design time.
   
   
4. Create a File menu with an Open menu item named "mnuOpen."
5. In the Form_Load event, configure a CommonDialog control to open Rich Text Format (RTF) files.
6. In the mnuOpen_Click event, use the CommonDialog control to open a file.
7. In the Toolbar control's Button_Click event, use the Select Case statement with the Key property to identify the clicked Button object and invoke the mnuOpen_Click event.

Populate an ImageList Control with Appropriate Images

At design time, populate the ImageList control with the images you will need to populate your Toolbar control. This is easily accomplished.

To populate an ImageList at design time

1. Right-click on the ImageList control, then click Properties to open the Property Pages dialog box.

   –or–

2. Click the ImageList control, then press f4 to get the Properties Window, and double-click the Custom property.
   
   
3. Click the Images tab.
   
   
4. Click Insert Picture. In the Select Picture dialog box, find the image you wish to have appear in the Toolbar control. Repeat this until you have all the images you require. (The sample application uses the bitmap named "open.bmp.")

Associate the ImageList Control with the Toolbar Control

Also at design time, after you have populated the ImageList control, you must associate it with the Toolbar control.

To associate the ImageList control with the Toolbar control at design time

1. Right-click on the ImageList control, then click Properties to open the Property Pages dialog box.

   –or–

2. Click the ImageList control, then press f4 to get the Properties Window, and double-click the Custom property.
   
   
3. On the General tab, click the ImageList box and select the ImageList control that you have just populated.

Create Buttons for the Toolbar at Design Time

Once you have populated the ImageList control and associated it with the Toolbar control, you can begin to create the Button objects themselves. In this scenario, we will create two buttons, one with the Placeholder style, and a second with the Default style.

To add buttons to the Toolbar Control at design time

1. Right-click on the Toolbar control, then click Properties
   
   
2. In the Property Pages dialog box, click the Buttons tab.
   
   
3. Click Insert Button.
   
   
4. Click the Style box and select Separator.
   
   
5. Click Insert Button again — the style is set to Default automatically.
   
   
6. In the Key box, type openFile.
   
   
7. In the Description box, type Open File.
   
   
8. In the Image box and type 1.
   
   
9. Click OK.

Create a File Menu with an Open Menu Item Named "mnuOpen"

Because the Open File operation is commonly invoked from a menu bar, we must create a menu first.

To create a menu

1. Select the form "frmRTF."
   
   
2. Press ctrl+e to display the Menu Editor dialog box.
   
   
3. In the Caption box, type File.
   
   
4. In the Name box, type mnuFile.
   
   
5. Click the Next button.
   
   
6. In the Caption box, type Open.
   
   
7. In the Name box, type mnuOpen.
   
   
8. Click the right-pointing arrow to indent the menu item.

Configure a CommonDialog Control to Open Rich Text Format (RTF) Files

Use the CommonDialog control to create an Open File dialog box. This can be done in the Form object's Load event, as shown below:

Private Sub Form_Load()
   ' Configure dlgOpenFile for opening and 
   ' saving files.
   With dlgOpenFile
      .DefaultExt = ".rtf"
      .Filter = "RTF file (*.RTF) | *.RTF"
   End With
End Sub

Use the CommonDialog Control to Open a File

In the present scenario, the Toolbar control's single button simply represents a common operation, an Open File function, that is also found on the menu bar. Thus, the code for the Open File operation should be placed in the mnuOpen object's Click event, as shown below:

Private Sub mnuOpen_Click()
   ' Declare a string variable to hold the file name.
   ' Then invoke the ShowOpen method to show 
   ' the dialog box. Set the variable to the Filename 
   ' property. Finally, load the RichTextBox control.
   Dim strOpen As String
   dlgOpenFile.ShowOpen
   strOpen = dlgOpenFile.Filename
   rtfData.LoadFile strOpen, rtfRTF
End Sub

Use the Select Case Statement with the Key Property to Identify the Clicked Button Object and Invoke the mnuOpen_Click Event

When any Button object on the Toolbar control is clicked, the ButtonClick event occurs. To determine which Button object was clicked, use the Select Case statement with either the Key property or the Index property.

The example below uses the Key property of the Button object.

Private Sub tlbRTF_ButtonClick _
(ByVal Button As Button)
   Select Case Button.Key
   ' User clicked "open file" button.
   Case "openFile"
      mnuOpen_Click ' Invoke the mnuOpen Click event
   End Select
End Sub

You can now run the project and open an RTF file by clicking the button on the toolbar.