Computers 23 Angry Birds Parts 5~12

Part 5

There are 3 errors in this section.

Since the only input in to the game is a mouse click, we just set playerClicked to be true, the rest of the game logic will be added later.

Check your errors here.

Part 6

There are 3 errors.

This is what the game loop looks like. The game loop has 3 other functions: handleUserInput is in charge of any player inputs, like mouse or keyboard;

handleGameLogic updates player movements, etc;

handleDraw doesn’t do much except let the player know what’s happening in the game by updating the UI. For example, when the score goes up, the player can see the number increase on the score textfield.

When those functions are done, the gotoWin and gotoLose variables are checked to see if they are true, if they are, the functions will be called and the game will end.

Check your mistakes here.

Part 7

There are 4 mistakes in this section.

playerClicked is going to be set to true when the player clicks their mouse anywhere on the game stage. When that happens speed will be set to -16. The negative value means that the bird will move up. Check out these two pictures to see why that is so.

See, y increases as it goes down. So a negative y value means something going up.

Maybe this because you always scroll down on a web page when it loads.

 

Try switching the 16 to another number and seeing what happens when the game is done.

We also have to set playerClicked to false after we acted on it.

Check the mistakes here.

Part 8

This section has 3 errors.

The beginning of the function updates the position of the bird (“mcPlayer”) by adding the speed to the y position. If the speed is negative, the  y position decreases, therefore going up. After that we put in the gravity to make the speed go in the positive (downwards) direction, you can make a different value for gravity and see how the game changes.

In our version, if the bird goes up to the top of the screen it will die, just like it will when it hits the bottom of the screen. The code will then check the players position as either less than 0, or higher than 600 (the bottom most pixel) and if one of those is true, setting gotoLose to be true.

Check your code here.

Part 9

 

There is only one error in this section.

We will loop through the pipes array that has all the names of the pipes (see startgame), currPipeName will store the name, and we do var currPipe = this[currPipeName], we get the actual reference to the respective pipe movieclip.

Next, we will move each of the pipes to the left. We are using a speed of -8 here; feel free to experiment with it but just make sure it is negative so it will move to the left.

Then we check the collision of the pipe with the bird by using hitTestPoint.  This has the effect of making the game a little bit easier, because if the edges of the bird touches the pipes, the bird will still live. If there is a hit, gotoLose will be true and the game will be set to end.

If the bird misses the pipe then currPipe passes by the bird, we set it to invisible (visible = false) and adds 0.5 score to the game. There will always be two pipes so .5+.5 = 1 point per set of pipes.

Click on this to see the error.

The last three sections are so small, I am not going to put any errors in them, (at least not on purpose).

Part 10

Our game only has 8 sets of pipe obstacles, so one that part is cleared, the player has won. Feel free to add extra sets of pipe obstacles if you want.

Part 11

Usually we use the handleDraw function to update the UI displays, but here update the text field that shows the score (txtScore).

Part 12

The two functions triggerGoToLose and triggerGoToWin are called when the lose or win states happen. We then remove the game loop so the game doesn’t keep running, then we can jump to the correct frame to show a won or loss.

 

Note: This tutorial was originally made by Joseph Tan and was adapted for you wonderful people under a creative commons licence.

 

 

 

 

 

 

 

 

Computers 23 Angry bird parts 1-4

You are going to make a flappy bird game, alone or with a buddy. I will give you the FLA file, you are responsible for entering the code in an actionscript file.

Open Flash and select actionscript file.

The code will have deliberate errors, it will be your job to find and correct them based on your knowledge of actionscript programming. I will let you know how many errors are in each section.

Here is the first part, there are no errors in the import section, there are 6 errors in the section (Thanks K.U, and R.M.)

Part One

The packages that you are importing will be used by the game.Think of them as common files that are often used to handle part of setting up a game in Flash.

The variables used in the game are score, to keep track of how many pipes the player has passed, and pipe is an array that will be used to store all the names of the obstacles.

speed is how fast the bird is moving, when it has a value of 1 it is going down, when it has a value of -1 when the bird is going up.

gotoWin and gotoLose are boolean variables that when set to true, the game will go to the Win or Lose frames.

playerclicked is a boolean value to see if the player has clicked on the bird, and if they have, the bird should move upwards.

When you think you have found the errors, click here to check. Make a word document called Errorbirds and write down the errors and why they were wrong.

Part Two

There are 3 errors in this part.

If you take a peek at the FLA file that you got from the handout folder and look at the Actionscript that is already in some frames. If you check the frame labeled menu, it has a single function call to startMenu; the win labelled frame will call startWin.

All of those functions are written here. If you don’t write code in the FLA file, but instead in the actionscript file so you can see everything in one place, it can make it easier to find all the bugs. These functions set up the codes for the buttons in the frame so they will work.

