Sinisterly
[TUTORIAL] How to show multiple forms in only 1 form? - Printable Version

+- Sinisterly (https://sinister.ly)
+-- Forum: Coding (https://sinister.ly/Forum-Coding)
+--- Forum: Visual Basic & .NET Framework (https://sinister.ly/Forum-Visual-Basic-NET-Framework)
+--- Thread: [TUTORIAL] How to show multiple forms in only 1 form? (/Thread-TUTORIAL-How-to-show-multiple-forms-in-only-1-form)

[TUTORIAL] How to show multiple forms in only 1 form? - Platinum - 07-10-2013

How to show multiple forms in only 1 form?

Hey guys, in this tutorial I will be explaining how I make it possible to show multiple forms at the same time. For example you make a tools application and you want a sort of toolbox form to display behind the main form, this is how to do it!

What you need before starting
All you need is 2 forms that are accessible.
Make sure this property is set on your second form:
ShowInTaskbar: False

What refers to what?
<First Form> will refer to your main form!
<Second Form> will refer to your second form (the one we'll be adding)

1. Adding timers.
In this example for this tutorial I will be using 2 timers. In fact to make 2 forms work together only requires 1 timer. For the sake of this tutorial I recommend you to follow every step and also add everything I do, even the timers.

Add a timer to your main form and call it ChargeBatteryTimer. Set the interval to about 2000 ms. Go to your second form and also add a timer there, name it LocationTimer and set the interval to 1 ms (yes 1!).

2. Adding the items.
On your <Second Form> add a button, give it any text and styling you like.
Now go to your <First Form> and add a ProgressBar, name it Battery and make sure it's maximum value is 100 and the default value is 0.

3. Scripting the <First Form> Load handler
Double click your <First Form> to make a <First Form>_Load handler. What you can also do is go to the code, select <First Form> Events and then Load.
Now we are going to script this main form.
What you'll want to add is these lines of code:
Code:
Dim <Second Form> As New <Second Form>()
<Second Form>.Show(Me)
Now be sure to change <Second Form> with the name of your second form!

Allow me to explain these codes. What you basically do is create a new form display for the second form. The reason why we add 'Me' is to make your <First Form> 'owner' of the second form. If we don't do this we will have problems with the second form. ie: If you would click away from the <First Form> and then go back to it through the taskbar it would not display the <Second Form> with it. The reason for that is that by default your Desktop is owner of the form... I know, that's strange.

4. Scripting the progressbar
Go back to your <First Form> design and doubleclick on the timer named 'ChargeBatteryTimer'. Now add these lines of code:
Code:
If Battery.Value = Battery.Maximum Then
    ChargeBatteryTimer.Stop()
Else
    Battery.Increment(20)
End If
What this code will do when every time the timer ticks it adds a value of 20 to the progressbar as long as the value is not 100. If the value is 100 we stop the timer. Remember that we set this timer to 2000 ms? 2000ms is equal to 2 seconds, so when this timer starts it will tick every 2 seconds. That means it will take 10 seconds to get the progressbar to a value of 100 and stop this timer. We will start this timer in the next form, so let's move on!

5. Setting the location for the <Second Form>
For this tutorial we will be displaying the <Second Form> under the <First Form>.
Do the same as for the <First Form> Load handler:
Quote:Double click your <Second Form> to make a <Second Form>_Load handler. What you can also do is go to the code, select <Second Form> and then Load.
All you need to do is start the timer named 'LocationTimer' that you added. Add this code:
Code:
LocationTimer.Start()
Now go back to your <Second Form> Design and double click on the timer that you added and named 'LocationTimer'.
Now remember that we set the interval to 1? Yes just 1, this timer will update very quickly. Now every time this timer will tick it will set the location of the second form. Add this code to the timer tick:
Code:
Me.Top = <First Form>.Bottom
Me.Left = <First Form>.Right - <First Form>.Width
What this does is it sets the top location to the very bottom of your first form and sets the left location to your first form's right location minus the width of your first form. Now since this timer ticks every 1 ms it updates very quickly, so once you move your <First Form> it will pretty much update the location of your <Second Form> automatically.

6. Coding the button
Go back to your <Second Form> design and double click the button you added. Now add this code:
Code:
If <First Form>.Battery.Value = 100 Then
            <First Form>.Battery.Value = 0
        End If
        Main.ChargeBatteryTimer.Start()
What this does is it starts the other timer you've made and coded and checks if the progress bar has a value of 100. If it does then it resets it.

7. You're done! Some final extra adjustments..
Your two forms should be ready now and displaying under 1 form!
We aren't fully done with the button's code though. Change the old code to this:
Code:
If Not Main.ChargeBatteryTimer.Enabled = True Then
            If Main.Battery.Value = 100 Then
                 Main.Battery.Value = 0
            End If
            Main.ChargeBatteryTimer.Start()
        End If

Now what this extra code does is it checks if the timer is not running yet, if it's not then it performs the code but if it is running it simply does nothing. This prefents a bit of spam and bugs. Remember that we made the timer stop itself automatically once the progressbar reached a value of 100? Good. Sleepy


*I'm actually looking for a better way to update the second form's location, stay tuned! I will also add coloring some time...*

Remember if you liked this tutorial then rate it and feel free to leave a comment! Tongue

With best regards and best of luck,
Platinum a la Gorateron

RE: [TUTORIAL] How to show multiple forms in only 1 form? - ZherkTG - 07-11-2013

good tutorial, thanks ima be trying this

RE: [TUTORIAL] How to show multiple forms in only 1 form? - Hexology - 07-11-2013

Interesting, I usually just do it the lazy way and have a button do me.hide() and form2.show().

RE: [TUTORIAL] How to show multiple forms in only 1 form? - Platinum - 07-11-2013

(07-11-2013, 12:06 PM)Hexology Wrote: Interesting, I usually just do it the lazy way and have a button do me.hide() and form2.show().

Well the purpose of this is that you can show multiple forms at the same time without clicking anything at all, and on top of that the other forms also show if you focus the main form Wink What you could potentially add is a snap-desnap feature to snap forms together Biggrin (Might do a tutorial on that too some time)

RE: [TUTORIAL] How to show multiple forms in only 1 form? - Wet - 07-15-2013

I've always kept you an intelligent member. You proved me it with this HQ tutorial. Good job!

RE: [TUTORIAL] How to show multiple forms in only 1 form? - Platinum - 07-15-2013

Thanks for that great compliment ! =D