Creating a Pick 3 Lotto Game in Flash

How to Have Flash Make You Rich with a Little Bit of Luck

Neil Mey
Neil Mey, Yahoo! Contributor Network
Jun 11, 2009 "Share your voice on Yahoo! websites. Start Here."
  1. Open Flash and create a new flash document
  2. We do not need our application to be that big so we are going to reduce the window size by selecting Modify>Document. A new window should have popped up.
  3. In that new window change the dimension size to the following
    300 px (width) by 150 px (height)
  4. Once you have done this and with the window still open, go ahead and change the background color by clicking on the square. Pick any color you want. I chose blue.
  5. At this point we are going to create the simple ball graphic we need.
  6. First we will make the ball by selecting Insert>New Symbol
  7. Rename the symbol "ball" and make sure to select next to Type: Movie Clip
  8. Make sure your tool pallet is up. If you do not see it select Window>Tools
  9. Select the oval shape from the tools pallet or by pressing its shortcut key letter o.
  10. On the tool pallet ,under color, next to bucket fill icon, change the fill color to one of the gradients in the shape of a ball. I chose the grey one since it resembles the ones from the lottery broadcast on TV.
  11. In the middle of the stage you will notice a crosshair. Put your mouse, which should also look like a crosshair in the middle of the crosshair on stage.
  12. Hold down the alt button and drag your mouse out and let go when the desired size image is made. By holding down alt it enabled you to make a perfectly round ball.
  13. Now the default gradient we used is not quite what we are looking for. Using your bucket tool by using shortcut key K click once on the top right part of the ball image. It should now look a little bit lighter
  14. We are now done with our image. To navigate back to our animation click on scene 1 next to timeline.
  15. Double click layer 1 and rename it ball_1. From your library drag your ball image to the stage. Place it on the stage remembering you will need room to eventually have 3 of these pick 3 balls on stage horizontally.
    I placed it at X: 24.5 Y: 53.5 found on properties bar
  16. Once on the stage make sure the ball is selected. On your properties bar select the filters tab.
  17. With the filters tab selected click on the plus sign (+). Add a drop shadow and a blur filter to it.
  18. Select blur from the list and put in the following information
    Blur X: 6 and Blur Y: 6
  19. In your timeline move to frame 7. Insert a keyframe by selecting Insert>Timeline>Keyframe
  20. Move to frame 1 in your timeline. Click on the ball and move it up so that it will look like the ball is dropping when we animate it. I placed it at the following location X: 24.5 Y: .5
  21. Move to Frame 8 and insert a keyframe. Move the ball up a little bit.
    X: 24.5 Y: 30.5
  22. With the ball still selected click the filters tab on properties bar and change the blur to 11 for X and Y values
  23. Move in your timeline to frame 9 and insert a keyframe. Move the ball back down a tad to X: 24.5 Y: 53.5
  24. Change the blur filter to 4 for the X and Y values
  25. In your timeline on frame 10 insert a keyframe. Its location should be
    X: 24.5 and Y: 43.5
  26. Select ball layer. Keyframes in timeline on this layer should be highlighted black. On your properties bar next to tween select motion from the dropdown.
  27. Create a new layer and rename it ball2. Repeat on this layer steps 15-26 and change the location of image as necessary
  28. Create a new layer and rename it ball3. Repeat on this layer steps 15-26 and change the location of image as necessary
  29. We now need to create dynamic text boxes so that numbers will show up on the ball images. So first create a new layer and place it above your ball1 animation layer renaming it number1.
  30. Move in your timeline to frame 10 and insert a blank keyframe.
  31. Making sure you are on frame 10 and on number1 layer, select text from the tools palette and create a textbox within the boundaries of your ball1 image that is on the stage.
  32. Select the textbox you just created and on your properties bar change it to dynamic text from the dropdown list.
  33. In the properties bar next to var: type in numb1.
  34. Repeat steps 29-33 for ball2 and ball 3 images. Change names and numbers appropriately.
  35. Now we need to create a button. Insert>New Symbol. A window should pop up. Rename it "Button" and next to type make sure button is selected.
  36. Make your button any shape and color you want. I made mine oval with a red gradient for up and down states and green gradient for over state.
  37. At this point we need text placed on the button. Using the text tool type "Pick3". Under properties make sure the text box is static text. If it is not select it from the dropdown list.
  38. Your button is now made so navigate back to scene1.
  39. Create a new layer and rename it button
  40. From your library drag out the button you just made on to the stage.
  41. Now for the action scripting. Create a new layer and name it actions. Move the layer to the top of your layer list.
  42. At frame 10 of the actions layer insert a blank keyframe. Right click on the keyframe and select actions.
  43. With your actions window up type in the following random number script
    numb1 = random(10);
    numb2 = random(10);
    numb3 = random(10);
    value of ten is inserted because possible number choices are 0-9 for the pick3 and 0 is considered a number.
  44. Close out of the actions window
  45. On the stage select your button. Right click and select actions. Actions window should pop up.
  46. In the actions window make sure Script Assist is selected. Chose the following from the left hand panel. Global Functions>Timeline Control>goto.
  47. Select go to and play and change it to frame1. Close out the window
  48. Save your file
  49. To test your animation select: File>Publish Preview>Flash
When you click on the button it should give you new lucky numbers. Hopefully winning ones.

Published by Neil Mey

My name is Neil Mey. I am from Saint Louis Missouri and have a Master of Arts degree in Communications from Lindenwood University. I am currently an Instructor at Lindenwood University as well.  View profile

To comment, please sign in to your Yahoo! account, or sign up for a new account.