Question about Bangle.setUI

Posted on
  • I noticed that Gordon changed a number of clock apps to use Bangle.setUI("clock") instead of setWatch() to open the launcher (incl. my own). But looking at the documentation I fail to understand what that function does. When I test the change it behaves as intended (i.e. BTN2 still opens the launcher), but I don't know how. If "clock" is the callback, why does it open the launcher? How does it know to use BTN2?

    Can anyone explain what that function actually does?

  • I think the documentation is lagging behind a bit, but the polyfill from the bootloader should clarify some things.

    "clock" is not a callback, it is the mode. For "clock" mode it simply loads the launcher when BTN2 is pressed, so there is no need to pass a callback.

  • Thanks @rigrig - yes, the docs need updating. I'll try and get something in for that.

    The general idea is you have a few different UI modes that are supported (up/down, left/right) and that play well with E.showMessage/showMenu/etc. Not only do they work on Bangle.js, but when Bangle.js 2 is released (or any other device with a full touchscreen but not all 3 buttons) then the apps work on there too.

    It has a few benefits:

    • For clocks, Bangle.CLOCK gets defined, so you can do stuff only when in a clock app (eg the clock widget now only appears if you're not on a clock app)
    • I've had a lot of folks asking: why can't the launcher start on another button / can I start a certain app on BTN3 / can I swipe to another app / etc. Previously you'd have had to have made your own clock, but now you can just create a new Bangle.setUI and now every app will use that.
    • If you used E.showMenu in your clock app it'd have conflicted with the showLauncher - and now that is fixed too.
  • Ok thanks, the source code makes it much clearer.

    I'm a little confused still when you say "you can just create a new Bangle.setUI and now every app will use that". Isn't that Bangle.setUI local to the app that is currently running? So if I specify a callback, that function would have to be defined in the same app or clock? Or can other apps use a callback function that is defined in another app?

  • I'm a little confused still when you say "you can just create a new Bangle.setUI"

    Well, you could add the following code to run at boot - for example via:­

    (function() {
      var sui = Bangle.setUI;
      Bangle.setUI = function(mode, cb) {
        if (mode!="clock") return sui(mode,cb);
        sui(); // clear
        Bangle.swipeHandler = Bangle.showLauncher;
        Bangle.on("swipe", Bangle.swipeHandler);

    And now Bangle.setUI is overwritten such that for normal clocks, you now swipe your finger to enter the launcher rather than using BTN2.

  • Ok, I see what you mean. That makes sense. Thanks Gordon!

  • Post a reply
    • Bold
    • Italics
    • Link
    • Image
    • List
    • Quote
    • code
    • Preview

Question about Bangle.setUI

Posted by Avatar for Sebastian @Sebastian