TRON Clock V2

I wanted to contrast different implementations of the same concept in the TRON clock, so welcome to V2.  My intent in the first version was to always display an analog-style clock with a circular theme and varying background quadrant graphics for the minutes.  The former was considered part of the component and the latter was the skin.  That’s a pretty narrow view of  a skin.  What if someone wanted to replace the circular theme with something triangular or square or even a digital display?

In V2, the concept of the clock skin is expanded to include the entire clock display, both dynamically drawn and artist-supplied parts.  The drawing logic is now entirely relegated to the skin class.  The component is responsible for validating style and input time values.  The component determines if the input time is different from the currently displayed time.  If so, the skin’s display list is invalidated and the skin redraws based on time values queried from the host component.

I also illustrate using embedded symbols from a SWF vs. instantiating a symbol that exports to a MovieClip or a subclass.  The latter is useful for animations like the TRON text in which we rely on timeline actions (these are stripped during the embed process).

A millisecond indicator existed in V1, but it was not used.  The millisecond indicator moved along with the seconds.  In V2, the milliseconds indicator is fully functional.  The clock may be used to display current time or as a stopwatch.  The latter functionality is shown in the demo in a countdown from two minutes.  You may toggle the __countDown Boolean variable in TronClockV2.mxml to see the new clock in normal time mode.

I did not have time to refactor the drawing utilities.  That will have to wait for another revision as  time is short in my current schedule.  Nor did I have time to fix the graphic alignment issues caused by the artist (me) selecting the application background image after the Flash drawings and trying to hack the two together.  This is, of course, why we try to get real artists to work on actual projects 🙂

There is room for additional improvement beyond the utilities, so experiment with the code and have fun!

View demo.

View source.

Advertisement