When you think you have found the errors, click here to check. Add the errors to Errorbirds.

Part Three

There are 3 errors in this section.

startGame is called in the frame that is labelled game.

This function starts up all the necessary variables and states in the game. The game starts with a call to the player movieclip playing the frames labelled “right” , it will show a birds flapping its wings. score is reset to 0 right at the start, and speed is as well. This means the bird will stay unmoving for a while before gravity makes it fall.

The start also calls setupGame but we will talk about that later. pipe will store all the names of the pipe movieclips that have been dragged on to the stage. If you add more pipes later, remember to add them to this array pipes as well.

There is also a loop in the game which is something that runs through the same steps over and over. The game loop is made in the game by adding an event listener that listens to the ENTER_FRAME event. If the fps of the game is set to 30, then the update function will run 30 times a second.

We also add event listeners to listen to the key down event, which will be triggered when the user clicks anywhere on the stage.

stage.focus = this sets the focus back into the game. When  the user clicked a button to get from the Menu frame into the game, the focus is actually given to the button. If the game was being played with a keyboard, the keys won’t work unless you clicked on the game screen to give it focus without that statement.

If you want to check to see if your found all the errors click here.

 

Part 4

There are six errors in this section.

These functions are in charge of the what happens when the player clicks on the buttons in the menu, or the how to play section, or starts the game.

It’s important that the event listener is removed from the button first, before it jumps to the correct frame. This is good programming practice.

Once you think you have found all the errors, click me to check.

 

 

 

Computers 23 Arrays part Deux (2)

Howdy Ladies and Gentlemen,

We are going to return to Arrays and make a game with Arrays. Follow along and complete the array tutorial starting from step 8. Answer the questions here on a word document and screenshot your code and its output where necessary. Please refer to this post frequently, I provide you with some art work and a script that will make creating the game just a matter of adding some actionscript code, as long as you read the post carefully.

Questions:

Step 8:

1:What does join do?

2: Give 2 examples of a delimiter?

3: What will this do?

4: Please give an example of reverse and sort .

5: Name 3 ways you can sort an array.

6: In the array

var ary:Array = [“monkey”,”dragon”,”panda”,”viper”];

if we added the commands

ary.splice (2,1);

ary.splice (2, 0, “squirrel”);

What will the contents of the array be?

7: How can you find out what the number of an item in an array is? i.e. If I know the word Fibbit is in my array how can I find out if it is number 7 or number 29, without counting through the array myself?

8: Does actionscript use immutable arrays?

Step 9

9: What is a nested array?

Step 10

10: What is a vector? (In terms of an array)

11: Why would you want to use a vector?

Step 11

It’s ok to use this file for the artwork, or you can do it yourself.

As you can see it is in the handout folder.

using the file lets you skip steps 12~15 if you also use the nameGrid.jsfl script, check the bottom of step 15 to see how to use it.

As long as all your squares have the correct instance name, you can move on to Step 16

12:  What does for each do?

13: What does every do?

 

 

 

 

 

 

 

 

 

 

 

Computers 23 Functions review and Branching start (if else..)

Function Review

We have used Functions already, with our dancing person/creature project, so this will be a bit familiar. A function is a way to get a more complex task wrapped up then we can do the task by calling the function.

For example, if you have a code to draw a star, and we need to draw lots of stars to be drawn, we can make a function to draw them for us. It might take 15 lines of code to draw the star. Instead of rewriting those 15 lines over and over in the code, we can put those lines in a function. Then every time we need a star, we can just call the function and it will draw it for us.

When you create a function, you are giving a name to a task, and then you can repeat it easily by calling it by name.  Functions are called other names in other programming languages like method, subroutine, subprogram, or procedure.

Quick Example to show the structure of a function:

1| function doSomething (){
2|        trace(“Doing something.”);
3| }

function: keyword that lets the computer know a function is following.

doSomething: is the name of the function, can’t start the name with a number, can only use the _ and $ for special characters.

() has to be there as part of the function declaration.

{ and } contain the body of the function. Anything inside the body is code that can be executed (called, run).

Check out a picture that labels all the parts.

 

Remember, the function won’t do anything until it is called in the program.

How you call it is just the code

doSomething ();

You need to have the () at the end, they are called the execution operator, they are what make the function start.

Everytime you run the function by having the

doSomething();

command in the program it will follow that function.

You don’t need to worry about the order of the function and it’s call, either one can come first.

You can also add parameters to functions to change how they work, but we’ll talk about that later.

Flow: Branching: If else  switch statements.

These are the statements that let the program do some thinking. You use these kind of statements all the time when you are thinking about what to do. For example if it is raining when you look outside, you would probably take an umbrella or a raincoat if you have to go for a walk around the neighborhood. If it looks sunny, you would leave the rain gear at home.

 

