Skip to Page Content

Chris Cassell Dot Net

• Home
• Log
• Portfolio
• Projects
• Classes
• Contact

Projects

Intro to Flash Navigation

Example 1 : Example 2 : Example 3 : Example 4

Key Concepts

• Symbols
  • Graphics
  • Buttons
  • Movie Clips
  • Instances
  • Reusability
• Extensibility
• Events
• Paths to objects (instances)

Symbols

Graphics

• non-interactive
• animation tied to main timeline

Buttons

• basis on interactivity
• can contain graphics or movieclips
• timeline contains four frames
  1. Up - normal state
  2. Over - mousover state
  3. Down - mousedown state
  4. Hit - hot area
• timeline does not play
• actionscript attached to button instances to create interactivity

Movie Clips

• timeline is independent of main timeline - main timeline can stop, movie clips will continue playing
• controllable via actionscript

Instances & Reusability

• instances: copies of symbols from the library, reduce overall filesize of movie, encourage consistent interface
• instances of movie clips must be given instance names in order to be accessible via actionscript
• instance properties can be changed without affecting main symbol in library
  • position - x and y
  • transparency (alpha)
  • tint color and opacity
  • frame

Extensibility

Movies should be built in such a way that components can be easily modified and updated. Ideally they should also be modular and portable between movies. For example, a slider widget could be reused to control any number of things, from font-size to scrolling to tint color. The bits of script that enable the slider to control these things should be easily moved from project to project, so that redevelopment is not necessary.

Events

Actionscript is event-driven. An event must occur for actionscript to be executed. There are three types of events:

• Timeline events
• User-triggered events
• Movie Clip events

Timeline events are triggered by the playhead entering a certain frame.

User triggered events are generally detected by buttons. Examples include: clicks, rollovers, rollouts, keypresses,

Clip events are triggered by movie clip symbols. Examples incluse: load, unload, enterframe, loading external data

Actionscript triggered by timeline events is attached to frames. Select a frame in the timeline, and type your actionscript into the actionscript window.

User events and clip events require that actionscript be attached to symbol instances with event handlers. Generally, buttons handle all user-triggered events. Select the instance of the button on the stage, and add the actionscript with the appropriate event-handler block.

on (release) {
gotoAndStop(1);
}

Movie clip events are handled similarly: select the instance of the movieclip on the stage and enter the code in the actionscript window.

onClipEvent(load) {
gotoAndStop(3);
}

Paths to Objects

Instances of movieclips are basically objects with properties, methods, and variables. They can be accessed via relative or absolute paths using dot notation. For example, the following absolute paths:

• a movieclip on the main timeline with an instance name of "movie1": _root.movie1
• If movie1 has a movie clip on its timeline named movie2, the absolute path to movie 2 is _root.movie1.movie2
• To read or write the x position of movie2, _root.movie1.movie2._x
• To read the name of a variable belonging to movie2, _root.movie1.movie2.varName
• To tell movie2 to play, invoke the play() method, _root.movie1.movie2.play();

_root is the name of the main timeline. _parent refers to the movieclip containing the current clip. Most movieclip properties have an underscore at the beginning (_x, _y, _currentframe, etc.).

Project

Create a navigable movie like the ones we're discussing today. The content can reside on the main timeline or on a movieclip's timeline.

Examples

Download the example .fla's