|
|
|
| Title | Make a custom gauge control with a toolbox bitmap in VB .NET |
|---|
| Description | This example shows how to make a custom Gauge control from scratch in Visual Basic .NET. This example also shows how to set a toolbox bitmap. The control lets the user click and drag to select a value from a smoothly scrolling bar much as a scroll bar but without the scroll bar's thumb or arrow buttons. You could modify the control to provide a different appearance or behavior. For example, you could make it allow the user to select fractional values. |
|---|
| Keywords | gauge, control, custom control, VB .NET, UserControl |
|---|
| Categories | VB.NET, Graphics, Controls |
|---|
|
|
|
To create the control project, open the File menu's New submenu and select Project. Select the Windows Control Library project template, enter the project's location and name, and click OK. Rename the default control UserControl1 to something more meaningful.
To give the control a toolbox bitmap, make a 16-by-16 pixel bitmap. Set the pixel in the lower left corner to the color you want to be transparent in the toolbox.
To embed the bitmap file in the project, open the Project menu and select Add Existing Item. Select the file to add it to the Solution Explorer. In the file selection dialog, set the "Files of type" dropdown to All Files so you can see the files.
Click on the file in Solution Explorer and open the Properties window. Select the file's Build Action property, click the dropdown arrow on the right, and select Embedded Resource. Now when you compile the program, the bitmap file is embedded as a resource in the application.
To assign the bitmap to the control, open the control in the code editor and add a ToolboxBitmap attribute to the control's Class statement as shown in the following code. Note the line continuation character. The attribute is part of the same line that contains the Class statement. The parameters to this attribute's constructor are the class's type and the name of the bitmap file that you embedded in the project.
|
|
<ToolboxBitmap(GetType(HRectGauge), "tbxHRectGauge.bmp")> _
Public Class HRectGauge
Inherits System.Windows.Forms.UserControl
...
End Class
|
|
|
The HRectGauge control provides BorderStyle, Minimum, Maximum, and Value properties. These are relatively straighforward so only the Value property procedures are shown here. The Property Get procedure returns the value stored in m_Value. The Property Set procedure saves the new value in m_Value and calls DrawGauge to redraw the control. It then raises the ValueChanged event so a program that uses the control knows when the user changed the value.
|
|
Private m_Value As Integer = 75
Public Property Value() As Integer
Get
Return m_Value
End Get
Set(ByVal Value As Integer)
m_Value = Value
DrawGauge()
RaiseEvent ValueChanged()
End Set
End Property
|
|
|
The control also calls DrawGauge to redraw itself when the user changes its BorderStyle, Minimum, or Maximum properties, and when the control resizes or receives a Paint event.
Subroutine DrawGauge clears the control and then fills part of its surface to indicate the current Value. Subroutine DrawBorder isn't central to this example so it's not shown here. See the code for the details.
|
|
' Draw the gauge.
Private Sub DrawGauge()
If m_Minimum >= m_Maximum Then Exit Sub
' Fill the bar.
Dim gr As Graphics = Me.CreateGraphics()
gr.Clear(Me.BackColor)
gr.FillRectangle( _
New SolidBrush(Me.ForeColor), _
0, 0, _
CInt(Me.DisplayRectangle.Width * m_Value / _
(m_Maximum - m_Minimum)), _
Me.DisplayRectangle.Height)
' Draw the border.
DrawBorder(gr, Me.DisplayRectangle, m_BorderStyle)
End Sub
|
|
|
When the user presses the mouse down on the control, drags the mouse, and releases the mouse, the program calls subroutine SetValueFromX to set the appropriate Value. Subroutine SetValueFromX sets the Value property not the m_Value variable so the Property Set procedure redraws the control.
|
|
Private m_Dragging As Boolean
Private Sub HRectGauge_MouseDown(ByVal sender As Object, _
ByVal e As System.Windows.Forms.MouseEventArgs) Handles _
MyBase.MouseDown
SetValueFromX(e.X)
m_Dragging = True
End Sub
Private Sub HRectGauge_MouseMove(ByVal sender As Object, _
ByVal e As System.Windows.Forms.MouseEventArgs) Handles _
MyBase.MouseMove
If Not m_Dragging Then Exit Sub
SetValueFromX(e.X)
End Sub
Private Sub HRectGauge_MouseUp(ByVal sender As Object, _
ByVal e As System.Windows.Forms.MouseEventArgs) Handles _
MyBase.MouseUp
m_Dragging = False
SetValueFromX(e.X)
End Sub
' Set the control's Value based on this X coordinate.
Private Sub SetValueFromX(ByVal X As Integer)
Dim new_value As Integer = _
CInt(m_Minimum + _
(m_Maximum - m_Minimum) _
* (X - Me.DisplayRectangle.X) _
/ Me.DisplayRectangle.Width)
If new_value < m_Minimum Then new_value = m_Minimum
If new_value > m_Maximum Then new_value = m_Maximum
Value = new_value
End Sub
|
| |
|
| |
|
|
