Click here to Skip to main content
Licence 
First Posted 15 Oct 2003
Views 92,748
Bookmarked 33 times

ImageCombobox in VB.NET

By | 15 Oct 2003 | Article
A comboBox that displays an icon and a text for each item

Sample Image - ImageComboBox_VBNET.jpg

Introduction

This is a simple combobox that displays icons to the user. It is similar to the imageComboBox in VB. I saw many examples like this made in  C#, so I decided to make a VB one.

You have to create an ImageList, load images to it and then set the ComboIcon.ImageList property to this ImageList. Once this is done you can add items. I made also a class for the Item (ComboBoxIconItem) which is a simple class that stores the imageIndex (in the imageList) of the item and its text.

The ComboIcon Class inherits from the ComboBox of course. It has just an Override to the Draw_Item Sub. In the override we make the combo Owner_draw and we draw the icon and text in case there is an imageIndex in the ImageList for the Icon. If not, we load only the text to the combo.

Code

The ComboIcon class has these Overrides:

Private ListaImg1 As New ImageList 
    'It is the ImageList associated to the Combo

Public Sub New()
    DrawMode = DrawMode.OwnerDrawFixed 
        'Set the DrawMode to OwnerDraw
End Sub

Protected Overrides Sub OnDrawItem(ByVal e _
        As System.Windows.Forms.DrawItemEventArgs)
    e.DrawBackground()
    e.DrawFocusRectangle()
    Dim item As New ComboBoxIconItem
    Dim imageSize As New Size
    imageSize = ListaImg1.ImageSize
    Dim bounds As New Rectangle
    bounds = e.Bounds
    Try
        item = Me.Items(e.Index)
        If (item.ImageIndex <> -1) Then
            Me.ImageList.Draw(e.Graphics, bounds.Left, _
                bounds.Top, item.ImageIndex)
            e.Graphics.DrawString(item.Text, e.Font, _
                New SolidBrush(e.ForeColor), bounds.Left + _
                imageSize.Width, bounds.Top)
        Else
            e.Graphics.DrawString(item.Text, e.Font, _
                New SolidBrush(e.ForeColor), bounds.Left, _
                bounds.Top)
        End If
        Catch ex As Exception
        If (e.Index <> -1) Then
            e.Graphics.DrawString(Items(e.Index).ToString(), e.Font, _
                New SolidBrush(e.ForeColor), bounds.Left, bounds.Top)
        Else
            e.Graphics.DrawString(Text, e.Font, _
                New SolidBrush(e.ForeColor), bounds.Left, bounds.Top)
        End If
    End Try
MyBase.OnDrawItem(e)
End Sub

That's it. The ComboBoxIconItem is very simple, it just has  2 properties: text and imageIndex, that is the imageindex of the image in the imagelist that should be displayed with the Item.

Using the code

So, in the Form, or where you want to put the comboBox you just have to write this code:

Dim MyCombo As New ComboIcon 'Create the Combo
MyCombo.ImageList = ImageList1 
    'Associates the Combo to an ImageList
MyCombo.Items.Add(New ComboBoxIconItem("Bart", 0)) 
    'Add new Item text=Bart image=0 
MyCombo.Items.Add(New ComboBoxIconItem("Marge", 2))
MyCombo.Items.Add(New ComboBoxIconItem("Homer", 1))
MyCombo.Items.Add(New ComboBoxIconItem("Lisa", 3))
MyCombo.Items.Add(New ComboBoxIconItem("Maggie", 4))
Me.Controls.Add(MyCombo) 'add the combobox to the form
'Place the combobox in a nice place
MyCombo.Top = 30
MyCombo.Left = 50

Conclusion

That's all. I hope this is useful to you.

License

This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

A list of licenses authors might use can be found here

About the Author

Daniel Presman

Web Developer

Brazil Brazil

Member



Sign Up to vote   Poor Excellent
Add a reason or comment to your vote: x
Votes of 3 or less require a comment

Comments and Discussions

 
You must Sign In to use this message board. (secure sign-in)
 
Search this forum  
 FAQ
    Noise  Layout  Per page   
  Refresh
QuestionEnable Windows XP styles Pinmembergpsaliolasintecsnet5:25 2 May '12  
QuestionGreat!!! but ... how can I translate it for use as visual component? PinmemberXTV0:42 18 Aug '10  
GeneralThanks - Works Great / Image Height Pinmemberaravenwood7:40 10 Jan '10  
Questionselecting an item PinmemberBatyaH0:18 14 Dec '09  
AnswerRe: selecting an item PinmemberMaximv.d.w.10:11 28 Aug '10  
Generalnice work!!! PinmemberShariful Islam20:18 3 Oct '07  
Generalperfect Pinmemberairbase23:23 17 May '07  
GeneralEasy to use PinmemberMarcR.8:18 9 Dec '06  
GeneralRe: Easy to use PinmemberDaniel Presman3:51 19 Dec '06  
QuestionShowing the image PinmemberTroy Lundin17:19 13 Mar '06  
AnswerRe: Showing the image Pinmemberkamaraju20:34 26 Sep '06  
GeneralEvent Handling PinmemberXYZ22712:59 22 Jan '06  
GeneralRe: Event Handling PinmemberXYZ22713:06 22 Jan '06  
Generaluse Pinmemberpeterfrylol18:43 8 Mar '05  
GeneralRe: use PinsussAnonymous2:31 9 Mar '05  
GeneralRe: use Pinmemberpeterfrylol20:05 9 Mar '05  
GeneralGood Idea Pinmemberhachache2:55 3 Dec '03  
Generalsome problem Pinmembermahrayan17:57 16 Nov '03  
GeneralRe: some problem Pinmemberpresmad23:48 3 Dec '03  
GeneralVery good!!! PinmemberJoão Fornari Jr.4:10 28 Oct '03  
GeneralSuggestion PinmemberMichael P Butler22:42 19 Oct '03  

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

Permalink | Advertise | Privacy | Mobile
Web01 | 2.5.120517.1 | Last Updated 16 Oct 2003
Article Copyright 2003 by Daniel Presman
Everything else Copyright © CodeProject, 1999-2012
Terms of Use
Layout: fixed | fluid