Exploring Java's Animator Applet
by Jay Lorenzo
With Java, the object-oriented language from Sun Microsystems, Web developers need no longer rely on proprietary features of specific browsers to add advanced interactivity and multimedia functionality to their sites. With a Java-capable browser such as Netscape Navigator 2.0, Sun Microsystems' HotJava, or other browsers that will become available this year, it is possible to create code that can provide self-contained functionality.
Many people are intimidated by the thought of learning to program an object-oriented language such as Java. Although Java is well-designed, the effort required to become proficient in the language is significant. But as with all programming languages, it is not necessary to understand the semantics of programming in order to use the tools that are created by that language. In this column, we will take a look at placing and using an existing applet--in this case, the Animator applet--within a Web document.
Before discussing how applets work, a brief description of some of Java's features is in order; visiting the Sun Java site will also provide a more complete overview.
Java is platform-independent and makes use of portability standards to facilitate application development, so you can expect similar results regardless of whether the compiled code is run on a Mac, a PC, or a Unix workstation. The Java development team has invested a great deal of effort in creating a virtual machine that overcomes the inevitable differences in byte ordering that different hardware platforms exhibit.
Java source code is logically defined in classes, which are structured groups of code that provide a certain functionality. When source code is compiled by javac, the Java compiler, the resulting file has a .class extension and is named after the class defined in the source code. At a lower level of abstraction, the compiler is actually translating the source code into Java bytecodes, which are interpreted and run by the Java virtual machine.
Java has eliminated some features of C and C++ that cause many of the common programming errors that occur with those languages. The programming geeks among us should note that Java has eliminated direct pointer manipulation, structs, typedefs, and the #define; it has also implemented a means of garbage collection for reclaiming unused memory.
The core language contains a fairly small number of keywords and is extended by the use of packages. These packages are essentially collections of Java classes that create a framework. Java programmers can use this framework to create both applications and applets, programs that are designed to be embedded and executed within the browser. With the beta release of Java, applets are embedded within <APPLET> and <PARAMETER> tags. Applications, on the other hand, are capable of running without the existing framework of a browser, but currently they rely on a runtime version of Java for program execution.
Applet Components
The beta release of the Java Development Kit (JDK) shipped with some good examples of how Java applets can increase the functionality or presentation of information on the Web. Currently, the JDK, as of this writing, is available for Windows 95/NT and Solaris 2.X, with a Mac version promised for the first quarter of '96.
Of particular interest to graphic designers are the ImageMap, NervousText, and Animator applets. As a case in point, we will examine one use of the Animator applet, created by Herb Jellenik at Sun Microsystems. The particular version we will discuss is based on the v1.5 Animator that shipped with the JDK Beta 2 release.
The Animator provides a mechanism that allows sequencing of graphics and audio clips within a Java-enabled browser. This is accomplished by embedding a parameter tag list that contains the sequencing information within an HTML document, which is passed to the downloaded applet for execution. The parameter tag list used by the Animator is fairly straightforward: You specify the source directories for audio and graphics, the sequencing order for the items, and whether or not the animation repeats. For reference, a copy of the v1.5 Animator documentation is available, detailing the parameters used in this discussion. Since Herb is continually improving the applet, you can also visit
JavaSoft for the latest version.
The Animator is very efficient at graphics animation, because it incorporates double buffering and allows overlay graphics for image display. Double buffering is a technique in which an upcoming image to be displayed is drawn off-screen while the current image is rendered, resulting in much faster drawing when the off-screen image is finally displayed. The ability to display a background image, and then paint buffered graphics over it at predefined coordinates and time intervals, gives a graphic designer a broad range of possibilities.
The collection of images is sequenced by assigning a title that contains a numeric value that can be used to mark the identity of the graphic. Although not used in this example, audio files can be similarly titled and sequenced. The Animator relies on the MediaTracker class, which was written by Jim Graham at Sun. MediaTracker is a sophisticated utility class that controls the threads that order the graphics as they are downloaded. Since the size of the current graphics object is known to the applet, it is only necessary to refresh the current area occupied by the graphic, and not the entire background image. This contrasts greatly with server-push approaches currently in use on the Web, and it results in much lower bandwidth requirements, especially when using sprite-like animation techniques.
Animation in Action
Let's take a look at a relatively simple animation that I did for Bowed Electricity. This Web site, authored by John Schussler, focuses on a wide variety of topics within the realm of electric violins. Given the theme of the site, it seemed appropriate to animate something that would suggest electricity moving along a bowstring. If you are running a Java-enhanced browser, you can
see the animation and view the source code. The graphics components comprise a 13K background image and several extremely small 50- to 80-byte GIF images. These sprites are used to approximate a motion that will hopefully remind you of electricity.
When you view the source, you may be surprised to see a large number of position sequences in the parameter list. The animation was laid out by hand in Photoshop, but once the initial coordinate positions were determined, it was a relatively simple process to lay out the coordinates in an Excel spreadsheet, and then have the spreadsheet generate the entire parameter list by adding the pixel width and relative position to the starting animation points for each sprite, until it spanned the entire bow gap.
Admittedly, there are much better ways to do this type of animation within Java. It would be more efficient, and would generally make more sense, to animate the bowline and sawtooth effect by programmatically drawing these items using Java's graphics capabilities.
This column has dealt with a non-programming approach to using Java, but for those so inclined, there is a tremendous amount of potential that can be derived from extending the classes that comprise the MediaTracker and Animator. Due to the object-oriented nature of Java, methods within the classes used by the Animator applet can be inherited to create more specific animation modules. Some of these variations include independent backdrop and foreground animation loops, backdrops that can dissolve into other backdrops, and nested animation loops.
Jay Lorenzo currently spends his time overseeing administration of the internal and external Web servers at Walker, Richer, and Quinn. He is a partner in Strings, a Seattle-based Internet consulting company.
Web Developer® Site Feedback
Web Developer®
Copyright © 2000 internet.com Corporation. All rights reserved.
