Search - Articles
DevASP.NET for ASP.NET, VB.NET, XML and C# (C-Sharp) Developers Tuesday, March 03, 2009
Dev Articles
Search Directory
SQL Server

How we can Create Animated Application Using VB.Net.

Author: DevASP
Download Source Code :

In this article I Will Explain How we can create animated things in Using Timer and some functionality. In many Applications we need to use Such Animated Things.

Creating the Animated Things in seems to be critical but In fact theses types of things are not critical. For such type of application we have the easiest way to create Them using Timer component Given .Net Studio.


To create Animated application Follow Some Steps and Understand Code Below.


1. Create new application Using File menu and Choose project.

Now you will see the form Open in your application.


2. Now Drag the timer component from Toolbox on your Form.


3. Now Double click on timer. That action will make An event of Timer.


4. Use the Properties window to set the individual properties of the Timer you created.


5. Now Initialize some Variables Before the Load Event Means Globally.



Const BALL_TIMER_INTERVAL As Integer = 25       [In milliseconds]

Private intBallSize As Integer = 16       [As fraction of client area]

Private intMoveSize As Integer = 4     [As fraction of ball size]

Private bitmap As Bitmap

Private intBallPositionX, intBallPositionY As Integer

Private intBallRadiusX, intBallRadiusY, intBallMoveX, intBallMoveY, _

      intBallBitmapWidth, intBallBitmapHeight As Integer

Private intBitmapWidthMargin, intBitmapHeightMargin As Integer


6. Now Double Click On Your Form. You Will See That In Code File The Auto Generated Function Appears. Which is In fact Form’s Load Event. Now you can use that Function in your own way. Write these Lines of code in forms load event.


Private Sub Ball_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load

        tmrAnimation.Interval = BALL_TIMER_INTERVAL


End Sub


7. Now write this Routine Which is the Autogenerated Event By Timer. This routine in fact Obtain the Graphics object exposed by the Form. Draw the bitmap containing the ball on the Form. Increment the ball position by the distance it has moved in both X and Y after being redrawn. Reverse the ball's direction when it hits a boundary. Set the Y boundary at 40 instead of 0 so the ball does not bounce into controls on the Form.


Private Sub tmrAnimation_Tick(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles tmrAnimation.Tick

 Dim grfx As Graphics = CreateGraphics()

 grfx.DrawImage(bitmap, _

            CInt(intBallPositionX - intBallBitmapWidth / 2), _

            CInt(intBallPositionY - intBallBitmapHeight / 2), _

            intBallBitmapWidth, intBallBitmapHeight)




        intBallPositionX += intBallMoveX

        intBallPositionY += intBallMoveY


        If intBallPositionX + intBallRadiusX >= ClientSize.Width _

            Or intBallPositionX - intBallRadiusX <= 0 Then

            intBallMoveX = -intBallMoveX


        End If

        If intBallPositionY + intBallRadiusY >= ClientSize.Height _

            Or intBallPositionY - intBallRadiusY <= 40 Then

            intBallMoveY = -intBallMoveY


        End If

    End Sub


8. Now Finally Make the last routine. Which actually Will Do the resize functionality. This method overrides the OnResize method in the base Control class. OnResize raises the Resize event, which occurs when the control (in this case, the Form) is resized. Obtain the Graphics object exposed by the Form and erase any drawings.


Set the radius of the ball to a fraction of the width or height of the client area, whichever is less. Set the width and height of the ball as in most cases the DPI is identical in the X and Y axes. Set the distance the ball moves to 1 pixel or a fraction of the ball's size, whichever is greater. This means that the distance the ball moves each time it is drawn is proportional to its size, which is, in turn, proportional to the size of the client area. Thus, when the client area is shrunk the ball slows down, and when it is increased, the ball speeds up.


Notice that the value of the ball's movement also serves as the margin around the ball, which determines the size of the actual bitmap on which the ball is drawn. Thus, the distance the ball moves is exactly equal to the size of the bitmap, which permits the previous image of the ball to be erased before the next image is drawn, all without an inordinate amount of flickering.


Determine the actual size of the Bitmap on which the ball is drawn by adding the margins to the ball's dimensions. Create a new bitmap, passing in the width and height Obtain the Graphics object exposed by the Bitmap, clear the existing ball, and draw the new ball. Reset the ball's position to the center of the client area.


Protected Overrides Sub OnResize(ByVal ea As EventArgs)



        Dim grfx As Graphics = CreateGraphics()



        Dim dblRadius As Double = Math.Min(ClientSize.Width / grfx.DpiX, _

            ClientSize.Height / grfx.DpiY) / intBallSize


         intBallRadiusX = CInt(dblRadius * grfx.DpiX)

        intBallRadiusY = CInt(dblRadius * grfx.DpiY)



        intBallMoveX = CInt(Math.Max(1, intBallRadiusX / intMoveSize))

        intBallMoveY = CInt(Math.Max(1, intBallRadiusY / intMoveSize))



        intBitmapWidthMargin = intBallMoveX

        intBitmapHeightMargin = intBallMoveY

        intBallBitmapWidth = 2 * (intBallRadiusX + intBitmapWidthMargin)

        intBallBitmapHeight = 2 * (intBallRadiusY + intBitmapHeightMargin)



        bitmap = New Bitmap(intBallBitmapWidth, intBallBitmapHeight)


        grfx = Graphics.FromImage(bitmap)

        With grfx


            .FillEllipse(Brushes.Red, New Rectangle(intBallMoveX, _

                intBallMoveY, 2 * intBallRadiusX, 2 * intBallRadiusY))


        End With



        intBallPositionX = CInt(ClientSize.Width / 2)

        intBallPositionY = CInt(ClientSize.Height / 2)

    End Sub


Now Built and run the Project Your You will see the animated Ball. The source Code is given by this article for your Complete Understanding. Just Run it You Can understand How easily we can create animated Things in

Article Comments
it is very helpfulfor developing the timer based applcation

Posted on 9/22/2006 11:23:17 AM by pradip

Your codes is very nice, clear and helpfull.
I wish you best luck.

Posted on 4/11/2007 3:35:33 PM by murad

This helps me to build a small screensaver, Thanks a lot

Posted on 3/24/2008 10:31:46 PM by Tharindu Dasun

Add Article Comment:
Name :
Email Address :
Comments :
<< Creating Bouncing Ball Application in VB.Net

Disclaimer - Privacy
© 2002-2017