Java Reference
In-Depth Information
designers rather than software engineers. Let's admit it, visual designers
do a much better job of creating rich UI than software engineers. In
the current triangular model of mobile application development are
the engineer, the visual designer and the content author. JSR-226 SVG
enables the skills to be combined: the visual designer generates static and
animated SVG images for the user interface, which the engineer includes
in the mobile application.
An API is not enough to promote SVG technology so Nokia, Sun and
Ikivo are working to ensure there are powerful tools to create mobile
SVG content. The engineer's side of working with SVG is well covered
by the NetBeans Mobility Pack and the Visual Mobile Designer gives you
an intuitive way to incorporate SVG images and animations into your
mobile applications. There are three steps:
1. Create static SVG files.
2. Animate the SVG.
3.
Integrate the SVG content with the Java application.
The first step is performed by the visual designer, using a tool such as
Adobe Illustrator
1
or Inkscape
2
The visual designer can create complete
components (such as SVG menus or splash screens) or individual compo-
nents (such as buttons). The components are saved in SVG basic format
(more specifically, the DTD for saving should be SVG basic 1.1).
The static SVG files can be animated by Ikivo Animator.
3
The visual
designer opens a background SVG image, turns on animation mode, and
drags an individual component such as a label or a button. The animation
is created by adding a key point for the starting position, a second key
point for the end of animation, and the movement path. The animated
file can be saved as SVG-T 1.1 format. (For compatibility, you might
need to edit the
animateTransform
and
animateMotion
SVG XML
properties to ensure the animation works correctly.)
The final step is to integrate the SVG content with the Java application.
Copy the SVG files to the project resources folder and open NetBeans
Visual Designer, which provides number of SVG components such as
SplashScreenComponent
,
SVGMenu
,
SVGPlayer
. After you select
which of those components to use, you can drag the SVG-T files to the
SVG component and set attributes such as time increments and full-screen
mode. Your Java code can also influence the SVG images, for example,
by adding an
SVGEventListener
and code that increments the SVG
timer.
A major advantage of using JSR-226 SVG is the simple interfaces
between SVG-T and JSR-226. When the static SVG files are created, you
1
www.adobe.com/products/illustrator
2
www.inkscape.org
3
www.ikivo.com/animator
