Flash as3 game menu tutorial




















We will be coding using AS3 in external. Personally, I think this is a pretty awesome game genre. I find these types of games to be genuinely fun to play.

Top-down refers to the perspective of the game. Prominent examples include early titles in the Legend of Zelda and Pokemon series. Instead, we will draw each map individually, giving the game a more unique, hand-drawn look.

Instead, our map will be built from a series of screens that the player can walk through. When the player walks off one edge of the screen, the map will flip to the next screen.

I want to make sure I cover the material that you would all most appreciate. This is your chance to let me know what you want to learn. As I announced in the last post , I am extremely busy right now. Luckily for you, a member of the community has already stepped up and written a Part 13 for this side scrolling tutorial! Hi everyone. Thanks for sticking with the site and forum , despite my lack of activity.

Needless to say, the transition to college is a big one, and my free time has dwindled. I f you want to contribute to the site in any way during my absence, feel free to reply here, send me an email at as3gametuts gmail.

By creating an open, shared, easily-navigable discussion board, I am hoping that you will all have an easier time finding answers to your questions. Maybe you will find that someone has had a similar problem to your own, and found a solution.

Or perhaps you can help another reader with a problem of their own. And then it invokes the loadLevel function. Which, if the game was over, our curLevel was set to 0, and the last line just turned it to 1, so it will be loading level 1 again.

If it was level 2, the last line just turned it to level 3, and if those levels existed, the loadLevel function would do something about it. Let's see what it'd do. Did the hero collide with p1? Is dir set to the string 'up-move'? Run interior code. Get the y coordinate of the child that's at index 10 which we know will always be a level object, but we won't know which level object and add the value of 'moveSpeed' to it and since 'moveSpeed' is set to 5, this means that the level object will move up 5 units Call 'checkMazeCol' Set the mazePos variables to their respective x and y coordinates same plan as what we did with the player when we moved the player Now, this baffled me a while.

When I would include a for-loop for both the maze objects and the borders, for some reason, the pushers would override the collision with the maze objects, so I could walk right through them.

It was tracking the maze's position on the stage the same way we track the player's position that made it so both scripts could work together. The function, 'checkMazeCol' is separate from the actual collision function because we don't know what level is currently on the stage, and the maze pieces are held in the individual class files. So if we added another level, we'd have to alter the maze collision function as well. Does the interior code make more sense to you now?

We're telling the player and the level to return back to the old position, which we've been logging every frame that those move variables are set to true. At this point, you have finished the tutorial and you should have a working little maze game. Hopefully you'll be able to use the knowledge you've learned here for your future projects! Resources Quality Assurance. List of Tutorials Not Made by Tessa but still awesome. Tessa on Stack Exchange. Like Tessa. Did you find one of my tutorials helpful?

If so, like my page and spread the word! Connect with Tessa. Do you want to join my network? Connect with me on LinkedIn! Follow TessaTechArtist. Interested in updates about my projects? Follow me on Twitter! Have questions or want to see a specific tutorial?

If you'd like to request a specific tutorial to be made, please feel free to contact Tessa. Please keep in mind that she makes these tutorials in her free time and that they will never take priority over her work or projects.

Tessa will do her best to respond to every email. All rights reserved. Here's the example of the final game that we'll be working toward: This example above is the finished product for this tutorial only ever having a single level. This particular game's dimensions are pixels wide and pixels tall. It should look something like this: The 'Properties' tab while viewing the main timeline with nothing selected. You can access those same dialogues through the wrench icon in the properties window.

But more importantly, type the name of your main class where it says "Class:". If you click on the pencil icon, it should bring up the script we wrote earlier. If not, then double check the name of your class it should be the same name as the file and where you have your source files point to. Below is the maze I created using only the blue box and red circle movie clips: Inside the Movie Clip 'level1' of the maze game. The instance name of the movie clip holding the red circle is called "winBox" You can see in the following image that you can assign an instance name in the properties tab if you have the instance selected: The properties tab while viewing the inside of the movie clip 'level1' with the movie clip of a red circle graphic selected.

The name of the movie clip of the entire maze is called 'level1' and it is available for exporting to ActionScript. Once all of these assets are created, it's time to return back to the main time line. Below is a picture of the breakdown of my main timeline and stage: The stage and timeline of the main timeline in the FLA file of the maze game. Since the stage component boxes are invisible, I have "See Outline" turned on so I can see where they're located. I have 4 of those boxes on my border layer.

