[ClockFace + Layout] Custom clock: battery drain

Hello!

Lately I have little free time but I am trying to work on my own clock using ClockFace and Layout libs.

My goals are:

• fullscreen (no widgets)
  
• only show date + time + steps
  
• custom "widgets" in the top bar
  
• battery status in the bottom bar
  
  

After I added the top bar I noticed a HUGE battery drain (30-40% per day!) but I don't undestand why.
What's wrong with my code?

The code is in my fork: https://github.com/alessandrococco/Bangl­eApps/blob/poc-my-clock/apps/patclock/ap­p.js

Thank you! :-)

1 Attachment

Not sure if ClockFace and Layout libs do that automatically because I'm currently not using them, but are you drawing the screen every minute or so? If you draw the screen every cycle, it may be the reason.
Refer to e.g. https://github.com/alessandrococco/Bangl­eApps/blob/3bddcd402d8e3dd3e9474e022bfe8­6478cebf811/apps/hworldclock/app.js#L113­

Not sure if ClockFace and Layout libs do that automatically because I'm currently not using them, but are you drawing the screen every minute or so?

Yes, I configured Clockface with a "precision" of 60 seconds.

If you draw the screen every cycle, it may be the reason.

Damn, I didn't notice I forgot to redraw my topbar only if something changed .-. I'll fix asap!

Thanks!

I updated the renderTopBar() method to draw the "widgets" only if its value has been changed but there's something wrong. Last night battery drop from 70% to 30% :-(

let prevLocked = undefined;
let prevConnected = undefined;

function renderTopBar() {
    const itemW = 10;
    const itemH = 2;

    let locked = Bangle.isLocked();
    if (locked != prevLocked) {
      const lockColor = locked ? g.theme.fg : g.theme.bg;
      g.setColor(lockColor).fillRect(0, 0, itemW, itemH).setColor(g.theme.fg);
      prevLocked = locked;
    }

    let connected = NRF.getSecurityStatus().connected;
    if (connected != prevConnected) {
      const bluetoothColor = connected ? (g.theme.dark ? "#0ff" : "#00f") : (g.theme.dark ? "#666" : "#999");
      g.setColor(bluetoothColor).fillRect(item­W + 1, 0, 1 + itemW * 2, itemH).setColor(g.theme.fg);
      prevConnected = connected;
    }
}

Bangle.on("lock", b => {
    renderTopBar();
});
NRF.on("connect", () => {
    renderTopBar();
});
NRF.on("disconnect", () => {
    renderTopBar();
});

Am I missing anything else?

Calling this.layout.update(); every minute might be expensive?

You could try removing lazy rendering, and do something like this:

if (changed.d) { // check days first: may need to update layout
      this.layout.update(); // dayStr could be a different size now
      this.layout.render(this.layout.date);
      this.layout.render(this.layout.dayStr);
}
if (changed.h) this.layout.render(this.layout.hour);
if (changed.m) {
      this.layout.render(this.layout.minutes);­
      this.layout.render(this.layout.steps);
}

Thanks, I can try it but I'm not sure about it: without the renderTopBar() method the battery lasts at least 10 days. Now it lasts 2/3 days :-(

I have no widgets installed: only alarms, messages & android app.