Programming games Flash drawing trick(s). Past due: Your completion of rock-paper-scissors) Classwork: Bouncing ball: read tutorial. Start coding.

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

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.

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.

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.

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();

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 jargon—learn 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)

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.

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.

Bouncing ball overview Three layers (board, interface, actions) –Can also make a ball layer underneath the board layer holding the walls OR make sure you bring the ball to the Stage before any wall instances. 1 frame Use Timer object to produce an event every so often –Recall setInterval

Animation in bouncing ball (and cannonball) Code Changes the Stage, that is re-positions the ball instance every interval of time. Just one Timer object –Don't blindly copy code! Uses the running attribute of the timer object to determine if 'in flight‘. Uses variables and calculations to determine horizontal and vertical position changes (aka displacements)

Interface Button (shows either Stop or Start) –Component instance. Note: you could make your own button. Input Text field –Input means the player can change it –Note: Use speed.text to access what the player typed in.

Warning We are using ActionScript 3.0. There were significant changes from ActionScript 2.0 to 3.0. Not so significant from CS3 to CS4.

Timer object var mytimer:Timer= new Timer(200); This creates a Timer object that will have a timer event every 200 milliseconds. The new is what creates a new object. var timer1:Timer= new Timer(5000,3); This creates a Timer object that will have a timer event every 5 seconds, and stop after 3 of them…. The mytimer and the timer1 are my names for these variables. Note: the bouncing ball application did NOT use anything named or similar to timer1.

Event handling At this point, the Timer objects exist but neither one has been started and no event handling has been set up. mytimer.addEventListener(TimerEvent.TIMER, moveball); This sets up the event handling: when the TIMER event happens, the moveball function will be invoked. The moveball is my name for a function I wrote! One more thing to do: mytimer.start();

What to do? I want to move the ball, that is, the movie clip instance on the Stage that I have named ball. ball.x += xd; ball.y += yd;

Walls Remember: there are no walls!!! However, you can write code to do a calculation. if rightwall.hitTestPoint(ball.x, ball.y, true) { … } This asks the question: is the x,y location of the ball (where this is depends on how you drew the ball) within the non-blank pixels of the rightwall.

Button There is a button to start and stop the action. It has a label that the code changes. Much of this is the same as you have already done!

Speed field This is an INPUT text field, meaning that the player can change it as well as code. The value is accessed using = speed.text Need to convert from text to number = Number(speed.text); Make sure the initial text has no blanks and represents a positive > 0 number! –Dynamic text fields can be changed by code. –Static text fields cannot be changed after set at Design time. Think about design time versus runtime This value is used to set the xd and yd values.

Now… Read whole tutorial and build your own bouncing ball

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 (.)

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

Demonstrate Bouncing stuff (different size and color balls) Bouncing things (3 different shapes, different size and colors) Makes use of external.as files. Bouncing things demonstrates use of common code for some aspects of 'thing' creation and behavior You can come back to this later for your special Flash project.

Classwork/Homework Complete bouncing ball Preview: Read cannonball tutorial Will discuss cannonball issues next class.