Get the full commented source code of

HTML5 Suika Watermelon Game

Talking about Actionscript 3, Flash, Game development and Stencyl.

Before we start, let me say one thing: I love StencylWorks. It’s an incredible tool which will allow you to save a lot of time, and you should definitively try it.

Now, let’s see how to make a level selection screen like the one I am making for my StencylWorks game called Kira the Witch. You will be able to create stuff like this:

And obviously clicking on the first cave will make you play level 1, clicking on the second cave you’ll be playing level 2, and so on.

First, you need to create a new actor which we’ll call “Level Icon”

Then, create a new scene called “Level select”…

… and fill it with as much “Level Icon” actors as you want

At this time, create a new behavior for the actor which will be bound to the “Level Icon” actor, and call it “Click to play level”

Create two attributes for this behavior called “scene to play” (type:Scene) and “level label” (type:Text), and don’t make them hidden.

Let’s place some “code” in the behavior:

The “when drawing” part just places the content of “level label” attribute horizontally centered as seen in this post, while the “always” part checks for the mouse, then switches with a transition to the content of “scene to play” attribute.

Now, where to define such attributes? Go back to Level Select scene, right click on a door actor and select “Customize Behavior”

Here you will be able to add the “Click to play level” behavior and edit the attributes you defined before. Place the right level label and the scene you want to play, and the game is done, you have your select level screen in less than five minutes.

Unfortunately I can’t show you the working example because it contains some behaviors related to the game I am making, but feel free to post questions if you don’t find it clear.

Never miss an update! Subscribe, and I will bother you by email only when a new game or full source code comes out.