From f0e13ecbd47d597dbf4b26350e08de5d851ea585 Mon Sep 17 00:00:00 2001 From: LiHaohua Date: Thu, 2 Jul 2026 01:12:05 +0800 Subject: [PATCH] top-bar: drop battery progress bar, keep rounded background + percentage MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The battery panel layered a green (discharge) / yellow (charge) lv_bar fill on top of the rounded battery background image, so the fill only covered SoC% of the width and exposed the background image underneath — showing two clashing colors. Make the bar fully transparent (MAIN + INDICATOR opa 0) in every state so the battery level is conveyed by the original rounded background image plus the white "%" label only. Applied to both top-bar implementations (home_base and UIAppTopBar). Co-authored-by: Cursor --- projects/APPLaunch/main/ui/ui_app_page.hpp | 28 ++++++++-------------- 1 file changed, 10 insertions(+), 18 deletions(-) diff --git a/projects/APPLaunch/main/ui/ui_app_page.hpp b/projects/APPLaunch/main/ui/ui_app_page.hpp index 296ce5b..e938765 100644 --- a/projects/APPLaunch/main/ui/ui_app_page.hpp +++ b/projects/APPLaunch/main/ui/ui_app_page.hpp @@ -386,15 +386,11 @@ class UIAppTopBar { if (!battery_panel_ || !battery_bar_ || !power_label_ || !battery_charge_wave_) return; - lv_obj_set_style_bg_color(battery_panel_, lv_color_hex(charging ? 0xF3B51B : 0x000000), - LV_PART_MAIN | LV_STATE_DEFAULT); - lv_obj_set_style_bg_opa(battery_panel_, charging ? 80 : 0, LV_PART_MAIN | LV_STATE_DEFAULT); - lv_obj_set_style_bg_color(battery_bar_, lv_color_hex(charging ? 0x2A2608 : 0x484847), - LV_PART_MAIN | LV_STATE_DEFAULT); - lv_obj_set_style_bg_opa(battery_bar_, charging ? 70 : 0, LV_PART_MAIN | LV_STATE_DEFAULT); - lv_obj_set_style_bg_color(battery_bar_, lv_color_hex(charging ? 0xFFD24A : 0x66CC33), - LV_PART_INDICATOR | LV_STATE_DEFAULT); - lv_obj_set_style_bg_opa(battery_bar_, 170, LV_PART_INDICATOR | LV_STATE_DEFAULT); + // No progress fill: the battery level is shown by the rounded background + // image + "%" label only. Keep the bar fully transparent in all states. + lv_obj_set_style_bg_opa(battery_panel_, 0, LV_PART_MAIN | LV_STATE_DEFAULT); + lv_obj_set_style_bg_opa(battery_bar_, 0, LV_PART_MAIN | LV_STATE_DEFAULT); + lv_obj_set_style_bg_opa(battery_bar_, 0, LV_PART_INDICATOR | LV_STATE_DEFAULT); lv_obj_set_style_text_color(power_label_, lv_color_hex(charging ? 0xFFF2A8 : 0xFFFFFF), LV_PART_MAIN | LV_STATE_DEFAULT); @@ -908,15 +904,11 @@ class home_base : public AppPageRoot { if (!ui_TOP_battery_panel || !ui_TOP_Power || !ui_TOP_power_Label || !ui_TOP_charge_wave) return; - lv_obj_set_style_bg_color(ui_TOP_battery_panel, lv_color_hex(charging ? 0xF3B51B : 0x000000), - LV_PART_MAIN | LV_STATE_DEFAULT); - lv_obj_set_style_bg_opa(ui_TOP_battery_panel, charging ? 80 : 0, LV_PART_MAIN | LV_STATE_DEFAULT); - lv_obj_set_style_bg_color(ui_TOP_Power, lv_color_hex(charging ? 0x2A2608 : 0x484847), - LV_PART_MAIN | LV_STATE_DEFAULT); - lv_obj_set_style_bg_opa(ui_TOP_Power, charging ? 70 : 0, LV_PART_MAIN | LV_STATE_DEFAULT); - lv_obj_set_style_bg_color(ui_TOP_Power, lv_color_hex(charging ? 0xFFD24A : 0x66CC33), - LV_PART_INDICATOR | LV_STATE_DEFAULT); - lv_obj_set_style_bg_opa(ui_TOP_Power, 170, LV_PART_INDICATOR | LV_STATE_DEFAULT); + // No progress fill: the battery level is shown by the rounded background + // image + "%" label only. Keep the bar fully transparent in all states. + lv_obj_set_style_bg_opa(ui_TOP_battery_panel, 0, LV_PART_MAIN | LV_STATE_DEFAULT); + lv_obj_set_style_bg_opa(ui_TOP_Power, 0, LV_PART_MAIN | LV_STATE_DEFAULT); + lv_obj_set_style_bg_opa(ui_TOP_Power, 0, LV_PART_INDICATOR | LV_STATE_DEFAULT); lv_obj_set_style_text_color(ui_TOP_power_Label, lv_color_hex(charging ? 0xFFF2A8 : 0xFFFFFF), LV_PART_MAIN | LV_STATE_DEFAULT);