New Page 1 Page 1 of 11

ImageList
Introduction
The Image List control allows you to add images to your program, which
you can use in the other Common Controls (Toolbar, TreeView, ListView
etc). To add the ImageList control to your VB project, click
Project|Components, and check the box next to Microsoft Windows
Common Controls x.x where x is the version of Visual Basic you are using.

Build ImageList

Display the first form.
In the Toolbox, click ImageList and click the form

In the Properties window, change its name to imgLarge

Change the ImageSize to 32, 32

Click the ellipsis button of the Images field on Property
New Page 1 Page 2 of 11

In Image Collection Editor, click Add

Locate the folder that contains the current project and display it in the
Look In combo box

Select Babies.ico and click Open

In the same way, add the other pictures in the following order:
Teens.ico, Women.ico, Men.ico, and Misc.ico

Click OK

In the Toolbox, click ImageList and click the form

In the Properties window, change its name to imgSmall

In the Properties window, click the ellipsis button of the Images field

In Image Collection Editor, click Add

Select Babies.ico, Teens.ico, Women.ico, Men.ico, and Misc.ico

Click OK

Using ImageList: get picture from ImageList by Index

Practical Learning 1: display pictur from ImagelIst

Build 1 form with Pictue box Picture1 and ImageList ImageList1

Write code on button

Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As

System.EventArgs) Handles Button1.Click
New Page 1 Page 3 of 11

PictureBox1.Image = ImageList1.Images(0)

End Sub

Practical Learning 2: Using Imagelist to store flag Image

Practical Learning 3: Use an ImageList control to animate a

series
Diplay a rorating moon with 8 icons from library:

Create your icon picture

1. To create an icon, on the main menu, click Project . Add New Item... In
the Add dialog box, click Icon and click New
2. In the Properties window, change the Filename to Babies.ico and design
the icon as follows:
New Page 1 Page 4 of 11

3. Right-click a white area in the main window and click New Item Type...
In the New Icon Image Type dialog box, make sure 16x16, 16 colors is
selected and click OK

4.
5. Design the icon as follows:
New Page 1 Page 5 of 11

6. To create another icon, on the main menu, click Project . Add

Resource...In the Add Resource dialog box, click Icon and click New
7. In the Properties window, change the Filename to Teens.ico and design it
as follows:

8. As done above, display the New Icon Image dialog box and select 16x16,
16 colors
9. Design the icon as follows:

10. To create another icon, on the main menu, click Project . Add
Resource...In the Add Resource dialog box, click Icon and click New
11. In the Properties window, change the Filename to Women.ico and design
it as follows:
New Page 1 Page 6 of 11

12. As done above, display the New Icon Image dialog box and select 16x16,
16 colors
13. Design the icon as follows:

14. In the Properties window, change the Filename to Men.ico and design it
as follows:

15. As done above, display the New Icon Image dialog box and select 16x16,
16 colors
16. Design the icon as follows:
New Page 1 Page 7 of 11

17. In the Properties window, change the Filename to Misc.ico and design it
as follows:

18. As done above, display the New Icon Image dialog box and select 16x16,
16 colors
19. Design the icon as follows:

.NET Controls: The Toolbar

Overview of the Toolbar
Introduction
New Page 1 Page 8 of 11

The toolbar is a very popular and much-used addition to a programme. It's

difficult to think of a piece of software that doesn't make use of them.
VB.NET lets you add toolbars to your forms, and the process is quite
straightforward. Let's see how it's done:

Adding a Toolbar
Either start a new Windows project, if your prefer (or have just joined us), or
keep the one you currently have from the previous section. To add a toolbar to
the top of your form, expand the Toolbox and locate the Toolbar control (you
may have to scroll down to see it.) Double click the Toolbar control, and it
will be added to the top of your form. However, there's not much to see, at the
moment.

Toolbars work by adding buttons and images to them. The button is then
clicked, and an action performed.

Click on your Toolbar to select it. In the property box for the Toolbar, you'll
notice that it has the default Name of ToolBar1. We'll keep this Name. But
locate the Buttons (Collection) property, and click the button with the three
dots in it. This brings up the ToolBarButton Collection Editor.
To add a new button to your toolbar, click the Add button:
New Page 1 Page 9 of 11

Each button on the toolbar has it's own properties and methods. The button
you have just added has a default Name of ToolBarButton1. This is not
terribly descriptive. What we're going to do is add three toolbar buttons: one
to create a new file, one to open a file, and one to save a file. So,

Click the Name property and change it to tbrFileNew

Click Add to create a second button

Change the Name of this to tbrFileOpen

Add a third button and change the Name property to tbrFileSave

Then click OK

Your toolbar will look like this:

The buttons, however, might look a bit small. You can change the height and
width of them by clicking the Toolbar control to select it. Then locate the
ButtonSize property in the properties box.

Adding Images to your Toolbar Buttons

New Page 1 Page 10 of 11

Setting from Image property

Adding other controls to your Toolbar Buttons

From dropdownlist

Coding for your Toolbar Buttons

The same to menu coding

Practical Learning 1: write a flag application.

New Page 1 Page 11 of 11