Lillypad: Scene Transitions

Posted in: Articles, Lilly Pad by preitz on

There was no update yesterday because I was on top of a mountain. An hour drive to the mountain, then a three mile hike to the top. So not a lot of work got done. But I did get some good pictures, a couple of which you’ll see in todays demo.

The latest feature I’ve added to Lillypad is scene transitions. This is a way to move from one scene to another in some fancy and, most importantly, not boring way. I only have four transitions (which are shown in the demo), however my focus was not on the transitions themselves, but on a frame work that makes the transitions work. This allows for future transitions to made easily, either by me as I see the need for them, or by other developers to fit the needs of their projects.

Extending the transition class gives you a set of functions and properties you can work with to create a transition. I’ll highlight each of these below:

oldScene, newScene:

oldScene and newScene are two sprites that have a snapshot of the scenes being transitioned. They are added to the stage with newScene placed over oldScene.


Sometimes a transition needs to start with oldScene placed on top. the swap() function switches the z order of the scenes.


This function is called just before the transition begins. Override this function to do any setup needed for the transition.


this is called on each frame. This is where you would progress your transition.


This property is an estimate of how many times update() will be called based on the time provided for the transition.


Set this to true to indicate that the transition has been completed.

The link to the demo is below. Like I said, there are only four to start with, and I hope to add more.


Next: Sound

  • No Comments Yet