InfiniTime.git

commit 30e56834d5301a1e2c2578770293365a7664d9f1

Author: Titus <154823939+tituscmd@users.noreply.github.com>

BatteryInfo App Redesign using arc (#2236)

Redesign BatteryInfo App using an Arch widget instead of a bar.

The colors I used are as follows:
- Discharging (default): green
- Charging: lime
- Battery full: blue
- Battery low (<10%): red

 src/displayapp/screens/BatteryInfo.cpp | 43 ++++++++++++++-------------
 src/displayapp/screens/BatteryInfo.h | 2 


diff --git a/src/displayapp/screens/BatteryInfo.cpp b/src/displayapp/screens/BatteryInfo.cpp
index ab0a2bd4a561f8c3c6c16f82c2868bddceb87fe9..204019880565952c692d6743b1dd41823e354c0e 100644
--- a/src/displayapp/screens/BatteryInfo.cpp
+++ b/src/displayapp/screens/BatteryInfo.cpp
@@ -10,33 +10,35 @@
   batteryPercent = batteryController.PercentRemaining();
   batteryVoltage = batteryController.Voltage();
 
-  charging_bar = lv_bar_create(lv_scr_act(), nullptr);
-  lv_obj_set_size(charging_bar, 200, 15);
-  lv_bar_set_range(charging_bar, 0, 100);
-  lv_obj_align(charging_bar, nullptr, LV_ALIGN_CENTER, 0, 10);
-  lv_bar_set_anim_time(charging_bar, 1000);
-  lv_obj_set_style_local_radius(charging_bar, LV_BAR_PART_BG, LV_STATE_DEFAULT, LV_RADIUS_CIRCLE);
-  lv_obj_set_style_local_bg_color(charging_bar, LV_BAR_PART_BG, LV_STATE_DEFAULT, Colors::bgAlt);
-  lv_obj_set_style_local_bg_opa(charging_bar, LV_BAR_PART_BG, LV_STATE_DEFAULT, LV_OPA_100);
-  lv_obj_set_style_local_bg_color(charging_bar, LV_BAR_PART_INDIC, LV_STATE_DEFAULT, LV_COLOR_RED);
-  lv_bar_set_value(charging_bar, batteryPercent, LV_ANIM_ON);
+  chargingArc = lv_arc_create(lv_scr_act(), nullptr);
+  lv_arc_set_rotation(chargingArc, 270);
+  lv_arc_set_bg_angles(chargingArc, 0, 360);
+  lv_arc_set_adjustable(chargingArc, false);
+  lv_obj_set_size(chargingArc, 180, 180);
+  lv_obj_align(chargingArc, nullptr, LV_ALIGN_CENTER, 0, -30);
+  lv_arc_set_value(chargingArc, batteryPercent);
+  lv_obj_set_style_local_bg_opa(chargingArc, LV_ARC_PART_BG, LV_STATE_DEFAULT, LV_OPA_0);
+  lv_obj_set_style_local_line_color(chargingArc, LV_ARC_PART_BG, LV_STATE_DEFAULT, Colors::bgAlt);
+  lv_obj_set_style_local_border_width(chargingArc, LV_ARC_PART_BG, LV_STATE_DEFAULT, 2);
+  lv_obj_set_style_local_radius(chargingArc, LV_ARC_PART_BG, LV_STATE_DEFAULT, 0);
+  lv_obj_set_style_local_line_color(chargingArc, LV_ARC_PART_INDIC, LV_STATE_DEFAULT, LV_COLOR_LIME);
 
   status = lv_label_create(lv_scr_act(), nullptr);
   lv_label_set_text_static(status, "Reading Battery status");
   lv_label_set_align(status, LV_LABEL_ALIGN_CENTER);
-  lv_obj_align(status, charging_bar, LV_ALIGN_OUT_BOTTOM_MID, 0, 20);
+  lv_obj_align(status, nullptr, LV_ALIGN_IN_BOTTOM_MID, 0, -17);
 
   percent = lv_label_create(lv_scr_act(), nullptr);
-  lv_obj_set_style_local_text_font(percent, LV_LABEL_PART_MAIN, LV_STATE_DEFAULT, &jetbrains_mono_76);
+  lv_obj_set_style_local_text_font(percent, LV_LABEL_PART_MAIN, LV_STATE_DEFAULT, &jetbrains_mono_42);
   lv_label_set_text_fmt(percent, "%02i%%", batteryPercent);
   lv_label_set_align(percent, LV_LABEL_ALIGN_LEFT);
-  lv_obj_align(percent, nullptr, LV_ALIGN_CENTER, 0, -60);
+  lv_obj_align(percent, chargingArc, LV_ALIGN_CENTER, 0, 0);
 
   voltage = lv_label_create(lv_scr_act(), nullptr);
   lv_obj_set_style_local_text_color(voltage, LV_LABEL_PART_MAIN, LV_STATE_DEFAULT, Colors::orange);
   lv_label_set_text_fmt(voltage, "%1i.%02i volts", batteryVoltage / 1000, batteryVoltage % 1000 / 10);
   lv_label_set_align(voltage, LV_LABEL_ALIGN_CENTER);
-  lv_obj_align(voltage, nullptr, LV_ALIGN_CENTER, 0, 95);
+  lv_obj_align(voltage, nullptr, LV_ALIGN_IN_BOTTOM_MID, 0, -7);
 
   taskRefresh = lv_task_create(RefreshTaskCallback, 5000, LV_TASK_PRIO_MID, this);
   Refresh();
@@ -53,22 +55,23 @@   batteryPercent = batteryController.PercentRemaining();
   batteryVoltage = batteryController.Voltage();
 
   if (batteryController.IsCharging()) {
-    lv_obj_set_style_local_bg_color(charging_bar, LV_BAR_PART_INDIC, LV_STATE_DEFAULT, LV_COLOR_RED);
+    lv_obj_set_style_local_line_color(chargingArc, LV_ARC_PART_INDIC, LV_STATE_DEFAULT, LV_COLOR_LIME);
     lv_label_set_text_static(status, "Charging");
   } else if (batteryPercent == 100) {
-    lv_obj_set_style_local_bg_color(charging_bar, LV_BAR_PART_INDIC, LV_STATE_DEFAULT, LV_COLOR_BLUE);
+    lv_obj_set_style_local_line_color(chargingArc, LV_ARC_PART_INDIC, LV_STATE_DEFAULT, LV_COLOR_BLUE);
     lv_label_set_text_static(status, "Fully charged");
   } else if (batteryPercent < 10) {
-    lv_obj_set_style_local_bg_color(charging_bar, LV_BAR_PART_INDIC, LV_STATE_DEFAULT, LV_COLOR_YELLOW);
+    lv_obj_set_style_local_line_color(chargingArc, LV_ARC_PART_INDIC, LV_STATE_DEFAULT, LV_COLOR_RED);
     lv_label_set_text_static(status, "Battery low");
   } else {
-    lv_obj_set_style_local_bg_color(charging_bar, LV_BAR_PART_INDIC, LV_STATE_DEFAULT, Colors::highlight);
+    lv_obj_set_style_local_line_color(chargingArc, LV_ARC_PART_INDIC, LV_STATE_DEFAULT, LV_COLOR_GREEN);
     lv_label_set_text_static(status, "Discharging");
   }
 
   lv_label_set_text_fmt(percent, "%02i%%", batteryPercent);
+  lv_obj_align(percent, chargingArc, LV_ALIGN_CENTER, 0, 0);
 
-  lv_obj_align(status, charging_bar, LV_ALIGN_OUT_BOTTOM_MID, 0, 20);
+  lv_obj_align(status, voltage, LV_ALIGN_IN_BOTTOM_MID, 0, -27);
   lv_label_set_text_fmt(voltage, "%1i.%02i volts", batteryVoltage / 1000, batteryVoltage % 1000 / 10);
-  lv_bar_set_value(charging_bar, batteryPercent, LV_ANIM_ON);
+  lv_arc_set_value(chargingArc, batteryPercent);
 }




diff --git a/src/displayapp/screens/BatteryInfo.h b/src/displayapp/screens/BatteryInfo.h
index aa01d464ce0773fea82d1f08222b408ed226ceaf..27bbaa00c0a58cab3daa9ac2f75e6eb76bcec152 100644
--- a/src/displayapp/screens/BatteryInfo.h
+++ b/src/displayapp/screens/BatteryInfo.h
@@ -24,7 +24,7 @@         const Pinetime::Controllers::Battery& batteryController;
 
         lv_obj_t* voltage;
         lv_obj_t* percent;
-        lv_obj_t* charging_bar;
+        lv_obj_t* chargingArc;
         lv_obj_t* status;
 
         lv_task_t* taskRefresh;