Style checkboxes as radio buttons

src/CMakeLists.txt

@@ -423,6 +423,7 @@ list(APPEND SOURCE_FILES
         displayapp/screens/Timer.cpp
         displayapp/screens/Error.cpp
         displayapp/screens/Alarm.cpp
+        displayapp/screens/Styles.cpp
         displayapp/Colors.cpp
 
         ## Settings

src/displayapp/lv_pinetime_theme.c

@@ -119,7 +119,6 @@ static void basic_init(void) {
   lv_style_set_bg_color(&style_btn, LV_STATE_DISABLED | LV_STATE_CHECKED, lv_color_hex3(0x888));
   lv_style_set_border_color(&style_btn, LV_STATE_DEFAULT, theme.color_primary);
   lv_style_set_border_width(&style_btn, LV_STATE_DEFAULT, 0);
-  lv_style_set_border_opa(&style_btn, LV_STATE_CHECKED, LV_OPA_TRANSP);
 
   lv_style_set_text_color(&style_btn, LV_STATE_DEFAULT, lv_color_hex(0xffffff));
   lv_style_set_text_color(&style_btn, LV_STATE_CHECKED, lv_color_hex(0xffffff));

src/displayapp/screens/Styles.cpp

@@ -0,0 +1,8 @@
+#include "Styles.h"
+
+void Pinetime::Applications::Screens::SetRadioButtonStyle(lv_obj_t* checkbox) {
+  lv_obj_set_style_local_radius(checkbox, LV_CHECKBOX_PART_BULLET, LV_STATE_DEFAULT, LV_RADIUS_CIRCLE);
+  lv_obj_set_style_local_border_width(checkbox, LV_CHECKBOX_PART_BULLET, LV_STATE_CHECKED, 9);
+  lv_obj_set_style_local_border_color(checkbox, LV_CHECKBOX_PART_BULLET, LV_STATE_CHECKED, LV_COLOR_GREEN);
+  lv_obj_set_style_local_bg_color(checkbox, LV_CHECKBOX_PART_BULLET, LV_STATE_CHECKED, LV_COLOR_WHITE);
+}

src/displayapp/screens/Styles.h

@@ -0,0 +1,9 @@
+#include <lvgl/lvgl.h>
+
+namespace Pinetime {
+  namespace Applications {
+    namespace Screens {
+      void SetRadioButtonStyle(lv_obj_t* checkbox);
+    }
+  }
+}

src/displayapp/screens/settings/SettingDisplay.cpp

@@ -2,6 +2,7 @@
 #include <lvgl/lvgl.h>
 #include "displayapp/DisplayApp.h"
 #include "displayapp/Messages.h"
+#include "displayapp/screens/Styles.h"
 #include "displayapp/screens/Screen.h"
 #include "displayapp/screens/Symbols.h"
 
@@ -14,6 +15,8 @@ namespace {
   }
 }
 
+constexpr std::array<uint16_t, 4> SettingDisplay::options;
+
 SettingDisplay::SettingDisplay(Pinetime::Applications::DisplayApp* app, Pinetime::Controllers::Settings& settingsController)
   : Screen(app), settingsController {settingsController} {
 
@@ -40,39 +43,19 @@ SettingDisplay::SettingDisplay(Pinetime::Applications::DisplayApp* app, Pinetime
   lv_label_set_align(icon, LV_LABEL_ALIGN_CENTER);
   lv_obj_align(icon, title, LV_ALIGN_OUT_LEFT_MID, -10, 0);
 
-  optionsTotal = 0;
-  cbOption[optionsTotal] = lv_checkbox_create(container1, nullptr);
-  lv_checkbox_set_text_static(cbOption[optionsTotal], "  5 seconds");
-  cbOption[optionsTotal]->user_data = this;
-  lv_obj_set_event_cb(cbOption[optionsTotal], event_handler);
-  if (settingsController.GetScreenTimeOut() == 5000) {
-    lv_checkbox_set_checked(cbOption[optionsTotal], true);
-  }
-  optionsTotal++;
-  cbOption[optionsTotal] = lv_checkbox_create(container1, nullptr);
-  lv_checkbox_set_text_static(cbOption[optionsTotal], " 15 seconds");
-  cbOption[optionsTotal]->user_data = this;
-  lv_obj_set_event_cb(cbOption[optionsTotal], event_handler);
-  if (settingsController.GetScreenTimeOut() == 15000) {
-    lv_checkbox_set_checked(cbOption[optionsTotal], true);
-  }
-  optionsTotal++;
-  cbOption[optionsTotal] = lv_checkbox_create(container1, nullptr);
-  lv_checkbox_set_text_static(cbOption[optionsTotal], " 20 seconds");
-  cbOption[optionsTotal]->user_data = this;
-  lv_obj_set_event_cb(cbOption[optionsTotal], event_handler);
-  if (settingsController.GetScreenTimeOut() == 20000) {
-    lv_checkbox_set_checked(cbOption[optionsTotal], true);
-  }
-  optionsTotal++;
-  cbOption[optionsTotal] = lv_checkbox_create(container1, nullptr);
-  lv_checkbox_set_text_static(cbOption[optionsTotal], " 30 seconds");
-  cbOption[optionsTotal]->user_data = this;
-  lv_obj_set_event_cb(cbOption[optionsTotal], event_handler);
-  if (settingsController.GetScreenTimeOut() == 30000) {
-    lv_checkbox_set_checked(cbOption[optionsTotal], true);
+  char buffer[12];
+  for (unsigned int i = 0; i < options.size(); i++) {
+    cbOption[i] = lv_checkbox_create(container1, nullptr);
+    sprintf(buffer, "%3d seconds",  options[i] / 1000);
+    lv_checkbox_set_text(cbOption[i], buffer);
+    cbOption[i]->user_data = this;
+    lv_obj_set_event_cb(cbOption[i], event_handler);
+    SetRadioButtonStyle(cbOption[i]);
+
+    if (settingsController.GetScreenTimeOut() == options[i]) {
+      lv_checkbox_set_checked(cbOption[i], true);
+    }
   }
-  optionsTotal++;
 }
 
 SettingDisplay::~SettingDisplay() {
@@ -82,25 +65,11 @@ SettingDisplay::~SettingDisplay() {
 
 void SettingDisplay::UpdateSelected(lv_obj_t* object, lv_event_t event) {
   if (event == LV_EVENT_CLICKED) {
-    for (int i = 0; i < optionsTotal; i++) {
+    for (unsigned int i = 0; i < options.size(); i++) {
       if (object == cbOption[i]) {
         lv_checkbox_set_checked(cbOption[i], true);
-
-        if (i == 0) {
-          settingsController.SetScreenTimeOut(5000);
-        };
-        if (i == 1) {
-          settingsController.SetScreenTimeOut(15000);
-        };
-        if (i == 2) {
-          settingsController.SetScreenTimeOut(20000);
-        };
-        if (i == 3) {
-          settingsController.SetScreenTimeOut(30000);
-        };
-
+        settingsController.SetScreenTimeOut(options[i]);
         app->PushMessage(Applications::Display::Messages::UpdateTimeOut);
-
       } else {
         lv_checkbox_set_checked(cbOption[i], false);
       }

src/displayapp/screens/settings/SettingDisplay.h

@@ -1,7 +1,9 @@
 #pragma once
 
+#include <array>
 #include <cstdint>
 #include <lvgl/lvgl.h>
+
 #include "components/settings/Settings.h"
 #include "displayapp/screens/Screen.h"
 
@@ -18,9 +20,10 @@ namespace Pinetime {
         void UpdateSelected(lv_obj_t* object, lv_event_t event);
 
       private:
+        static constexpr std::array<uint16_t, 4> options = {5000, 15000, 20000, 30000};
+
         Controllers::Settings& settingsController;
-        uint8_t optionsTotal;
-        lv_obj_t* cbOption[4];
+        lv_obj_t* cbOption[options.size()];
       };
     }
   }

src/displayapp/screens/settings/SettingTimeFormat.cpp

@@ -1,6 +1,7 @@
 #include "displayapp/screens/settings/SettingTimeFormat.h"
 #include <lvgl/lvgl.h>
 #include "displayapp/DisplayApp.h"
+#include "displayapp/screens/Styles.h"
 #include "displayapp/screens/Screen.h"
 #include "displayapp/screens/Symbols.h"
 
@@ -13,6 +14,8 @@ namespace {
   }
 }
 
+constexpr std::array<const char*, 2> SettingTimeFormat::options;
+
 SettingTimeFormat::SettingTimeFormat(Pinetime::Applications::DisplayApp* app, Pinetime::Controllers::Settings& settingsController)
   : Screen(app), settingsController {settingsController} {
 
@@ -39,24 +42,19 @@ SettingTimeFormat::SettingTimeFormat(Pinetime::Applications::DisplayApp* app, Pi
   lv_label_set_align(icon, LV_LABEL_ALIGN_CENTER);
   lv_obj_align(icon, title, LV_ALIGN_OUT_LEFT_MID, -10, 0);
 
-  optionsTotal = 0;
-  cbOption[optionsTotal] = lv_checkbox_create(container1, nullptr);
-  lv_checkbox_set_text_static(cbOption[optionsTotal], " 12-hour");
-  cbOption[optionsTotal]->user_data = this;
-  lv_obj_set_event_cb(cbOption[optionsTotal], event_handler);
-  if (settingsController.GetClockType() == Controllers::Settings::ClockType::H12) {
-    lv_checkbox_set_checked(cbOption[optionsTotal], true);
+  for (unsigned int i = 0; i < options.size(); i++) {
+    cbOption[i] = lv_checkbox_create(container1, nullptr);
+    lv_checkbox_set_text(cbOption[i], options[i]);
+    cbOption[i]->user_data = this;
+    lv_obj_set_event_cb(cbOption[i], event_handler);
+    SetRadioButtonStyle(cbOption[i]);
   }
 
-  optionsTotal++;
-  cbOption[optionsTotal] = lv_checkbox_create(container1, nullptr);
-  lv_checkbox_set_text_static(cbOption[optionsTotal], " 24-hour");
-  cbOption[optionsTotal]->user_data = this;
-  lv_obj_set_event_cb(cbOption[optionsTotal], event_handler);
-  if (settingsController.GetClockType() == Controllers::Settings::ClockType::H24) {
-    lv_checkbox_set_checked(cbOption[optionsTotal], true);
+  if (settingsController.GetClockType() == Controllers::Settings::ClockType::H12) {
+    lv_checkbox_set_checked(cbOption[0], true);
+  } else if (settingsController.GetClockType() == Controllers::Settings::ClockType::H24) {
+    lv_checkbox_set_checked(cbOption[1], true);
   }
-  optionsTotal++;
 }
 
 SettingTimeFormat::~SettingTimeFormat() {
@@ -66,7 +64,7 @@ SettingTimeFormat::~SettingTimeFormat() {
 
 void SettingTimeFormat::UpdateSelected(lv_obj_t* object, lv_event_t event) {
   if (event == LV_EVENT_VALUE_CHANGED) {
-    for (int i = 0; i < optionsTotal; i++) {
+    for (unsigned int i = 0; i < options.size(); i++) {
       if (object == cbOption[i]) {
         lv_checkbox_set_checked(cbOption[i], true);
 

src/displayapp/screens/settings/SettingTimeFormat.h

@@ -1,7 +1,9 @@
 #pragma once
 
+#include <array>
 #include <cstdint>
 #include <lvgl/lvgl.h>
+
 #include "components/settings/Settings.h"
 #include "displayapp/screens/Screen.h"
 
@@ -18,9 +20,9 @@ namespace Pinetime {
         void UpdateSelected(lv_obj_t* object, lv_event_t event);
 
       private:
+        static constexpr std::array<const char*, 2> options = {" 12-hour", " 24-hour"};
         Controllers::Settings& settingsController;
-        uint8_t optionsTotal;
-        lv_obj_t* cbOption[2];
+        lv_obj_t* cbOption[options.size()];
       };
     }
   }

src/displayapp/screens/settings/SettingWatchFace.cpp

@@ -2,6 +2,7 @@
 #include <lvgl/lvgl.h>
 #include "displayapp/DisplayApp.h"
 #include "displayapp/screens/Screen.h"
+#include "displayapp/screens/Styles.h"
 #include "displayapp/screens/Symbols.h"
 
 using namespace Pinetime::Applications::Screens;
@@ -13,6 +14,8 @@ namespace {
   }
 }
 
+constexpr std::array<const char*, 3> SettingWatchFace::options;
+
 SettingWatchFace::SettingWatchFace(Pinetime::Applications::DisplayApp* app, Pinetime::Controllers::Settings& settingsController)
   : Screen(app), settingsController {settingsController} {
 
@@ -40,34 +43,17 @@ SettingWatchFace::SettingWatchFace(Pinetime::Applications::DisplayApp* app, Pine
   lv_label_set_align(icon, LV_LABEL_ALIGN_CENTER);
   lv_obj_align(icon, title, LV_ALIGN_OUT_LEFT_MID, -10, 0);
 
-  optionsTotal = 0;
-  cbOption[optionsTotal] = lv_checkbox_create(container1, nullptr);
-  lv_checkbox_set_text_static(cbOption[optionsTotal], " Digital face");
-  cbOption[optionsTotal]->user_data = this;
-  lv_obj_set_event_cb(cbOption[optionsTotal], event_handler);
-  if (settingsController.GetClockFace() == 0) {
-    lv_checkbox_set_checked(cbOption[optionsTotal], true);
-  }
-
-  optionsTotal++;
-  cbOption[optionsTotal] = lv_checkbox_create(container1, nullptr);
-  lv_checkbox_set_text_static(cbOption[optionsTotal], " Analog face");
-  cbOption[optionsTotal]->user_data = this;
-  lv_obj_set_event_cb(cbOption[optionsTotal], event_handler);
-  if (settingsController.GetClockFace() == 1) {
-    lv_checkbox_set_checked(cbOption[optionsTotal], true);
-  }
+  for (unsigned int i = 0; i < options.size(); i++) {
+    cbOption[i] = lv_checkbox_create(container1, nullptr);
+    lv_checkbox_set_text(cbOption[i], options[i]);
+    cbOption[i]->user_data = this;
+    lv_obj_set_event_cb(cbOption[i], event_handler);
+    SetRadioButtonStyle(cbOption[i]);
 
-  optionsTotal++;
-  cbOption[optionsTotal] = lv_checkbox_create(container1, nullptr);
-  lv_checkbox_set_text_static(cbOption[optionsTotal], " PineTimeStyle");
-  cbOption[optionsTotal]->user_data = this;
-  lv_obj_set_event_cb(cbOption[optionsTotal], event_handler);
-  if (settingsController.GetClockFace() == 2) {
-    lv_checkbox_set_checked(cbOption[optionsTotal], true);
+    if (settingsController.GetClockFace() == i) {
+      lv_checkbox_set_checked(cbOption[i], true);
+    }
   }
-
-  optionsTotal++;
 }
 
 SettingWatchFace::~SettingWatchFace() {
@@ -77,7 +63,7 @@ SettingWatchFace::~SettingWatchFace() {
 
 void SettingWatchFace::UpdateSelected(lv_obj_t* object, lv_event_t event) {
   if (event == LV_EVENT_VALUE_CHANGED) {
-    for (uint8_t i = 0; i < optionsTotal; i++) {
+    for (unsigned int i = 0; i < options.size(); i++) {
       if (object == cbOption[i]) {
         lv_checkbox_set_checked(cbOption[i], true);
         settingsController.SetClockFace(i);

src/displayapp/screens/settings/SettingWatchFace.h

@@ -1,7 +1,9 @@
 #pragma once
 
+#include <array>
 #include <cstdint>
 #include <lvgl/lvgl.h>
+
 #include "components/settings/Settings.h"
 #include "displayapp/screens/Screen.h"
 
@@ -18,9 +20,10 @@ namespace Pinetime {
         void UpdateSelected(lv_obj_t* object, lv_event_t event);
 
       private:
+        static constexpr std::array<const char*, 3> options = {" Digital face", " Analog face", " PineTimeStyle"};
         Controllers::Settings& settingsController;
-        uint8_t optionsTotal;
-        lv_obj_t* cbOption[2];
+
+        lv_obj_t* cbOption[options.size()];
       };
     }
   }