Skip to content

Clock

The clock element displays an analog clock with handles for hours, minutes and seconds. Optionally, a box displays a text, for example the date.

Configure

Ensure the graphics library is included and initialised according to the configuration procedure.

1
2
3
4
myClock.define(x / 2, y / 2, dz, // x0 y0 radius
    myColours.black, // hour handle colour
    myColours.black, // minute handle colour
    myColours.black); // second handle colour

The required parameters are

  • The first line sets the x-y coordinates of the centre and the radius of the dial.

The optional parameters are

  • The remaining lines specify the colours for the hour handle, the minute handle, the second handle.

Note

For monochrome and colour e-paper screens, ensure the selected colours are supported.

Use

myClock.draw(hour, minute, second);

draw() sends the hour, minute and second handles.

Optionally,

1
2
3
myClock.draw(hour, minute, second,
    0,
    formatString("%04i-%02i-%02i", 2000 + year, month, day));
  • The optional second line provides milliseconds and improves the display of the second handle.

  • The optional third line contains the text displayed close to the sixth hour on the dial, e.g. to display the date.

Example

This is the core of the code from example Graphics_Clock.ino.

void displayClock()
{
    myScreen.setOrientation(myOrientation);

    uint16_t x, y, dx, dy;
    int32_t value = 128;

    x = myScreen.screenSizeX();
    y = myScreen.screenSizeY();
    dx = x / 5;
    dy = y / 5;

    myScreen.selectFont(fontMedium);
    myScreen.gText(0, 0, "Clock");

    gClock myClock;

    uint16_t dz = min(x, y) / 2 - 20;
    myClock.define(x / 2, y / 2, dz, // x0 y0 radius
                   myColours.black, // hour handle colour
                   myColours.black, // minute handle colour
                   myColours.black); // second handle colour

    uint8_t year = 1; // 01 July 2021
    uint8_t month = 7;
    uint8_t day = 1;
    uint8_t hour = 10; // 10:10:00 am
    uint8_t minute = 10;
    uint8_t second = 0;

    myScreen.flushFast();

    uint32_t chrono = millis();
    myGUI.delegate(true);
    for (uint16_t count = 120; count > 0; count--)
    {
        while (millis() < chrono)
        {
            hV_HAL_delayMilliseconds(10);
        }

        myScreen.beginPartial();
        myClock.draw(hour, minute, second, 0, formatString("%04i-%02i-%02i", 2000 + year, month, day));
        // myClock.draw(hour, minute, second);
        myScreen.flushPartial();

        second++; // next time
        if (second == 60)
        {
            second = 0;
            minute++;
        }
        if (minute == 60)
        {
            minute = 0;
            hour++;
        }
        if (hour == 24)
        {
            hour = 0;
        }

        chrono = millis() + 1000;
    }
}