Graphics Reference
In-Depth Information
Figure 5.11
The parent context of an action
5.4 Symbols and Elements
Now you know all the events that may occur in the course of an interactive com-
position. Before we look at how to create actions that change visual elements,
control Timelines, and achieve other interactivity, such as calling a URL, we will
first look at the structure of visual elements within Edge Animate. It is essential
to differentiate between symbols and elements in order to understand the Edge
Animate API.
If you place a rectangle, a circle, or a text element on the Stage, you are initially
creating a simple element. The same applies to the placement of an image. De-
pending on the tag selected, the composition is attached to the corresponding
HTML object in the DOM during runtime. Elements are therefore a 1:1 mapping
of the HTML objects.
Figure 5.12
For texts and images, different HTML
tags can be selected
An element in Edge Animate is a visual object that is represented in classic
HTML. The element has the typical HTML/CSS properties, but not a Timeline.
Symbols, however, are strictly non-visual components of Edge Animate. You
can imagine a symbol as a kind of element group, which can be stored with
its own Timeline in the Library, and made into instances on the Stage as many
times as you choose. Since a symbol must always be generated from one or
more existing elements, each symbol has at least one element that makes it
visible in the first place.