Their instance names are b1, b2, b3, and b4. I will be using those boxes to detect collision to keep the player from leaving the stage. I have them covering about 5 pixels from the edges they're the ones outlined in green.

When your variables are set it, it's time to start making functions! So for right now, go ahead and make a function like this: main. You should see the button, the player It's the trace statement we wrote earlier your level's class file. If your level's class is functional, then you're good to continue.

This is what the finished constructor function looks like for the maze game: main. Private Function: Key Down There are many ways to write a function that determines what occurs when the user presses a key. So here is the finished function that handles when a button on the keyboard is pressed, or held down: main.

Those case numbers are the appropriate key codes for each key it's what the computer system recognizes the keys as , and I'm only doing two things when the key is pressed.

Private Function: Key Up The key up function is very similar to the key down function. Here's what the finished function looks like: main. Here is the final game loop function: main. You might look at this and not understand a thing.

That's ok, I'll explain it to you either way. So what happens if a value is true? Let's inspect the first if statement. Private Function: Check Collision I like having shorter function names, so that's why I named it 'checkCol' instead of 'checkCollision.

First, here's the snippet that checks for our stage borders the ones that will limit the player to the stage : main. So edit your function to do this instead: main. Private Function: Collision Type Here is the finished code for the function that gets invoked every time there's a successful collision: main. I like orange. This is called a parameter, and 'colType' is a word I made up. It's a variable, actually, and it's a variable that is local can only be used by this function and is mostly undefined.

I could have typed colType:String to define it, but it works without it too. There are only two functions to this entire class, 'loadMe' and 'checkWin'. The reason is because the checkWin function utilizes the code 'MovieClip parent ' to reference the variables in our main class. This also means we need to alter our 'loadLevel' function in the main class like this: main.

Finally, it adds an event listener to itself which means it will only loop while this is a child of 'main' The other public function, 'checkWin' is exactly what it sounds like. Now that you're done with this class, it's time to resume your work with the main class. The Rest of the Main Class Public Function: Level Completed So in our game, we can start it, we can move around the stage, we're still going through the maze pieces, and we are stopped if we hit the red circle.

It needs to be in order for it to get called from the other class file. As soon as the game is over, it has a decision to make. There is an if statement, followed by an else. The if statement reads, "If the current level is less than the length of the allLevels array," which, 'allLevels. So let's break down what the if statement does what happens if there is another level available : Add a button as a child Give that button an event listener so it will do something when it's clicked. What's this?

Well, remember when I said that the last child added to the stage is the one on top of all the others? Ok, good. So all of the children of any given parent are represented as a list, or better known as, an array. You can get the number of children by tracing 'numChildren' and you can get what object is in the array by tracing 'getChildAt[index number]' Since I'll never know what level or message popped up at any given time, I can't just say "removeChild gameOverBtn " because it won't work if it was the if statement that invoked this function previously, and vice versa.

Why is it ten? The code at the bottom of the function is simply setting the position of the level to 0,0 and then recording those numbers into variables, much like what we do when the player moves.

Which means we now have to return back to our collision function and change it so that it includes the pushers and moves the level when we collide with those.

Support Please contact Customer Support at please include template name in the message title. FAQ ".. The submenu of a menu buttons do not appear in front of a flash movie, it is allways under it. How can I set up Vista Flash Menu dreamweaver extension?

Can I set the pressed state of a javascript Vista Flash Menu after the page loads? I want the web page navigation bar in the top frame but the sub menus to appear in the bottom frame. Templates Flash Menu Popular Templates. Website Navigation In Flash Feedback ".. I use the drop down menu creator a lot for web pages, CD menus..

Add a comment. Active Oldest Votes. David Mear David Mear 2, 2 2 gold badges 12 12 silver badges 21 21 bronze badges. Expected 0, got 1. Oh, callbacks for event listeners need to accept an event parameter. I've edited my answer to add e:MouseEvent. Do something like this in your playClicked function. Joe Slater Joe Slater 2, 6 6 gold badges 29 29 silver badges 48 48 bronze badges. Sign up or log in Sign up using Google.

Sign up using Facebook. Sign up using Email and Password.



0コメント

  • 1000 / 1000