Some applications simply load when you launch them. Others load with style. You can make your Visual Basic applications stand out from the digital crowd by adding a customised loading bar to the program's start-up form. You won't find a loading bar in the Visual Studio toolbox, but you will find components you can use to build one. Simply drag a few controls onto your form, tweak their colours and impress your users with a cool animated loading bar that greets them when they launch your application.
- Skill level:
Launch Visual Studio and open one of your Visual Basic.NET projects. Open the Solution Explorer that contains the project's files if it Is not open.
Locate the icon for your project's start-up form in the Solution Explorer. Double-click that icon. Visual Studio opens the design window and displays the form.
Open the toolbox and drag a "GroupBox" control onto the form. Return to the toolbox and drag a "ProgressBar" control into the group box you added to the form.
Return to the toolbox and drag a "Label" control onto the form. Click that label and drag it above the progress bar you added to the form. Position the label and progress bar so that their left edges align.
Return to the toolbox a final time, and drag a "Timer" control onto the form. Close the toolbox.
Click the timer that you added to the form, and press "F4" to open the "Properties" window. Click the "Events" icon at the top of that window to display a list of events.
Double-click the "Tick" event. Visual Studio opens the code window and displays the "Timer1_Tick" sub. This sub runs whenever the timer ticks.
Paste the following code within the body of that sub:
loadingBarValue += increment
If loadingBarValue > 100 Then
loadingBarValue = 100
GroupBox1.Visible = False
ProgressBar1.Value = loadingBarValue
The final statement causes the progress bar's visual indicator to move by the value stored in the variable named "loadingBarValue." That variable - set to zero when your form loads - increases by the value stored in the "increment" variable. Since the value of "increment" is 1, the value of "loadingBarValue" increases by 1 every time the "Load" sub runs. When the progress bar's value reaches the maximum value of 100, the timer stops. The group box containing the progress bar and the label disappears automatically.
Press "F7" to return to the design view and double-click the form's title bar. Visual Studio opens the code window again and displays the form's "Load" sub. Paste the following code within the body of that sub:
loadingBarValue = 0
Timer1.Interval = 200
increment = 1
GroupBox1.Text = ""
Label1.Text = "Loading"
Label1.BackColor = Color.Transparent
Label1.ForeColor = Color.Green
The first statement initialises the "LoadingBarValue" to zero. The second statement sets the number of milliseconds the timer pauses between clicks. That value is 200 in this example. Making this number larger makes the loading animation move slower. The "increment" variable determines how far the progress bar moves whenever the timer ticks. That value is 1. Making this value larger makes the loading animation move faster. Change the word "Loading" to anything you like or leave the default value. The next two lines control the label's background and foreground colours. Change those values to any colours you like or leave them as "Transparent" and "Green." The final statement starts the timer.
Move to the top of the code window and locate the "Class" declaration. Paste these two statements below that declaration:
These two statements define the "loadingBarValue" and "increment" variables described in the previous step.
Press "F5" to run the project. The progress bar - which looks like a loading bar - appears. The label containing the text you set for the label appears above the bar. An animated green bar moves slowly from left to right on the bar until it reaches the end of the bar. When that happens, the label and bar disappear.
Tips and warnings
- Position the label and group box anywhere you like on the form by dragging the group box control. Since the label and progress bar are inside the group box, they move as a unit, making it easier to position them. You can also experiment with the colours by changing the label's foreground and background colours to different values. The label's default "green" colour in this example produces a harmonious visual effect because its colour matches the colour of the animated bar that moves from left to right as your application loads.
- 20 of the funniest online reviews ever
- 14 Biggest lies people tell in online dating sites
- Hilarious things Google thinks you're trying to search for