+- Hack Forums (https://hackforums.net)
+-- Forum: Tech (https://hackforums.net/forumdisplay.php?fid=444)
+--- Forum: Coding (https://hackforums.net/forumdisplay.php?fid=151)
+---- Forum: Software Development (https://hackforums.net/forumdisplay.php?fid=118)
+---- Thread: [.NET] [TUT] Animated Drop Down Menu [N00B FRIENDLY]] (/showthread.php?tid=987871)
[TUT] Animated Drop Down Menu [N00B FRIENDLY]] - Cody8295 - Jan 18, 2011
Simple Animated Drop Down Menu
In this tutorial I will show you how to make a very simple animated drop down menu.
Note: This is in VB.NET
Here is what the final solution will look like:
![[Image: Uwjjr.gif]](https://i.imgur.com/Uwjjr.gif)
1.) Create a new project and give it a name.
[img]http://content.screencast.com/users/codydv/folders/Jing/media/9238c78f-b316-4870-ad87-cbb6ccefaa93/2011-01-18_2206.png[/img]
2.)Put 1 button and 1 panel on your form however you want. I made the panel right under the button so it looks nice and gives a good animation.
[img]http://content.screencast.com/users/codydv/folders/Jing/media/4ec006f4-0fa9-42d3-bcd9-669c3593609a/2011-01-18_2213.png[/img]
3.)Make some stuff in your menu. Could be text, buttons, images, anything. I just made some text for the example.
[img]http://content.screencast.com/users/codydv/folders/Jing/media/818ff1a8-1d42-4069-b0b7-114b46d27ecd/2011-01-18_2215.png[/img]
4.) Double click on the button to goto the code. The code for the button is this (with explanation in comments):
Code
' Code and tutorial by Cody8295
If Panel1.Visible = True Then ' Checks if panel1 is visible, if it is, run the code below.
Button1.Text = "Open Menu" ' Changes the text on the button to "Open Menu" because we are closing it.
While Panel1.Height > 2 ' Run the code below while panel1's height is greater than 2.
' The reason I changed the height to 2 is because I want the panel's height to be 2 when it is closed.
Panel1.Size = New Size(Panel1.Width, Panel1.Height - 1) ' Subtract panel1's height by 1 each time.
End While ' Don't run the above code anymore!
While Me.Height > 65 ' Run the code below while the form's (me) height is greating than 65.
' Again, the reason I changed the form's height to 65, is because that's how big it will be when the menu is closed.
Me.Size = New Size(Me.Width, Me.Height - 2) ' Subtract the form's height by 1 each time.
End While ' Don't run the above code anymore!
Panel1.Visible = False ' Make panel1 invisible.
Else ' If panel1 isn't visible, forget the above code and run the code below.
Button1.Text = "Close Menu" ' The rest is the same as above almost, so I wont explain it as much.
While Panel1.Height < 245 ' Instead of 245, make it the size of your panel.
Panel1.Size = New Size(Panel1.Width, Panel1.Height + 1)
End While
While Me.Height < 321 ' Instead of 321, make it the size of your form.
Me.Size = New Size(Me.Width, Me.Height + 2)
End While
Panel1.Visible = True
End If5.) Resize your controls to the size you want them to be when the menu is closed.
[img]http://content.screencast.com/users/codydv/folders/Jing/media/0d6a93dd-36a7-4879-acd1-8b296b2973dc/2011-01-18_2229.png[/img]
6.) You are done! Debug and check it out!
Thank you for reading this tutorial.
You may use this code without giving credits.
Thanks to xBroak, for making this function...
Code
Public Sub Expand(ByVal Height1 As String, ByVal Height2 As String, ByVal Height3 As String, ByVal Height4 As String)
If Panel1.Visible = True Then
While Panel1.Height > Height1
Panel1.Size = New Size(Panel1.Width, Panel1.Height - 1)
End While
While Me.Height > Height2
Me.Size = New Size(Me.Width, Me.Height - 2)
End While
Panel1.Visible = False
Else
While Panel1.Height < Height3
Panel1.Size = New Size(Panel1.Width, Panel1.Height + 1)
End While
While Me.Height < Height4
Me.Size = New Size(Me.Width, Me.Height + 2)
End While
Panel1.Visible = True
End If
End SubUsage:
Code
Expand(-,-,-,-)Replace '-' with heights.
* - 0dayleet - Jan 18, 2011
Great tutorial, I already have an idea of what I could do with it.
Thanks.
* - Cody8295 - Jan 18, 2011
(Jan 18, 2011 08:33 PM)Julie Wrote: Great tutorial, I already have an idea of what I could do with it.
Thanks.
Lol, yea. You can create a lot of fun things with this. Thanks for the feedback.
* - Fake. - Jan 18, 2011
Now put it into a function/subroutine so you can easily use it in other projects. It's all about portability :)
* - Thermal™ - Jan 18, 2011
Very well written tutorial, and I'm not going to lie that's a pretty sick concept as well as a outcome.
Keep the tutorials / work coming bud.
* - Oxycodone - Jan 18, 2011
I think nathan posted this already for 08 tho.
* - xIMrMilksIx - Jan 18, 2011
this looks pretty useful! I'm pretty new to all this and that was a very helpful and easy to follow TUT.
* - DaRkReD - Jan 18, 2011
(Jan 18, 2011 08:41 PM)Pi Eater Wrote: I think nathan posted this already for 08 tho.
They are the same languages. Different ide.
* - Fake. - Jan 18, 2011
(Jan 18, 2011 08:41 PM)Pi Eater Wrote: I think nathan posted this already for 08 tho.
Yeah he did, right here: https://hackforums.net/showthread.php?tid=220586
The image of the source is gone, though.
(Jan 18, 2011 08:44 PM)DaRkReD Wrote: They are the same languages. Different ide.
You can take advantage of the .NET Framework 4.0 in VS2010.
* - Cody8295 - Jan 18, 2011
(Jan 18, 2011 08:41 PM)Pi Eater Wrote: I think nathan posted this already for 08 tho.
If he did, I didn't see it. Anyways, thank you everyone for the feedback.
* - versx - Jan 19, 2011
Holy shit this is sweet! Thanks for sharing, I remember seeing something like this a long time ago but it was poorly made.
* - Cody8295 - Jan 19, 2011
(Jan 19, 2011 12:29 AM)versx Wrote: Holy shit this is sweet! Thanks for sharing, I remember seeing something like this a long time ago but it was poorly made.
Lol, you're welcome. And thank you very much for the feedback!
* - xBroak - Jan 19, 2011
Code
Public Sub Expand(ByVal Height1 As String, ByVal Height2 As String, ByVal Height3 As String, ByVal Height4 As String)
If Panel1.Visible = True Then
While Panel1.Height > Height1
Panel1.Size = New Size(Panel1.Width, Panel1.Height - 1)
End While
While Me.Height > Height2
Me.Size = New Size(Me.Width, Me.Height - 2)
End While
Panel1.Visible = False
Else
While Panel1.Height < Height3
Panel1.Size = New Size(Panel1.Width, Panel1.Height + 1)
End While
While Me.Height < Height4
Me.Size = New Size(Me.Width, Me.Height + 2)
End While
Panel1.Visible = True
End If
End SubUsage:
Code
Expand(-,-,-,-)Replace '-' with heights.
* - SIM-135152 - Jan 19, 2011
good one thanks
i maybe use it soon
:D thanks
* - Cody8295 - Jan 19, 2011
(Jan 19, 2011 07:23 AM)xBroak Wrote: Usage:
CodeExpand(-,-,-,-)
Replace '-' with heights.
Cool, thanks for this. Really nice.