65.9K
CodeProject is changing. Read more.
Home

XtremListBox

starIconstarIconstarIcon
emptyStarIcon
starIcon
emptyStarIcon

3.22/5 (3 votes)

Nov 21, 2007

1 min read

viewsIcon

22490

downloadIcon

122

ListBox control with colored selected item

Screenshot - XtremListBox.jpg

Introduction

Listbox is a control very often used in all applications, mainly for choosing a particular item from a collection of items. However, in the standard ListBox I missed an option to change the color of a selected item, its font and the border color. This article shows how to create your own user control, which will offer a choice of the options described above.

Background

Our new user control will be created on the baseclass of the standard listbox. I called the class which inherits its properties XtremListBox.

Public Class XtremListBox: Inherits System.Windows. Forms. ListBox

Our new class contains all properties of the standard listbox plus my new properties:

  • Border color of a selected item
  • Font color of a selected item
  • Index of the column in which the text to show is saved.
  • Font of a selected item
  • Length of border color change of a selected item on the x-axis

Our new listbox gets the attribute for re-drawing in two ways:

  1. It waits for the SelectedIndexChanged event from the baseclass.
Protected Sub XtremListBox_SelectedIndexChanged(ByVal sender As System.Object, 
    ByVal e As System.EventArgs)  _
Handles MyBase.SelectedIndexChanged
                  _NewDraw()
End Sub
  1. It overrides the WndProc function and catches messages sent by Windows to our control.
Protected Overrides Sub WndProc(ByRef msg As System.Windows.Forms.Message)
                  MyBase.WndProc(msg)
                        Select Case msg.Msg
                             Case &H115, &HF, &H360, &H203, &H20A
                             _NewDraw()
                        End Select
End Sub

&H115, &HF, &H360, &H203, &H20A – are message number(WIN API)

You can find the whole list example on this web site: click here.

When we raise an event or a message to redraw ListBox, the core of our new control — the _NewDraw method — is called. This method redraws the standard blue border of the selected item with a new border which will look according to the properties set and it will also add the relevant text.

    
    Public Sub _NewDraw()
        Dim _DrawText As String
        Dim p1, p2 As System.Drawing.PointF
        Dim i As Integer : Dim index As Integer = 0
        Dim str() As DataStruct

        p1.X = 0 : p1.Y = 0 'Starting points of rectangle

        p2.X = mSmoothWidth : p2.Y = 
            MyClass.ItemHeight 'Finishing points of rectangle

        'This create smooth brush

        brushStandard = New System.Drawing.Drawing2D.LinearGradientBrush(p1,
            p2, mColor, MyClass.BackColor) 

        '1. I get positions of selected items to str(i)._select and I get

        'indexs selected items to str(i)._index

        For i = 0 To MyClass.SelectedIndices.Count - 1
            ReDim Preserve str(i)
            str(i)._select = MyClass.GetItemRectangle(
                MyClass.SelectedIndices.Item(i))
            str(i)._index = MyClass.SelectedIndices.Item(i)
        Next
 
        If Not IsNothing(str) Then
            For i = 0 To UBound(str)
                '2. I draw rectangle to selected items positions

                MyClass.CreateGraphics.FillRectangle(brushStandard, 0,
                    str(i)._select.Y, MyClass.Width, MyClass.ItemHeight)
                '3. I draw text to new rectangles

                If MyClass.Items.Item(0).GetType.Name = "String" Then
                    _DrawText = MyClass.Items.Item(str(i)._index)
                Else
                    If MyClass.Items.Item(0).item(mTextCol).GetType.Name = 
                        "String" Then
                        _DrawText = MyClass.Items.Item(str(i)._index).item(
                            mTextCol)
                    Else
                        _DrawText = ""
                    End If
                End If
                MyClass.CreateGraphics.DrawString(_DrawText, mFFont,
                    mFFontColor, 0, str(i)._select.Y)
            Next
        End If
        brushStandard.dispose()
    End Sub

Conclusion

I hope that you find this example useful, especially if you are a beginner coder, to orientate in this issue and to find a way to create your own usercontrols.

History

First release 14.11.2007