Hacks #61-64
Flash originally started as a
low-bandwidth animation tool, but since then Macromedia has added
many features that support building graphic user interfaces (GUIs).
In recent years, Macromedia has been promoting Flash as a platform
for Rich Internet Application (RIA)
development. To that end, Macromedia has
enhanced Flash's event-driven language,
ActionScript, making it easy to write application code that can
respond to user interaction and thus act as "GUI
glue"—the thing that holds your interface
together and drives it.
The user interface (UI) and navigation can be implemented by using
the Flash timeline as a nonlinear series of animation/content
sections. In the final Flash site, the user navigates between the
sections, each of which represents a different program state (such as
different pages in a multipage form), via a simple point-and-click
UI. The UI is also easy for the designer to set up with a minimum of
scripting. Flash MX Professional 2004 supports new
Slides and
Forms features (collectively called
Screens) to make
visual development easier by hiding the timeline paradigm from the
developer. Instead, it allows them to develop using a PowerPoint-like
or Visual Basic-style authoring metaphor.
Flash MX and Flash MX 2004 provide numerous components [Hack #73], which are UI building
blocks, such as combo boxes and radio buttons, that make it easy to
build and customize (skin) the UI. Of course you can create your own
UI elements, such as buttons [Hack #14] and sliders [Hack #61] .
ActionScript also includes built-in
methods to allow interactive control of multimedia streams, such as
sound and video, using the Sound,
Microphone, and Camera
classes.
Regardless, the raison d'etre of Flash is to engage
the user. Even when used to conduct business or provide education,
your content must be engaging or you will lose existing viewers and
fail to attract new ones.
Sometimes, your interface needs to be clear and clean, but in other
cases, we need to create something that the user will enjoy using and
that will fulfill the promise of over-the-Web rich content. In the
end, it is up to you as the site designer or developer to make
appropriate choices for your audience based on your business or
artistic goals and to adjust your site based on user feedback.
However, this book is not about interface design but about stretching
Flash in ways Macromedia might not have foreseen or intended.
Therefore, the hacks in this chapter cover several nonobvious uses of
UI elements within Flash. Some of them overcome apparent limitations
in the UI facilities provided by Flash. But the first hack shows that
UIs are not just for the end user, sometimes they can make
development easier, too.
Speaking of author-time user interfaces, Flash MX 2004 and Flash MX
Professional 2004 support
extensibility—the
ability to not only configure the Flash authoring environment, but
also to modify existing features or add new ones.
The Flash authoring environment can be
configured via the JavaScript API (JSAPI) using a dialect of
JavaScript specific to the Flash authoring environment,
JSFL (which stands for
"Flash JavaScript"—yeah, I
know the backward acronym is very unsatisfying).
As most web designers know, JavaScript allows access to the web
browser's user interface and any open HTML documents
using the Document Object Model (DOM). However, unlike the
browser-based DOM, the JSFL DOM provides access to the Flash
authoring environment user interface and any open FLA documents.
Using JSFL and the associated DOM, you can:
Access any part of the currently open Flash document (FLA) and
programmatically edit it via JSFL. This allows you to create advanced
commands (accessible via the Commands menu) that can automate
workflows or create new tools. Access the Flash authoring environment user interface, allowing you
to create (for example) new tools on the Tools palette. One such tool
(the PolyStar tool) can be seen if you click-hold the Rectangle tool. Export a SWF from the Windows command line as described on moockblog
(http://moock.org/blog/archives/000058.html).
As well as the power of the JSAPI, you can also create custom panels
and requesters to allow user interaction between your JSFL scripts
and the user, not only allowing you to run scripts that configure the
Flash authoring interface, but also allowing users to customize the
operation of the JSFL scripts themselves! This works via an XML-based
language, XML to
UI, which allows you to create custom UIs that appear in the Flash
authoring environment and act as the interface between the user and
your JSFL code. You can also communicate between standard
ActionScript and JSFL, so that you can use a running SWF as part of
your user interface. The MMExecute(
) function allows a running SWF
(typically embedded within your XML to UI interface) to execute JSFL
scripts, thus allowing you to create large custom interfaces that can
provide a variety of automated tasks and tools via a single custom
panel.
In fact, Macromedia used the extensibility features within Flash MX
2004 to create new features such as Timeline Effects, Behaviors, and
the ability to record macros via the History panel. It will be
exciting when third parties begin to use JSAPI, XML to UI, and
MMExecute( ) to customize the Flash authoring
environment and make those modifications available to other
developers. (Note that JSAPI, JSFL, XML to UI, and
MMExecute( ) are relevant only to author-time
customizations and additions. They are not designed for runtime use
in the Flash Player.)
|