(Download)

Creating 3D zoom world

The example above was transcribed from the ActionScript written by Paul Ortchanian available here. It's a nice little demo with good aesthetics.

Lesson Learned: The Sprite Object

There is a little bit of a inheritance structure when it comes to display objects in Flash 9. One of the confusing things when I was looking at action script long ago was the concept of the MovieClip. It was being used all over the place for normal graphical components. It seemed like a bit of a misnomer but it's one of those framework warts that you roll with because, hey, that's the evolution of software.

In the first examples we were using the Shape class to create some graphical components. For this demo it was required that the components were able to respond to UI events (like the mouse) and the Shape class didn't publish any events associated to the mouse. The documentation points us to the Sprite class for that. There we found the appropriate events for dealing with the mouse but there was also this bit that summed up everything quite nicely.

A Sprite object is similar to a movie clip, but does not have a timeline. Sprite is an appropriate base class for objects that do not require timelines. For example, Sprite would be a logical base class for user interface (UI) components that typically do not use the timeline.

So a basic overview could be:

• Shape - Graphic capabilities
  • Sprite - Events
    • MovieClip - Timeline

Lesson not Learned: ENTER_FRAME

One thing that I'm not quite sure of. Does it make more sense to let the individual components manage thier state with their own onFrameEvent()? In the example code I'm listening to the ENTER_FRAME event off of the root.

    root.addEventListener(flash.events.Event.ENTER_FRAME,
                          this.onEnterFrame);

And then the event listener does:

  public function onEnterFrame(event:flash.events.Event) {
    textField.text =  "Stage Width: " + root.stage.stageWidth + "\n" +
                      "Stage Height:" + root.stage.stageHeight + "\n" +
                      "World cx:" + world.centerX + "\n" +
                      "Camera x:" + world.camera.x + "\n"
                      ;

    // Zoom-then-rest repositioning
    world.camera.x -= (world.camera.x - newCameraPosX) * 0.1;
    world.camera.y -= (world.camera.y - newCameraPosY) * 0.1;
    world.camera.z -= (world.camera.z - newCameraPosZ) * 0.1;

    for (circle in circleList) {
      circle.render(world);
    }
  }

Where the lines to look at are:

    for (circle in circleList) {
      circle.render(world);
    }

The one event handler is dispatching the state update to the children. Should the children handle their own ENTER_FRAME?