ITSourceCode.com

We Exist to Provide 100% Free Source Code and Tutorials

Custom Search

How to Create a Bouncing Ball in VB.Net

In this tutorial, I’m going to teach you how to create an animated ball in VB.Net. With this, the ball moves and bounces in every side of the Form. And it also beeps when it reaches the sides.

 

 

Let’s begin:

 

 

Open the Visual Basic and create a new Windows Form Application. Add the timer and the Label which is the title of the Project. It will look like this.
bouncingballform
After setting up the Form, double click the Timer to fire the Timer_Tick event handler. After that, declare all the variables that are needed.

  1. Private bSize As Integer = 8 'FRACTION OF BALL SIZE
  2. Private move_Size As Integer = 4 'FRACTION OF CLIENT AREA
  3. Private btmp As Bitmap
  4. Private bPositionX As Integer
  5. Private bPositionY As Integer
  6. Private bRadiusX As Integer
  7. Private bRadiusY As Integer
  8. Private bMoveX As Integer
  9. Private bMoveY As Integer
  10. Private bBitmapWidth As Integer
  11. Private bBitmapHeight As Integer
  12. Private btmpWidthMargin As Integer
  13. Private btmpHeightMargin As Integer

In the Timer_Tick method, set the movement of the ball.

  1. Private Sub Timer1_Tick(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Timer1.Tick
  2. 'SET A VARIABLE TO OBTAIN THE GRAPHICS OBJECT.
  3. Dim grafx As Graphics = CreateGraphics()
  4. 'DRAW THE BALL IN THE FORM.
  5. grafx.DrawImage(btmp, _
  6. CInt(bPositionX - bBitmapWidth / 2), _
  7. CInt(bPositionY - bBitmapHeight / 2), _
  8. bBitmapWidth, bBitmapHeight)
  9. grafx.Dispose()
  10. 'SET THIS TO INCREAMENT THE POSITION OF THE BALL BY ITS DISTANCE TO MOVED BOTH X AND Y AXIS.
  11. bPositionX += bMoveX
  12. bPositionY += bMoveY
  13. 'SET THE REVERSE THE DIRECTION OF THE BALL WHEN IT HITS TO THE BOUNDARY.
  14. If bPositionX + bRadiusX >= ClientSize.Width _
  15. Or bPositionX - bRadiusX = ClientSize.Height _
  16. Or bPositionY - bRadiusY <= 90 Then
  17. bMoveY = -bMoveY
  18. Beep()
  19. End If
  20. End Sub

After setting up the movement of the ball, create a class control that overrides the OnResize method. OnResize method increases the resize event and it occurs when the control is resized.

  1. Protected Overrides Sub OnResize(ByVal ev_arg As EventArgs)
  2.  
  3. Dim grafx As Graphics = CreateGraphics()
  4.  
  5. 'CLEAR ANY DRAWINGS.
  6. grafx.Clear(BackColor)
  7.  
  8. 'SET A VARIBLE THAT HOLDS THE RADIUS OF THE BALL
  9. 'AND SET THE WIDTH OR THE HIEGHT OF IT TO A FRACTION WHICHEVER IS LESS TO THE CLIENT AREA.
  10. Dim dbl_Radius As Double = Math.Min(ClientSize.Width / grafx.DpiX, _
  11. ClientSize.Height / grafx.DpiY) / bSize
  12.  
  13. 'SET THE HIEGHT AND WIDTH OF THE BALL.
  14. bRadiusX = CInt(dbl_Radius * grafx.DpiX)
  15. bRadiusY = CInt(dbl_Radius * grafx.DpiY)
  16. grafx.Dispose()
  17.  
  18. 'SET THE DISTANCE THAT THE BALL MOVES INTO 1 PIXEL OR THE BALL SIZE WHICHEVER IS GREATER.
  19. 'THIS MEANS THAT THE DISTANCE OF THE BALL MOVES EACH TIME IS PROPORTIONAL TO ITS SIZE,
  20. 'WHICH IS ALSO PROPORTIONAL TO THE SIZE OF THE CLIENT AREA.
  21. 'THE BALL SLOWS DOWN WHENEVER THE CLIENT AREA IS SHRUNK
  22. 'AND THE BALL SPEEDS UP WHEN IT IS INCREASED.
  23. bMoveX = CInt(Math.Max(1, bRadiusX / move_Size))
  24. bMoveY = CInt(Math.Max(1, bRadiusY / move_Size))
  25.  
  26. 'SET THE VALUE OF THE BALL'S MOVEMENT SERVES AS THE MARGIN AROUND THE BALL,
  27. 'THAT DETERMINES THE ACTUAL SIZE OF BITMAP ON WHICH THE BALL IS DRAWN.
  28. 'SET THE DISTANCE OF THE BALL MOVES IS EQUAL TO THE SIZE OF THE BITMAP,
  29. 'WHICH ALLOWS THE PREVIOUS BALL'S IMAGE TO BE ERASED BEFORE THE NEXT IMAGE IS DRAWN
  30. btmpWidthMargin = bMoveX
  31. btmpHeightMargin = bMoveY
  32.  
  33. 'TO FIND OUT THE ACTUAL SIZE OF THE BITMAP ON WHICH THE BALL IS DRAWN
  34. 'PLUS THE MARGINS TO THE BALL'S DIMENSIONS.
  35. bBitmapWidth = 2 * (bRadiusX + btmpWidthMargin)
  36. bBitmapHeight = 2 * (bRadiusY + btmpHeightMargin)
  37. 'CREATE A NEW WIDTH AND HEIGHT OF THE BITMAP.
  38. btmp = New Bitmap(bBitmapWidth, bBitmapHeight)
  39. 'OBTAIN THE GRAFIX OBJECT SHOWN BY THE BITMAP.
  40. grafx = Graphics.FromImage(btmp)
  41. 'CLEAR THE EXISTING BALL AND DRAW A NEW BALL.
  42. With grafx
  43. .Clear(BackColor)
  44. .FillEllipse(Brushes.Green, New Rectangle(bMoveX, _
  45. bMoveY, 2 * bRadiusX, 2 * bRadiusY))
  46. .Dispose()
  47. End With
  48.  
  49. 'RESET THE POSITION OF THE BALL TO THE CENTER OF THE CLIENT AREA.
  50. bPositionX = CInt(ClientSize.Width / 2)
  51. bPositionY = CInt(ClientSize.Height / 2)
  52. End Sub

After creating a method, go back to the Design Views ,double click the Form and start the timer in the first load of the Form.

  1. Private Sub Form1_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
  2. Timer1.Start()
  3. End Sub

You can the download the complete source code on your computer.
Download HERE

Facebook Comments

Check Your Domain Ranking

Leave a Reply

Your email address will not be published. Required fields are marked *

ITSourceCode.com © 2016 Frontier Theme

Subscribe For Latest Updates

Signup for our newsletter and get notified when we publish new articles for free!