ThemeSetter

Posted on
  • In the context of learning how to write (non-trivial) apps for the Bangle.js 2, I've implemented a "ThemeSetter" which allows you to configure global theming in a more comfortable way than through the settings menu.

    While it already uses the "layout" library, I still had to implement a lot myself, such as

    • text views with configurable alignment and "bold" text,
    • a few custom controls, and
    • generic event dispatching

    The current state can already be found in my own app loader - but soon, hopefully, also in the official "app store". Source code is available as well.

    After lunch, I'll start some "code golfing" in order to make the source more compact - e.g., by introducing a mechanism similar to the "class" attributes of HTML elements.


    4 Attachments

    • ThemeSetter-MainScreen.png
    • ThemeSetter-DetailSelectionScreen.png
    • ThemeSetter-ColorSelectionScreen.png
    • ThemeSetter-ThemePreviewScreen.png
  • Tried it out. Nice.

    A few comments, which I hope help.

    1. Needs an exit button on the first screen otherwise you have to do a BTN1 reset to leave the app.

    2. Needs an icon file as the icon comes up as blank in the loader.

    3. Would be good to extend this so that you first see a list of custom theme names. You could then call the app 'Theme Manager' Eg black on white, blues, orange. You then load the theme in and can edit it it, save it back. You then get to choose which theme you want to setup as the default customised theme.

    4. would be good to have a reset to default option in case you screw up the themes.

  • Thanks for the remarks - will work on them one after the other. The need for changes will be a nice "stress test" of layout library and my additional stuff.

    The icon exists already, but seems to be in a wrong format (although I used to documented way of creating it).

    But: is there a (well-known) list of named themes? Or do you expect me to invent them?

  • I dont think there is a well known list of themes. You might have to default to something like light1, dark1, light2, dark2, mytheme1, mytheme2, mytheme3 as you are not going to be able to get someone to type in the names of themes. Or just simply theme1, theme2, theme3 ,, the idea being that it is up to the use to create and modify their custom themes but that Theme Manager would provide a way to select them as the globally set theme.

  • ok, I see...let me see what I can do in that context

  • ok, the icon should work now (the old one included transparency which the Bangle does not seem to like)

    However, I have a dumb question: how do I "exit" from my application?

    (Edit: do I just have to execute load()?)

  • ok, "ThemeSetter" now has an "Exit" button which may be used to leave the app.

    Concerning remarks 3 and 4: I'll have to think about how to implement them - let's see what I can do...

  • Oops,

    I had to publish another version since some labels did not override the current theme settings properly and, thus, turned out to be potentially illegible...this is fixed now.

  • there is now a fourth version of the ThemeSetter available.

    The new version uses my "common settings" mechanism for layouts, which drastically reduces typing and simplifies code changes - like style classes for HTML elements, but simplified for Espruino.

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

ThemeSetter

Posted by Avatar for Andreas_Rozek @Andreas_Rozek

Actions