From 312b70f9f6a2e3d7d387dfe3502f12f091e8fe37 Mon Sep 17 00:00:00 2001 From: ailurux Date: Thu, 7 Mar 2024 14:20:06 +1100 Subject: WIP: Base styles are applied --- src/ui/themes.cpp | 179 ++++++------------------------------------------------ 1 file changed, 18 insertions(+), 161 deletions(-) (limited to 'src/ui/themes.cpp') diff --git a/src/ui/themes.cpp b/src/ui/themes.cpp index f8390570..87b1f92b 100644 --- a/src/ui/themes.cpp +++ b/src/ui/themes.cpp @@ -19,84 +19,6 @@ static void theme_apply_cb(lv_theme_t* th, lv_obj_t* obj) { } Theme::Theme() { - lv_style_init(&base_style_); - lv_style_set_bg_opa(&base_style_, LV_OPA_TRANSP); - lv_style_set_text_font(&base_style_, &font_fusion_12); - lv_style_set_text_color(&base_style_, lv_color_black()); - - lv_style_init(&base_focused_style_); - lv_style_set_bg_opa(&base_focused_style_, LV_OPA_COVER); - lv_style_set_bg_color(&base_focused_style_, - lv_palette_lighten(LV_PALETTE_BLUE, 5)); - - lv_style_init(&button_style_); - lv_style_set_pad_left(&button_style_, 2); - lv_style_set_pad_right(&button_style_, 2); - lv_style_set_pad_top(&button_style_, 1); - lv_style_set_pad_bottom(&button_style_, 1); - lv_style_set_bg_color(&button_style_, lv_color_white()); - lv_style_set_radius(&button_style_, 5); - - lv_style_init(&bar_style_); - lv_style_set_bg_opa(&bar_style_, LV_OPA_COVER); - lv_style_set_radius(&bar_style_, LV_RADIUS_CIRCLE); - - lv_style_init(&slider_indicator_style_); - lv_style_set_radius(&slider_indicator_style_, LV_RADIUS_CIRCLE); - lv_style_set_bg_color(&slider_indicator_style_, - lv_palette_main(LV_PALETTE_BLUE)); - - lv_style_init(&slider_knob_style_); - lv_style_set_radius(&slider_knob_style_, LV_RADIUS_CIRCLE); - lv_style_set_pad_all(&slider_knob_style_, 2); - lv_style_set_bg_color(&slider_knob_style_, lv_color_white()); - lv_style_set_shadow_width(&slider_knob_style_, 5); - lv_style_set_shadow_opa(&slider_knob_style_, LV_OPA_COVER); - - lv_style_init(&slider_knob_focused_style_); - lv_style_set_bg_color(&slider_knob_focused_style_, - lv_palette_lighten(LV_PALETTE_BLUE, 4)); - - lv_style_init(&switch_style_); - lv_style_set_width(&switch_style_, 28); - lv_style_set_height(&switch_style_, 18); - lv_style_set_radius(&switch_style_, LV_RADIUS_CIRCLE); - - lv_style_init(&switch_knob_style_); - lv_style_set_pad_all(&switch_knob_style_, -2); - lv_style_set_radius(&switch_knob_style_, LV_RADIUS_CIRCLE); - lv_style_set_bg_opa(&switch_knob_style_, LV_OPA_COVER); - lv_style_set_bg_color(&switch_knob_style_, lv_color_white()); - - lv_style_init(&slider_knob_focused_style_); - lv_style_set_bg_color(&slider_knob_focused_style_, - lv_palette_lighten(LV_PALETTE_BLUE, 4)); - - lv_style_init(&switch_indicator_style_); - lv_style_set_radius(&switch_indicator_style_, LV_RADIUS_CIRCLE); - lv_style_set_bg_opa(&switch_indicator_style_, LV_OPA_COVER); - lv_style_set_bg_color(&switch_indicator_style_, - lv_palette_main(LV_PALETTE_GREY)); - - lv_style_init(&switch_indicator_checked_style_); - lv_style_set_bg_color(&switch_indicator_checked_style_, - lv_palette_main(LV_PALETTE_BLUE)); - - lv_style_init(&dropdown_style_); - lv_style_set_radius(&dropdown_style_, 2); - lv_style_set_pad_all(&dropdown_style_, 2); - lv_style_set_border_width(&dropdown_style_, 1); - lv_style_set_border_color(&dropdown_style_, lv_palette_main(LV_PALETTE_BLUE)); - lv_style_set_border_side(&dropdown_style_, LV_BORDER_SIDE_FULL); - - lv_style_init(&dropdown_list_style_); - lv_style_set_radius(&dropdown_list_style_, 2); - lv_style_set_border_width(&dropdown_list_style_, 1); - lv_style_set_border_color(&dropdown_list_style_, lv_palette_main(LV_PALETTE_BLUE_GREY)); - lv_style_set_bg_opa(&dropdown_list_style_, LV_OPA_COVER); - lv_style_set_bg_color(&dropdown_list_style_, lv_color_white()); - lv_style_set_pad_all(&dropdown_list_style_, 2); - lv_theme_t* parent_theme = lv_disp_get_theme(NULL); theme_ = *parent_theme; theme_.user_data = this; @@ -111,98 +33,33 @@ void Theme::Apply(void) { } void Theme::Callback(lv_obj_t* obj) { - lv_obj_add_style(obj, &base_style_, LV_PART_MAIN); - lv_obj_add_style(obj, &base_focused_style_, LV_PART_SELECTED); - lv_obj_add_style(obj, &base_focused_style_, LV_STATE_FOCUSED); - - if (lv_obj_check_type(obj, &lv_btn_class)) { - lv_obj_add_style(obj, &button_style_, LV_PART_MAIN); - } else if (lv_obj_check_type(obj, &lv_bar_class)) { - lv_obj_add_style(obj, &bar_style_, LV_PART_MAIN); - } else if (lv_obj_check_type(obj, &lv_slider_class)) { - lv_obj_add_style(obj, &bar_style_, LV_PART_MAIN); - lv_obj_add_style(obj, &slider_indicator_style_, LV_PART_INDICATOR); - lv_obj_add_style(obj, &slider_knob_style_, LV_PART_KNOB); - lv_obj_add_style(obj, &slider_knob_focused_style_, LV_STATE_FOCUSED); - } else if (lv_obj_check_type(obj, &lv_switch_class)) { - lv_obj_add_style(obj, &switch_style_, LV_PART_MAIN); - lv_obj_add_style(obj, &switch_indicator_style_, LV_PART_INDICATOR); - lv_obj_add_style(obj, &switch_indicator_checked_style_, - LV_PART_INDICATOR | LV_STATE_CHECKED); - lv_obj_add_style(obj, &switch_knob_style_, LV_PART_KNOB); - } else if (lv_obj_check_type(obj, &lv_dropdown_class)) { - lv_obj_add_style(obj, &dropdown_style_, LV_PART_MAIN); - } else if (lv_obj_check_type(obj, &lv_dropdownlist_class)) { - lv_obj_add_style(obj, &dropdown_list_style_, LV_PART_MAIN); + // Find and apply base styles + if (auto search = style_map.find("base"); search != style_map.end()) { + for (const auto& pair : search->second) { + lv_obj_add_style(obj, pair.second, pair.first); + } } -} - -void Theme::ApplyStyle(lv_obj_t* obj, Style style) { - switch (style) { - case Style::kTopBar: - lv_obj_set_style_pad_bottom(obj, 1, LV_PART_MAIN); - - lv_obj_set_style_shadow_width(obj, 6, LV_PART_MAIN); - lv_obj_set_style_shadow_opa(obj, LV_OPA_COVER, LV_PART_MAIN); - lv_obj_set_style_shadow_ofs_x(obj, 0, LV_PART_MAIN); - break; - case Style::kPopup: - lv_obj_set_style_shadow_width(obj, 6, LV_PART_MAIN); - lv_obj_set_style_shadow_opa(obj, LV_OPA_COVER, LV_PART_MAIN); - lv_obj_set_style_shadow_ofs_x(obj, 0, LV_PART_MAIN); - lv_obj_set_style_shadow_ofs_y(obj, 0, LV_PART_MAIN); - - lv_obj_set_style_radius(obj, 5, LV_PART_MAIN); - - lv_obj_set_style_bg_opa(obj, LV_OPA_COVER, LV_PART_MAIN); - lv_obj_set_style_bg_color(obj, lv_color_white(), LV_PART_MAIN); - - lv_obj_set_style_pad_top(obj, 2, LV_PART_MAIN); - lv_obj_set_style_pad_bottom(obj, 2, LV_PART_MAIN); - lv_obj_set_style_pad_left(obj, 2, LV_PART_MAIN); - lv_obj_set_style_pad_right(obj, 2, LV_PART_MAIN); - break; - case Style::kTab: - lv_obj_set_style_radius(obj, 0, LV_PART_MAIN); - lv_obj_set_style_border_width(obj, 1, LV_STATE_CHECKED); - lv_obj_set_style_border_color(obj, lv_palette_main(LV_PALETTE_BLUE), - LV_STATE_CHECKED); - lv_obj_set_style_border_side(obj, LV_BORDER_SIDE_BOTTOM, - LV_STATE_CHECKED); - break; - case Style::kButtonPrimary: - lv_obj_set_style_border_width(obj, 1, LV_PART_MAIN); - lv_obj_set_style_border_color(obj, lv_palette_main(LV_PALETTE_BLUE), - LV_PART_MAIN); - lv_obj_set_style_border_side(obj, LV_BORDER_SIDE_FULL, LV_PART_MAIN); - break; - case Style::kMenuSubheadFirst: - case Style::kMenuSubhead: - lv_obj_set_style_text_color(obj, lv_palette_darken(LV_PALETTE_GREY, 3), - LV_PART_MAIN); - lv_obj_set_style_text_align(obj, LV_TEXT_ALIGN_CENTER, LV_PART_MAIN); + // TODO: Apply widget style - lv_obj_set_style_border_width(obj, 1, LV_PART_MAIN); - lv_obj_set_style_border_color(obj, lv_palette_lighten(LV_PALETTE_GREY, 3), - LV_PART_MAIN); - - if (style == Style::kMenuSubhead) { - lv_obj_set_style_border_side( - obj, LV_BORDER_SIDE_TOP | LV_BORDER_SIDE_BOTTOM, LV_PART_MAIN); - } else { - lv_obj_set_style_border_side(obj, LV_BORDER_SIDE_BOTTOM, LV_PART_MAIN); - } - break; - default: - break; - } } +void Theme::ApplyStyle(lv_obj_t* obj, Style style) {} + auto Theme::instance() -> Theme* { static Theme sTheme{}; return &sTheme; } +void Theme::AddStyle(std::string key, int selector, lv_style_t* style) { + style_map.try_emplace(key, std::vector>{}); + if (auto search = style_map.find(key); search != style_map.end()) { + // Key exists + auto &vec = search->second; + // Add it to the list + vec.push_back(std::make_pair(selector, style)); + } +} + } // namespace themes } // namespace ui -- cgit v1.2.3 From dc74bc1de9dd56c4146232622140b56e90dcc43d Mon Sep 17 00:00:00 2001 From: ailurux Date: Thu, 7 Mar 2024 15:46:42 +1100 Subject: Add other styles to lua theme --- src/ui/themes.cpp | 85 +++++++++++++++++++++++++++++++++++++++++++++++++++++-- 1 file changed, 83 insertions(+), 2 deletions(-) (limited to 'src/ui/themes.cpp') diff --git a/src/ui/themes.cpp b/src/ui/themes.cpp index 87b1f92b..4fd477ab 100644 --- a/src/ui/themes.cpp +++ b/src/ui/themes.cpp @@ -40,11 +40,92 @@ void Theme::Callback(lv_obj_t* obj) { } } - // TODO: Apply widget style + // Determine class name + std::string class_name; + if (lv_obj_check_type(obj, &lv_btn_class)) { + class_name = "button"; + } else if (lv_obj_check_type(obj, &lv_bar_class)) { + class_name = "bar"; + } else if (lv_obj_check_type(obj, &lv_slider_class)) { + class_name = "slider"; + } else if (lv_obj_check_type(obj, &lv_switch_class)) { + class_name = "switch"; + } else if (lv_obj_check_type(obj, &lv_dropdown_class)) { + class_name = "dropdown"; + } else if (lv_obj_check_type(obj, &lv_dropdownlist_class)) { + class_name = "dropdownlist"; + } + + // Apply all styles from class + if (auto search = style_map.find(class_name); search != style_map.end()) { + for (const auto& pair : search->second) { + lv_obj_add_style(obj, pair.second, pair.first); + } + } } -void Theme::ApplyStyle(lv_obj_t* obj, Style style) {} +void Theme::ApplyStyle(lv_obj_t* obj, Style style) { + switch (style) { + case Style::kTopBar: + lv_obj_set_style_pad_bottom(obj, 1, LV_PART_MAIN); + + lv_obj_set_style_shadow_width(obj, 6, LV_PART_MAIN); + lv_obj_set_style_shadow_opa(obj, LV_OPA_COVER, LV_PART_MAIN); + lv_obj_set_style_shadow_ofs_x(obj, 0, LV_PART_MAIN); + break; + case Style::kPopup: + lv_obj_set_style_shadow_width(obj, 6, LV_PART_MAIN); + lv_obj_set_style_shadow_opa(obj, LV_OPA_COVER, LV_PART_MAIN); + lv_obj_set_style_shadow_ofs_x(obj, 0, LV_PART_MAIN); + lv_obj_set_style_shadow_ofs_y(obj, 0, LV_PART_MAIN); + + lv_obj_set_style_radius(obj, 5, LV_PART_MAIN); + + lv_obj_set_style_bg_opa(obj, LV_OPA_COVER, LV_PART_MAIN); + lv_obj_set_style_bg_color(obj, lv_color_white(), LV_PART_MAIN); + + lv_obj_set_style_pad_top(obj, 2, LV_PART_MAIN); + lv_obj_set_style_pad_bottom(obj, 2, LV_PART_MAIN); + lv_obj_set_style_pad_left(obj, 2, LV_PART_MAIN); + lv_obj_set_style_pad_right(obj, 2, LV_PART_MAIN); + break; + case Style::kTab: + lv_obj_set_style_radius(obj, 0, LV_PART_MAIN); + + lv_obj_set_style_border_width(obj, 1, LV_STATE_CHECKED); + lv_obj_set_style_border_color(obj, lv_palette_main(LV_PALETTE_BLUE), + LV_STATE_CHECKED); + lv_obj_set_style_border_side(obj, LV_BORDER_SIDE_BOTTOM, + LV_STATE_CHECKED); + break; + case Style::kButtonPrimary: + lv_obj_set_style_border_width(obj, 1, LV_PART_MAIN); + lv_obj_set_style_border_color(obj, lv_palette_main(LV_PALETTE_BLUE), + LV_PART_MAIN); + lv_obj_set_style_border_side(obj, LV_BORDER_SIDE_FULL, LV_PART_MAIN); + break; + case Style::kMenuSubheadFirst: + case Style::kMenuSubhead: + lv_obj_set_style_text_color(obj, lv_palette_darken(LV_PALETTE_GREY, 3), + LV_PART_MAIN); + lv_obj_set_style_text_align(obj, LV_TEXT_ALIGN_CENTER, LV_PART_MAIN); + + lv_obj_set_style_border_width(obj, 1, LV_PART_MAIN); + lv_obj_set_style_border_color(obj, lv_palette_lighten(LV_PALETTE_GREY, 3), + LV_PART_MAIN); + + if (style == Style::kMenuSubhead) { + lv_obj_set_style_border_side( + obj, LV_BORDER_SIDE_TOP | LV_BORDER_SIDE_BOTTOM, LV_PART_MAIN); + } else { + lv_obj_set_style_border_side(obj, LV_BORDER_SIDE_BOTTOM, LV_PART_MAIN); + } + break; + default: + break; + } +} auto Theme::instance() -> Theme* { static Theme sTheme{}; -- cgit v1.2.3 From 1133d4621508b7ec6bac4ab8731f3493066ceeee Mon Sep 17 00:00:00 2001 From: ailurux Date: Sun, 10 Mar 2024 13:20:17 +1100 Subject: WIP Lua Theming- style classes --- src/ui/themes.cpp | 64 ++++++------------------------------------------------- 1 file changed, 6 insertions(+), 58 deletions(-) (limited to 'src/ui/themes.cpp') diff --git a/src/ui/themes.cpp b/src/ui/themes.cpp index 4fd477ab..88f45b1b 100644 --- a/src/ui/themes.cpp +++ b/src/ui/themes.cpp @@ -44,6 +44,8 @@ void Theme::Callback(lv_obj_t* obj) { std::string class_name; if (lv_obj_check_type(obj, &lv_btn_class)) { class_name = "button"; + } else if (lv_obj_check_type(obj, &lv_list_btn_class)) { + class_name = "listbutton"; } else if (lv_obj_check_type(obj, &lv_bar_class)) { class_name = "bar"; } else if (lv_obj_check_type(obj, &lv_slider_class)) { @@ -65,65 +67,11 @@ void Theme::Callback(lv_obj_t* obj) { } -void Theme::ApplyStyle(lv_obj_t* obj, Style style) { - switch (style) { - case Style::kTopBar: - lv_obj_set_style_pad_bottom(obj, 1, LV_PART_MAIN); - - lv_obj_set_style_shadow_width(obj, 6, LV_PART_MAIN); - lv_obj_set_style_shadow_opa(obj, LV_OPA_COVER, LV_PART_MAIN); - lv_obj_set_style_shadow_ofs_x(obj, 0, LV_PART_MAIN); - break; - case Style::kPopup: - lv_obj_set_style_shadow_width(obj, 6, LV_PART_MAIN); - lv_obj_set_style_shadow_opa(obj, LV_OPA_COVER, LV_PART_MAIN); - lv_obj_set_style_shadow_ofs_x(obj, 0, LV_PART_MAIN); - lv_obj_set_style_shadow_ofs_y(obj, 0, LV_PART_MAIN); - - lv_obj_set_style_radius(obj, 5, LV_PART_MAIN); - - lv_obj_set_style_bg_opa(obj, LV_OPA_COVER, LV_PART_MAIN); - lv_obj_set_style_bg_color(obj, lv_color_white(), LV_PART_MAIN); - - lv_obj_set_style_pad_top(obj, 2, LV_PART_MAIN); - lv_obj_set_style_pad_bottom(obj, 2, LV_PART_MAIN); - lv_obj_set_style_pad_left(obj, 2, LV_PART_MAIN); - lv_obj_set_style_pad_right(obj, 2, LV_PART_MAIN); - break; - case Style::kTab: - lv_obj_set_style_radius(obj, 0, LV_PART_MAIN); - - lv_obj_set_style_border_width(obj, 1, LV_STATE_CHECKED); - lv_obj_set_style_border_color(obj, lv_palette_main(LV_PALETTE_BLUE), - LV_STATE_CHECKED); - lv_obj_set_style_border_side(obj, LV_BORDER_SIDE_BOTTOM, - LV_STATE_CHECKED); - break; - case Style::kButtonPrimary: - lv_obj_set_style_border_width(obj, 1, LV_PART_MAIN); - lv_obj_set_style_border_color(obj, lv_palette_main(LV_PALETTE_BLUE), - LV_PART_MAIN); - lv_obj_set_style_border_side(obj, LV_BORDER_SIDE_FULL, LV_PART_MAIN); - break; - case Style::kMenuSubheadFirst: - case Style::kMenuSubhead: - lv_obj_set_style_text_color(obj, lv_palette_darken(LV_PALETTE_GREY, 3), - LV_PART_MAIN); - lv_obj_set_style_text_align(obj, LV_TEXT_ALIGN_CENTER, LV_PART_MAIN); - - lv_obj_set_style_border_width(obj, 1, LV_PART_MAIN); - lv_obj_set_style_border_color(obj, lv_palette_lighten(LV_PALETTE_GREY, 3), - LV_PART_MAIN); - - if (style == Style::kMenuSubhead) { - lv_obj_set_style_border_side( - obj, LV_BORDER_SIDE_TOP | LV_BORDER_SIDE_BOTTOM, LV_PART_MAIN); - } else { - lv_obj_set_style_border_side(obj, LV_BORDER_SIDE_BOTTOM, LV_PART_MAIN); +void Theme::ApplyStyle(lv_obj_t* obj, std::string style_key) { + if (auto search = style_map.find(style_key); search != style_map.end()) { + for (const auto& pair : search->second) { + lv_obj_add_style(obj, pair.second, pair.first); } - break; - default: - break; } } -- cgit v1.2.3 From 10441162c4323d6e41f54425a8d7641fda18f711 Mon Sep 17 00:00:00 2001 From: ailurux Date: Thu, 28 Mar 2024 15:36:16 +1100 Subject: Fix for adding multiple styles with the same key --- src/ui/themes.cpp | 1 + 1 file changed, 1 insertion(+) (limited to 'src/ui/themes.cpp') diff --git a/src/ui/themes.cpp b/src/ui/themes.cpp index 88f45b1b..b13f226a 100644 --- a/src/ui/themes.cpp +++ b/src/ui/themes.cpp @@ -70,6 +70,7 @@ void Theme::Callback(lv_obj_t* obj) { void Theme::ApplyStyle(lv_obj_t* obj, std::string style_key) { if (auto search = style_map.find(style_key); search != style_map.end()) { for (const auto& pair : search->second) { + lv_obj_remove_style(obj, pair.second, pair.first); lv_obj_add_style(obj, pair.second, pair.first); } } -- cgit v1.2.3