Introduction.
In this Session of the TreeView Control Tutorial, we will learn to program the ImageComboBox Control. We will create an MS-Access Project Drop-down Menu, with ImageCombo Control. There is a second ImagecomboBox Control for displaying the Images and their Key Values from the ImageList Control. For both of these ImageComboBox Controls, the list of Images has been taken from a common ImageList Control. The Images were manually uploaded into the ImageList Control from the Computer, in an earlier session of this Tutorial Series.
Following are the Tree View Control Tutorial Sessions we have covered so far:
The TreeView Control Tutorial Session Links.
- Microsoft TreeView Control Tutorial
- Creating Access Menu with TreeView Control
- Assigning Images to TreeView Control
- Assigning Images to TreeView Control-2
- TreeView Control Check-Mark Add, Delete Nodes
The Demo View of Both ImageComboBoxes Expanded.
The completed MS-Access Project Drop-Down Menu Image is given below:
The Design View Image of the above Form is given below:
The Drop-Down ImageComboBox Source Data.
The new MS-Access Project Drop-Down Menu's Source Data has been taken from our earlier Access Menu Project.
Download the Demo database now, if you have not done it earlier, from the 4th item Link given above. If you do, then you have all the required data Objects to continue with the current Session.
There are three Tables: Categories, Products, and the Menu table. There are two forms to display the Categories and Product data and a data filter parameter Form for reports.
We have two more Forms: frmMenu and frmMenu2 which we have used in our earlier Tutorial Sessions.
You will find two Reports to Preview the Categories and Products Data Items.
Two Macros for displaying some simple Messages. The macros can be used for sequencing Action-Queries for Data Processing for complicated Reports. These actions have been performed by selecting Options from the TreeView Control Project Menu in the earlier Tutorial Session.
We need all these objects here also because we will create a new Drop-Down Menu using the ImageComboBox Control. We must be able to open all these objects by selecting the options in the New Drop-Down Control Menu, exactly the same way as we did on frmMenu2 Form, using the TreeView Control, in this same Database.
The Menu table image is given below for your reference.
Preparing for the Design of the Drop-Down Menu Form.
Check the Design View of the Menu Form above and there are two Menu-related Controls. One ImageList Control and one ImageComboBox Control. One more ImageComboBox Control has been placed on the right side of the Form to display the ImageList’s Images.
- Make a Copy of the ImageList Control from frmMenu2 Form and Paste it on a New Form, say frmMenu3Combo.
The Imagelist control has Images uploaded manually from the Computer in our earlier Tutorial Session. You may open its Property Sheet and check the Images and their Key Names. Right-Click on the ImageList Control, highlight ImageListCtl Object and select Properties Option.
The ImageComboBox Control placed on the left side of the Form is for Drop-Down Menu, with the name: imgCombo1. Find Microsoft ImageComboBox Control from the ActiveX Controls group and place it on the Form. Change the Name of the control to imgCombo1.
Create another ImageComboBox Control to the right side, with the name imgCombo2. The second ImageComboBox we will use for displaying the Images and their Key Names, from the ImageList0 Control, as a drop-down list.
Add a Label control above the second ImageComboBox control and change its Caption to Image List.
The Images Listing in Image-Combo-Box Control.
First, we will work with the second imgCombo2 Control and display the List of Images from the ImageList Control. Once you are familiar with the Code you will understand the Drop-down Menu Creation procedure very easily.
We have divided the frmMenu3Combo Form Module VBA Code into two parts. Let us take the first part and see what we have in there.
Briefly, in the global declaration area, the main object variables have been declared. The Form_Load() event procedure initializes the ImageList control on the Form to its object variable objimgList and calls the cboImageList() subroutine to add images from the ImageList control to the second ImageComboBox control. Let us take a closer look at the code.
The first-part vba code, with the Form_Load() and cboImageList() subroutines listed below:
Dim imgcombo1 As MSComctlLib.ImageCombo Dim imgCombo2 As MSComctlLib.ImageCombo Dim objimgList As MSComctlLib.ImageList Const KeyPrfx As String = "X" Private Sub Form_Load() Set objimgList = Me.ImageList0.Object cboImageList 'load imagelist-combo 'CreateMenu 'Create Drop-Down Menu End Sub Private Sub cboImageList() Dim j As Integer Dim strText As String Set imgCombo2 = Me.ImageCombo2.Object imgCombo2.ImageList = objimgList For j = 1 To objimgList.ListImages.Count strText = objimgList.ListImages(j).Key imgCombo2.ComboItems.Add , , strText,j,,j Next imgCombo2.ComboItems(1).Selected = True End Sub
VBA Code Review.
On the global declaration area, we have declared two ImageComboBox controls, imgCombo1 for the project menu and imgCombo2 for displaying images from the ImageList control. The objimgList variable is declared for the ImageList control on the form. The Keyprfx variable with the character X is declared as a constant.
Within the Form_Load() event procedure the objimgList is initialized with the ImageList control on the Form, with the statement: Set objimgList = Me.ImageList0.Object. Now, all the pre-loaded images in the ImageList control are available to access through the objimgList object.
The next statement calls the sub-routine cboImageList() to add all the Images to the ImgCombo1 control.
The CreateMenu() subroutine call has been commented out for the time being.
In the cboImageList() subroutine two variables have been declared.
Next, the statement Set imgCombo2 = Me.ImageCombo2.Object assigns the second ImagecomboBox on the form to the object variable imgCombo2.
Like the TreeView control the imgCombo2 has an ImageList property, to pass the ImageList control’s reference to the ImageComboBox control, in order to access the ImageList’s properties. The next statement: imgCombo2.ImageList = objimgList does that.
Next, the For . . . Next Loop runs for the number of Images in the ImageList Control.
The first ImageList item’s Key-Value ('form_close') has been saved in the strText variable. Here, we have taken the Key value of Image List control as Text or as a description of the ImageCombo image, because that is the only Text available. The Tag property is empty and we have other uses with this property when we work with the drop-down menu.
The next statement is the important one that we have to look at closely, the Add method of ImageComboBox control. The syntax of the statement is as given below:
imgCombo2.ComboItems.Add [Index],[Key],[Text],[Image],[SelImage],[Indentation]
All the parameters of the Add() method are optional. For our first test run of this control, we will use the values for [Text], [Image], and [Indentation] only. After viewing the result of the first test run of the image list view, we will not use the [Indentation] parameter value on this ImageCombo control.
Note: But, keep in mind that we will need the Indentation Property value for the Drop-Down Menu to make the menu items look like Root-Node and Child-Node on the TreeView Control. We will use the [Key] Parameter also (for both Key and Text parameters) to access a specific menu item’s Tag Property value.
Image List with incrementing Indentation Param Setting.
The first test runs the image list in ImageCombo2 will look like the image given below, after applying incremental values for indentation.:
The effect of the Indentation is clear from the above trial run image. Each item has been moved to the right, one space greater than the previous one. We can make use of this feature to position our project menu item Nodes, to look like Root-Level and Child Nodes.
After the strText value (‘form_close’) the first variable j refers to the ImageList’s index number, the [SelImage] parameter we have skipped and the next value in j has been used for indentation of each list item when placed in the ComboBox list. After the first test run and after viewing the result you may remove all parameters after the image index value.
The next statement: imgCombo2.ComboItems(1).Selected = True selects the first item in the ComboBox. When you select an item from the ImageCombo control through code the Change() event fires, but it is not when you select an item directly on the form. The Update() event ignores the manual updating Event and attempts to invoke through code.
Save the form frmMenu3Combo and open it in Normal View. Expand the second ImageList ComboBox control and view the result. Remove the commas and the variable j at the end, after the first variable j, retained for the ImageList index number.
The VBA Code of Project Drop-Down Menu.
Now, we will proceed with the second part of the form module vba code to learn how to create the Access Drop-Down Menu and see how to open Access Forms, Reports and Macros by selecting the ComboBox control item.
The second part of the VBA code, which consists of the CreateMenu() subroutine and ImageCombo1_Click() event procedure, has been listed below:
Private Sub CreateMenu() Dim db As DAO.Database Dim rst As DAO.Recordset Dim strSQL As String Dim strKey As String Dim strText As String Dim typ As Integer Set imgcombo1 = Me.ImageCombo1.Object imgcombo1.ImageList = objimgList strSQL = "SELECT ID, Desc, PID, Type,Macro,Form,Report FROM Menu;" Set db = CurrentDb Set rst = db.OpenRecordset(strSQL, dbOpenDynaset) Do While Not rst.EOF And Not rst.BOF If Len(Trim(Nz(rst!PID, ""))) = 0 Then strKey = KeyPrfx & CStr(rst!ID) strText = rst!Desc imgcombo1.ComboItems.Add , strKey, strText, 1, 2, 1 ' image index 1,2([image],[selectedimage]) 'imgcombo1.ComboItems.Add , strKey, strText, "folder_close", "folder_open", 1 Else strKey = KeyPrfx & CStr(rst!ID) strText = rst!Desc imgcombo1.ComboItems.Add , strKey, strText, 4, 5, 4 'last param is spacing 'imgcombo1.ComboItems.Add , strKey, strText, "left_arrow", "right_arrow", 4 'Check for the presense of Type Code If Nz(rst!Type, 0) > 0 Then typ = rst!Type With imgcombo1.ComboItems Select Case typ 'save type Code & Form/Report/Macro Name in Tag Property Case 1 .Item(strKey).Tag = typ & rst!Form Case 2 .Item(strKey).Tag = typ & rst!Report Case 3 .Item(strKey).Tag = typ & rst!Macro End Select End With End If End If rst.MoveNext Loop rst.Close imgcombo1.ComboItems.Item(1).Selected = True End Sub Private Sub ImageCombo1_Click() Dim strObject As String Dim strTag As String Dim typ As Integer strTag = ImageCombo1.SelectedItem.Tag typ = Val(strTag) strObject = Mid(strTag, 2) Select Case typ Case 1 DoCmd.OpenForm strObject, acNormal Case 2 DoCmd.OpenReport strObject, acViewPreview Case 3 DoCmd.RunMacro strObject End Select End Sub
I think, before starting with the vba code you should take a look at the Table Image (third image from the top of this page) if you have not done it in the earlier session on Access Project Menu creation.
The ID field has a unique ID value and is an AutoNumber field.
The Second field Desc has object type group names (Forms, Reports, and Macros) and actual object names of the form, Report, and Macro.
The PID (Parent ID) field value is empty for object group names: Forms, Reports, and Macros. These empty PID value items will position at the left position in the ImageComboBox Drop-Down Menu, with one character space indentation, and other items will be moved forward with four character spaces. With these positionings of items, they will look like the Root-Level and Child-Level Nodes in a TreeView control, but we will miss the connecting Tree Lines.
Check the image in the ImageComboBox selected item control, the image is positioned at the leftmost position. The Group Item in the next line is positioned after one character space on the left side and other Group items are also appearing in the same position. The Child member items under each group have been positioned after four character spaces.
The PID field value has been checked and if found empty, then we assume that it is a group name, otherwise, it is an Access Object Name that we need to open, when the user clicks on it, and position them as child members of the group. The actual Key value in the PID field is not important here. In either case, we need it here. But, we can use the type field value for this purpose instead.
Next, the Type field contains the object type Code: 1 – Form Name, 2 – Report Name, and 3 – Macro Name. The next three fields: Form, Report, and Macro have the actual Object Names based on their respective codes in the Type field. I have used three different fields for clarity, they all can be placed in one column as well.
The Type Code and Object Name pair (say 2rptCategories) will be saved in the ImageComboBox’s Tag Property.
The CreateMenu() Subroutine.
Now, on to the vba code of the CreateMenu() Subroutine.
The Database and other variables have been declared at the beginning.
The imgcombo1 object variable has been initialized with The Me.ImageCombo1. The object on the form.
Next, the imgCombo1.ImageList property has been loaded with the ImageList object objimgList Reference, so that we will be able to access the ImageList’s Index Number and Key values directly.
Next, the Menu Table record set is open with the SQL String.
The PID field value has been checked, if it is empty then it is an object group name, the ID value is prefixed with Constant X and saved in the strKey variable. The field Desc value has been saved in strText Variable.
The next statement calls the Add() method of ImageComboBox control and the first item has been added to the Drop-Down Menu.
imgcombo1.ComboItems.Add , strKey, strText, 1, 2, 1
The first parameter value Index number has been omitted, but it will be created automatically. The strKey variable consists of ID Field value 1 with prefix constant X (X1) as the Key parameter. The strText contains the Desc field value. The next value 1 is the ImageList’s first image’s (Key-value folder_close) Index value. If you prefer the 'folder_close' Key-value within quotes you may do so. Next value 2 is the second Image’s (‘folder_open’) Index value or you may use 'folder_open' in quotes and the last parameter 1 is for indentation.
Note: To confirm the Index order of Images in the ImageList Control check the Image Listing Order in the ImageCombo2 Display we created earlier. We could have prefixed the Index value to the Key value with one space to add that number also to the Key value to look like [image] 1 form_close. [image] 2 form_open and so on . . . This I will leave to you as an exercise for yourself.
Next, if the PID field value is non-zero, then the actual Menu Option is to be added under the Else Clause. Here, we have added another ImageCombo item as we did earlier. For [Image] and [SelImage] parameters we have taken the ImageList Item Index values 4 and 5. The indentation parameter value is 4 character spaces.
In the ImageCombo Item’s Add() Method, under the Else Clause, we need to save the Access Object Name (frmData Entry) along with the Type Code 1 in the Tag (ImageCombo1.ComboItems.Item(strKey).Tag) Property. When the user selects this item from the Drop-Down Combo Box Menu, the Click() event fires, the Tag Property value has been extracted, the Type code has been checked, if the type code is 1 (Form) then the form name in the Tag Property (frmData Entry) is open with DoCmd.OpenForm Command.
This way all the Menu Table records have been added to the Image ComboBox control.
The statement imgcombo1.ComboItems.Item(1).Selected = True selects the first item as the default item in the Image ComboBox Control. On this code execution time the Change() event fires, but not when an item is selected by clicking on it on the Form View.
NB: Before opening the form for the Drop-down Menu Trial Run, please remove the Comment Symbol from the ‘CreateMenu call line in Form_Load() Event Procedure. We have commented out this line temporarily, during trial runs of Image display from ImageList Control in ImageCombo2 Control.
The ImageCombo1_Click() Event fires when the user selects an item from the Image ComboBox Control. The selected item’s Tag Property value has been checked for the Type Code & Object Name and opens it with Docmd.Objecttype ObjectName.
The Demo Database ProjectMenuV221.accdb in .zip format is given below for Downloading.
No comments:
Post a Comment
Comments subject to moderation before publishing.