Part 1 Check out this tutorial and follow it to the end of step 10.

Then answer these questions in a word document with screencaps of the code as necessary:

Q1: What is branching?

Q2: Give 4 other names for branching and an example from your own life of a branching choice based on a condition. (like my example but not about raingear.)

Q3: What does the condition do for an if statement?

Q4: How many Boolean operators are there? Please list them.

Q5: What is a state variable?

Q6: What is operator precedence? Please give an example.

Q7: How does flash evaluate non-booleans as booleans? (i.e. numbers, strings..)

Q8: What does the else statement do?

Q9: What does ELSE IF do and when do you use it?

Q10: What happens when ActionScript finds the first true condition?

Q11: What are Switch blocks? Explain case and default.

Q12: Why do we need break? (Not a break)

 

 

 

 

 

 

 

 

Computers 19 (9+10)

Start a natural feature project: not a waterfall, but a gyser, rock slide, earthquake, volcanic eruption, etc.

You should have at least 6 layers,  at least 60 frames, the action of the natural feature should include at least  30 keyframes as a progression, you need an animal that is affected by the natural feature, and a sound that matches the feature.

Computers 23 (11+12=23)

Variables!

Variables are very useful in computer programming so we are going to learn about them today. Please pay attention because a) it’s very useful for all programming, b) you have to answer some questions after and hand them in for marks, c) we can’t make a game before we are confident in the basics.

This tutorial explains variables really well and uses flash to do it.

Please follow the tutorial all the way through, then come back here and answer these questions in a word document. You can screenshot the flash outputs with the snipping tool and import the image in to the word document.

Q1: What is a variable?

Q2:What does it mean to declare a variable?

Q3: What are the three types of variables mentioned?

Q4: Redo Step 4 but have 3 variables to be multiplied. Screenshot it, yours should be unique.

Q5: Redo Step 6 but assign a different number for both and make it a division question.

Q6: Redo Step 7 but make it a subtraction question.

Q7: Make four different versions of step 9 using adding, subtracting, multiplying and dividing, and 4 numbers for each.

 

INTERM REPORT TIME!

Hi!

Please follow this link and completely fill in the blanks. Then I can give you an interm report tomorrow.

 

 

Computers 11 + 12 Button to skip around the timeline

Hey,

now you know how to make a button and a movie clip, you will make a movie clip of a cool dancer. This cool dancer will have 6 layers and a dance routine that has at least 5 poses, and you should loop those moves at least 3 times. To loop a move, just copy and paste the frames that make it up. Make sure that you have at a few blank frames between each keyframe, or the animation will go too fast.

You will also need a layer for the action script. Press F9 on the keyboard to add action script to a animation.

Here is the code that you need to put in the action script layer, on the first frame.

EXPLANATION:

stop stops the movie at that frame

You have to name the button something. Purplelaunch

AddEventlistener means look for something

Mouse event click means when the mouse clicks on the button

Purplebutton is the function

 

Function something that does a repeating action

Goto and play 2 means play from frame 2

Here’s how to name the button, look in the top right corner.

 

Here’s what the dance routine frames look like inside the movie clip.

What we want to have happen is if we don’t press the button the dancer just dances their normal routine, but if we push the button we want the dancer to be replaced by another instance of them (version) just bigger or smaller and a different color. To do that, you need to drag it in to the timeline from the library CTRL +L and then use color effect tint to change the color and the free transform tool to change the size.

QUESTIONTIME!: Where on the main scene timeline should you put the other dancer?

What do you need to do to the timeline after that spot?

 

 

 

Drafting 8 rotation, Orthographic projection

Finish up your birds eye and worms eye cities, then start orthographic projection.

Read the pdf below called projections and views, then draw the shape below in autocad

projections and views

Next complete these exercises by saving the files and opening them in paint. Write the correct letter for each view.

 

Write the correct number for each letter.

Fill in the numbers in the table.

Choose 2 shapes from exercise 4 (above) and draw their othographic views in autocad. Label the views and the shapes you choose to draw.

Computer 11 12 3 scenes flash project

Flash and 3 scene animation

You will make an animation with 3 different scenes like this one, but with one more scene in a different kind of area. Some examples of areas are: land, sea, air, space, the moon, a comet, ice, lava, etc. Your animations will be more detailed and have more things in them, listed at the bottom of this post.

To make a new scene you click insert and then scene.

To switch between scenes to work on them, click the scene symbol under the timeline (in a classic view workspace).

You will need: 3 scenes, two  passengers, and 3 different kinds of vehicles one for the passengers in each scene, each scene must be in a different kind of area i.e. scene one land, scene 2 air, scene 3 ice, at least 60 frames per scene, at least 6 layers per scene, at least 4 moving things per scene, 2 animals per scene.

2 Bonus marks for a zoom.