You are reading a single comment by @Andreas_Rozek and its replies. Click here to read the full conversation.
  • Developing an "analog clock" for the Bangle.js 2 may not be too complicated - but it still requires some knowledge of JavaScript in general and the Bangle.js environment in particular.

    The "Analog Clock Construction Kit" tries to simplify development and customization of such clocks by splitting the implementation into commonly seen parts and providing a framework into which all these parts fit.

    As a consequence, people may easily combine already existing (and tested) parts in order to get the desired clock and - if this approach is not already sufficient - to customize or implement only those parts which cannot yet be found elsewhere.

    A minimal example for an analog clock based on the "analog Clock Construction Kit" looks as follows:

    let Clockwork = require('https://raw.githubusercontent.c­om/rozek/banglejs-2-simple-clockwork/mai­n/Clockwork.js');

    A more interesting clock would probably look as follows

      let Clockwork = require('https://raw.githubusercontent.c­om/rozek/banglejs-2-simple-clockwork/mai­n/Clockwork.js');
        face: require('https://raw.githubusercontent.c­om/rozek/banglejs-2-rainbow-clock-face/m­ain/ClockFace.js'),
        complications: {
        Foreground:'#FFFFFF', Background:'#000000', Seconds:'#FFFF00',

    and produce the clock shown in the screenshot.

    As you can see, quite often no real programming is required - and if something should be missing (or not meet your expectations), only that part of the clock has actually to be developed by yourself.

    Parts of an Analog Clock

    In the context of this kit, an analog clock consists of the following parts:

    • a clockwork (defines the overall behaviour of a clock)
    • a clock size calculator (computes the space a clock may occupy without disturbing any widgets)
    • a clock background (draws a background for the clock)
    • a clock face (draws the clock's face)
    • clock hands (actually display the current time by drawing any clock hands)
    • optional complications (draw additional complications - e.g., to show the current date)

    Right now, the following clock part implementations are available:

    It's your turn now!

    Feel free to use this kit to develop your own analog clocks - either from the given parts or by extending existing/developing new parts!

    1 Attachment

    • Example.png