How To Create Custom Progress Bar Using Visual Basic

Download Visual Basic code for this article here: visual-basic-custom-progress.zip

Who should read this article?

This article is intended for programmers studying Visual Basic programming language. It may be interesting for advanced Visual Basic programmers as well.

Prerequisites

You will need a basic knowledge of the Visual Basic programming language and Microsoft Visual Basic 6.0 development environment installed at your computer.

Why you need to use progress bar in your applications?

Usually progress bar is used to visualize some continuous process. The user can see the total progress and psychologically waiting become less tiring and annoying for him. It is much better to see progress bar then hourglass cursor. Therefore, you need to use progress bar, if your application implements some complex or continuous calculations or data processing. Your application will look more professionally.

When you may need custom progress bar?

Standard progress bar is included in the Visual Basic distributive and it is suitable for most cases. But sometimes you may want to create your own custom progress bar. For example:

1. Standard progress bar does not fit to your application user interface design.
2. Standard progress bar is too complex or too "heavy" for your simple application.
3. Standard progress bar is part of the mscomctl.ocx ActiveX controls library, but you do not want to include additional files in your application package.
4. etc.

I think you can imagine your own reason when you may need custom progress bar.

Lightweight progress bar design

A Label is one of the simplest Visual Basic controls. It is a graphical lightweight control, which requires fewer system resources than other Visual Basic controls. Lets build our progress bar using two Label controls.

Place the following Label controls at your Form:

1. The lblBack Label control will represent progress bar background. It is absolutely static. All properties for this control can be set at design time.
2. The lblFace Label control will represent face of our progress bar. Top, Left and Height properties should be the same as corresponding properties of the lblBack Label control. The Width property of the lblFace should be set to 0 at design time. It will be changed dynamically at runtime.

Set the following properties for both Label controls:

1. Appearance: 0 - Flat
2. BorderStyle: 1 - Fixed Single

You can choose other properties like Font, BackColor, ForeColor, etc. of these Label controls depending of your taste.

Progress bar implementation and Visual Basic code

Our progress bar will use a range, which can be specified by Min and Max Long integer values during initialization process, and internal counter, which will be used for progress visualization. Progress bar internal counter value is represented with the Long integer type variable and can be an integer value from 1 to 2,147,483,647. An absolute value of the range cannot exceed that value.

First of all we need to create some form level variables that will keep our progress bar state during calculations:

1. m_iMin - minimal range value. We will need it to calculate current progress position correctly.
2. m_iValue - current progress bar counter value, i.e. current progress position.
3. m_iMaxValue - maximal progress bar counter value. It will be calculated during initialization from the Min and Max range values.
4. m_sWidth - progress bar control width. It is the lblBack.Width value.

	Private m_iMin As Long
	Private m_iValue As Long
	Private m_iMaxValue As Long
	Private m_sWidth As Single

Now we need to create initialization code. Lets create InitProgress sub procedure. It takes two ByVal arguments that are minimal and maximal values of the progress range:

	Private Sub InitProgress(ByVal iMin As Long, ByVal iMax As Long)

Save progress bar control width value and minimal range value:

	m_sWidth = Me.lblBack.Width
	m_iMin = iMin

Calculate maximal progress bar counter value. Minimal counter value is 1.

	If iMin = 1 Then
		m_iMaxValue = iMax
	Else
		m_iMaxValue = Abs(iMax - iMin)
		If iMin < 1 Then
			m_iMaxValue = m_iMaxValue + 1
		End If
	End If
	m_iValue = 1
	End Sub

We don't need any additional initialization steps.

Lets create SetProgress sub procedure, which will display current progress bar state. It takes one ByVal argument, which is a value from the range specified during the initialization. It is the current position within the range.

	Private Sub SetProgress(ByVal iValue As Long)

Normalize current progress value, i.e. shift it to the diapason from 1 to m_iMaxValue:

	m_iValue = Abs(iValue - m_iMin) + 1

Draw progress bar, i.e. calculate current width of the lblFace Label control depending on the current progress value:

	With Me.lblFace
		.Width = (m_iValue * m_sWidth) / m_iMaxValue
		.Caption = CStr(Int(m_iValue * 100 / m_iMaxValue)) & "%"
	End With

Let the operating system to redraw form and to process other events:

	DoEvents
	End Sub

That's all! Our progress bar is ready to be used. You need to call InitProgress sub one time to initialize progress bar state and then call SetProgress sub during your continuous process to show progress state.

We have created lightweight and highly customizable progress bar.

How to use sample Visual Basic code

Here are some recommendations on how to use sample Visual Basic code:

1. Unpack visual-basic-custom-progress.zip into a single folder on your computer.
2. Run compiled executable Project1.exe. It doesn't require any additional DLLs except Visual Basic run-time.
3. Or load Project1.vbp in your Visual Basic development environment to view sample sources.

How to customize your progress bar

Proposed progress bar implementation technique is quite flexible, so you have a lot of ways to improve your progress bar. For example:

1. Set your own font, size, filling and borders.
2. Change Height property instead of Width property and create vertical progress bar.
3. Create right-to-left or bottom-to-top progress bars.
4. Use Image control instead of Label control. It is also graphical lightweight control, but allow using pictures.

Last note

I have used Microsoft Visual Basic 6.0 to create sample code. But as you can see we do not use any Visual Basic 6.0 specific functionality. Therefore, described code should work in any prior version of Visual Basic or Visual Basic for Application.