Programming games

1
Programming games

• Flash drawing trick(s). Rock paper scissors.
• Classwork Complete rock paper scissors.

2
Flash drawing

• segmentation of drawing
• select parts,
• add on by using shift key
• also use lasso or rectangle select tools
• move
• modify (transform)

3
Flash

• You can
• change position and dimensions selecting an
  object and using the Properties panel
• W
• H
• X
• Y
• Try this!
• You can use this
• to make sure an oval is a square.
• to get the origin (cross-hairs) where you want
  them to be.
• to line up and space out related objects.

4
Rock paper scissors

• Review rules.
• Design goals
• present player with buttons that look like rock,
  paper or scissors
• 'computer' makes random choice
• short animations illustrating actions
• text (also) showing computer move and results
• Demonstrate

5
Animation

• Presenting to the player/user/viewer a sequence
  of still images.
• Two methods
• produce sequence during creation time. This is
  termed CEL animation.
• Flash has facilities to help this termed
  TWEENING
• write code that executes during runtime that
  modifies display. This is termed COMPUTED
  ANIMATION.

6
Class projects

• rock-paper-scissors uses CEL animation.
• bouncing ball uses COMPUTED animation.
• Bo the barking dog involves both.
• Cannonball involves both.

7
(No Transcript)
8
(No Transcript)
9
Buttons

• For coin flip, I used buttons from Windows/Common
  Libraries/Buttons and modified the text.
• For rock-paper-scissors, I made my own (DIY,
  programmer created) buttons.
• Other way use Window/Component/Push button
• NOTE in all cases, button instance on Stage must
  get a name!

10
Source code

• Examine source code
• Together build next animation
• Your task finish!
• You can change / improve graphics.
• You can add animation for ties.
• ????

11
Flash distinctions

• In my rock-paper-scissors,
• instances of scissors button present on Stage in
  each frame
• scissors button in Library
• graphical material in each of the 4 frames of the
  scissors button in Library
• For making the animated sequences, I
  copied-and-pasted from the graphics in the Up
  frame of the scissors button in the Library. I
  then modified the graphics on the Stage. There
  was no change in the scissors in the Library.

12
Show your work

• Reminder slow and steady
• Get logic working and then add/enhance the
  graphics and add animation
• Don't be skimpy on frames
• Put in stop() in the last frame of each animated
  sequence.

13
Common problems

• Forgetting to insert keyframe
• Using the whole button instead of graphics that
  were in a frame of the button
• Working on different layers
• Omitting stop()

14
Random

• This is the same as JavaScript!
• Math is a class. Math.random is the name of one
  of the class methods. Math.random() is a call to
  the class method. This is the jargonlearn it!
• Math.random() produces a random fraction from 0
  up to (but not including) 1
• Math.floor(Math.random()n) assuming n is a
  variable holding a positive integer
• produces integers from 0 up to (n-1)

15
Symbols

• Movie clips
• Button
• Graphics
• Symbols are created and remain in the Library.
  You bring instances to the Stage.
• Note you can draw directly on the Stage (just
  like you draw to make a movie clip).
• Create graphics symbols in the Library when you
  want to repeat a symbol. You bring instances to
  the Stage.
• Changing the symbol in the Library changes all
  instances on the Stage.

16
Flash publishing

• Save As/Save saves the source aka development
  version .fla file
• Publish creates .html and .swf versions. You can
  examine any of the .html files
• Make sure your saved .fla and the published files
  are the same version.
• You can upload the .fla file to your website for
  storage.
• I sometimes do this to make the source available
  to students.
• You upload the .html and the .swf to share/show
  to everyone on the Web.
• The file to be linked to is the .html file.

17
General concept Objects

• Objects are objects of a specific class.
• So far, we've only used built-in classes.
• Objects have
• properties Also Known As attributes AKA data AKA
  information
• methods AKA code AKA behavior
• Examples
• head.visible, ball.x
• mytimer.addEventListener
• In cannonball target.goToAndPlay(2)
• In rps, we used gotoAndPlay("breaks") for the
  main movie so we didn't need the dot (.)

18
Classes

• Built-in classes include
• movie clip
• Timer
• FLVPlayback
• Sound
• Programming defined classes
• See their use in other examples
• bouncing things
• shooter
• jigsaw puzzle

19
Classwork/Homework

• Complete rock paper scissors
• Please read rps tutorial and, if you have time,
  create the whole application yourself
• Next project Bo the barking dog
• After that cannonball