Watchface: MilSub

Hey folks - thought I'd share my latest creation, MilSub.



The entire watchface is rendering in anti-aliased graphics, including the seconds hand, which was no easy feat. And it also allows me to theme it relatively easy too (more themes to come).



Rendering the hands and the dial
Yes, the hands are super crisp as they are rendered using font tiles! It uses the same technique as my "Fleiger UTC" and "Ranger" watchfaces. To find out more, read this previous post; https://forums.garmin.com/forum/developers/connect-iq/155004-

This allows me to compress 180 frames of animation for hands very effectively in less than 100kb.


Always-active seconds hand
If you're not familiar with the way an "always-active seconds hand" is coded, I suggest you check out the excellent "Analogue" example in the SDK. It uses onPartialUpdate(), clipping masks, and a BufferedBitmap to work it's magic. Firstly, you're expected to draw your watchface (with everything except the seconds hand) to a BufferedBitmap cache. When onPartialUpdate() is called, you can then use this BufferedBitmap to "reset" the background before drawing the seconds hand.

Now getting the "always-active seconds hand" working was quite a drama. As this watchface uses my anti-alias technique, we cannot set a palette for the BufferedBitmap (CIQ complains about this). This limits the size of the BufferedBitmap to the amount of available memory we have. The biggest I could make the BufferedBitmap, and therefore the seconds hand, was 200x200 pixels without running out of memory.

Secondly, you can only utilise 30ms of cpu and rendering time per second. This left me with around only 7-8ms to draw the seconds hand, and I had to highly optimise this render path by shaving 1ms here and there. This also prevented me from adding a little tail to the seconds hand.

To illustrate this, here's the clipping mask in green - that's the area drawn to every second - while the BufferedBitmap is illustrated with a blue background. You'll see that over the course of 60 seconds, the entire screen is written to with the BufferedBitmap "cache".



Here's a video of it in action;
https://gfycat.com/LiveShyImperialeagle


Anyway, thought it might be interesting to showcase the technique, and happy to hear any comments, suggestions, etc, from you all.