1 #include "../../lv_examples.h"
2 #if LV_USE_OBSERVER && LV_USE_SLIDER && LV_USE_LABEL && LV_BUILD_EXAMPLES
3 
4 typedef enum {
5     THEME_MODE_LIGHT,
6     THEME_MODE_DARK,
7 } theme_mode_t;
8 
9 static lv_obj_t * my_panel_create(lv_obj_t * parent);
10 static lv_obj_t * my_button_create(lv_obj_t * parent, const char * text, lv_event_cb_t event_cb);
11 static void switch_theme_event_cb(lv_event_t * e);
12 
13 static lv_subject_t theme_subject;
14 
15 /**
16  * Change between light and dark mode
17  */
lv_example_observer_6(void)18 void lv_example_observer_6(void)
19 {
20     lv_subject_init_int(&theme_subject, THEME_MODE_DARK);
21 
22     lv_obj_t * panel1 = my_panel_create(lv_screen_active());
23     lv_obj_set_flex_flow(panel1, LV_FLEX_FLOW_COLUMN);
24     lv_obj_set_flex_align(panel1, LV_FLEX_ALIGN_START, LV_FLEX_ALIGN_CENTER, LV_FLEX_ALIGN_CENTER);
25     lv_obj_set_size(panel1, lv_pct(90), lv_pct(90));
26     lv_obj_center(panel1);
27 
28     my_button_create(panel1, "Button 1", switch_theme_event_cb);
29     my_button_create(panel1, "Button 2", switch_theme_event_cb);
30     my_button_create(panel1, "Button 3", switch_theme_event_cb);
31     my_button_create(panel1, "Button 4", switch_theme_event_cb);
32     my_button_create(panel1, "Button 5", switch_theme_event_cb);
33     my_button_create(panel1, "Button 6", switch_theme_event_cb);
34     my_button_create(panel1, "Button 7", switch_theme_event_cb);
35     my_button_create(panel1, "Button 8", switch_theme_event_cb);
36     my_button_create(panel1, "Button 9", switch_theme_event_cb);
37     my_button_create(panel1, "Button 10", switch_theme_event_cb);
38 }
39 
switch_theme_event_cb(lv_event_t * e)40 static void switch_theme_event_cb(lv_event_t * e)
41 {
42     LV_UNUSED(e);
43     if(lv_subject_get_int(&theme_subject) == THEME_MODE_LIGHT) lv_subject_set_int(&theme_subject, THEME_MODE_DARK);
44     else lv_subject_set_int(&theme_subject, THEME_MODE_LIGHT);
45 }
46 
47 /*-----------------------------------------
48  * my_panel.c
49  *
50  * It would be a separate file with its own
51  * local types, data, and functions
52  *------------------------------------------*/
53 
54 typedef struct {
55     lv_style_t style_main;
56     lv_style_t style_scrollbar;
57 } my_panel_styles_t;
58 
my_panel_style_observer_cb(lv_observer_t * observer,lv_subject_t * subject)59 static void my_panel_style_observer_cb(lv_observer_t * observer, lv_subject_t * subject)
60 {
61     LV_UNUSED(subject);
62     LV_UNUSED(observer);
63 
64     theme_mode_t m = lv_subject_get_int(&theme_subject);
65     my_panel_styles_t * styles = lv_observer_get_target(observer);
66     if(m == THEME_MODE_LIGHT) {
67         lv_style_set_bg_color(&styles->style_main, lv_color_hex3(0xfff));
68         lv_style_set_shadow_color(&styles->style_main, lv_color_hex3(0x888));
69         lv_style_set_text_color(&styles->style_main, lv_color_hex3(0x222));
70         lv_style_set_bg_color(&styles->style_scrollbar, lv_color_hex3(0x888));
71     }
72     if(m == THEME_MODE_DARK) {
73         lv_style_set_bg_color(&styles->style_main, lv_color_hex(0x040038));
74         lv_style_set_shadow_color(&styles->style_main, lv_color_hex3(0xaaa));
75         lv_style_set_text_color(&styles->style_main, lv_color_hex3(0xeee));
76         lv_style_set_bg_color(&styles->style_scrollbar, lv_color_hex3(0xaaa));
77     }
78 
79     lv_obj_report_style_change(&styles->style_main);
80     lv_obj_report_style_change(&styles->style_scrollbar);
81 }
82 
my_panel_create(lv_obj_t * parent)83 static lv_obj_t * my_panel_create(lv_obj_t * parent)
84 {
85     static bool inited = false;
86     static my_panel_styles_t styles;
87     if(!inited) {
88         inited = true;
89 
90         lv_style_init(&styles.style_main);
91         lv_style_set_radius(&styles.style_main, 12);
92         lv_style_set_bg_opa(&styles.style_main, LV_OPA_COVER);
93         lv_style_set_shadow_width(&styles.style_main, 24);
94         lv_style_set_shadow_offset_x(&styles.style_main, 4);
95         lv_style_set_shadow_offset_y(&styles.style_main, 6);
96         lv_style_set_pad_all(&styles.style_main, 12);
97         lv_style_set_pad_gap(&styles.style_main, 16);
98 
99         lv_style_init(&styles.style_scrollbar);
100         lv_style_set_width(&styles.style_scrollbar, 4);
101         lv_style_set_radius(&styles.style_scrollbar, 2);
102         lv_style_set_pad_right(&styles.style_scrollbar, 8);
103         lv_style_set_pad_ver(&styles.style_scrollbar, 8);
104         lv_style_set_bg_opa(&styles.style_scrollbar, LV_OPA_50);
105 
106         lv_subject_add_observer_with_target(&theme_subject, my_panel_style_observer_cb, &styles, NULL);
107     }
108 
109     lv_obj_t * panel = lv_obj_create(parent);
110     lv_obj_remove_style_all(panel);
111     lv_obj_add_style(panel, &styles.style_main, 0);
112     lv_obj_add_style(panel, &styles.style_scrollbar, LV_PART_SCROLLBAR);
113 
114     return panel;
115 }
116 
117 /*-----------------------------------------
118  * my_button.c
119  *
120  * It would be a separate file with its own
121  * local types, data, and functions
122  *------------------------------------------*/
123 
124 typedef struct {
125     lv_style_t style_main;
126     lv_style_t style_pressed;
127 } my_button_styles_t;
128 
my_button_style_observer_cb(lv_observer_t * observer,lv_subject_t * subject)129 static void my_button_style_observer_cb(lv_observer_t * observer, lv_subject_t * subject)
130 {
131     LV_UNUSED(subject);
132     LV_UNUSED(observer);
133 
134     theme_mode_t m = lv_subject_get_int(&theme_subject);
135     my_button_styles_t * styles = lv_observer_get_target(observer);
136     if(m == THEME_MODE_LIGHT) {
137         lv_style_set_bg_color(&styles->style_main, lv_color_hex(0x3379de));
138         lv_style_set_bg_grad_color(&styles->style_main, lv_color_hex(0xd249a5));
139         lv_style_set_shadow_color(&styles->style_main, lv_color_hex(0x3379de));
140         lv_style_set_text_color(&styles->style_main, lv_color_hex3(0xfff));
141 
142         lv_style_set_color_filter_opa(&styles->style_pressed, LV_OPA_70);
143     }
144     if(m == THEME_MODE_DARK) {
145         lv_style_set_bg_color(&styles->style_main, lv_color_hex(0xde1382));
146         lv_style_set_bg_grad_color(&styles->style_main, lv_color_hex(0x4b0c72));
147         lv_style_set_shadow_color(&styles->style_main, lv_color_hex(0x4b0c72));
148         lv_style_set_text_color(&styles->style_main, lv_color_hex3(0xfff));
149 
150         lv_style_set_color_filter_opa(&styles->style_pressed, LV_OPA_30);
151     }
152 
153     lv_obj_report_style_change(&styles->style_main);
154     lv_obj_report_style_change(&styles->style_pressed);
155 }
156 
my_button_create(lv_obj_t * parent,const char * text,lv_event_cb_t event_cb)157 static lv_obj_t * my_button_create(lv_obj_t * parent, const char * text, lv_event_cb_t event_cb)
158 {
159     static bool inited = false;
160     static my_button_styles_t styles;
161     if(!inited) {
162         inited = true;
163 
164         lv_style_init(&styles.style_main);
165         lv_style_set_radius(&styles.style_main, LV_RADIUS_CIRCLE);
166         lv_style_set_bg_opa(&styles.style_main, LV_OPA_COVER);
167         lv_style_set_bg_grad_dir(&styles.style_main, LV_GRAD_DIR_HOR);
168         lv_style_set_shadow_width(&styles.style_main, 24);
169         lv_style_set_shadow_offset_y(&styles.style_main, 6);
170         lv_style_set_pad_hor(&styles.style_main, 32);
171         lv_style_set_pad_ver(&styles.style_main, 12);
172 
173         lv_style_init(&styles.style_pressed);
174         lv_style_set_color_filter_dsc(&styles.style_pressed, &lv_color_filter_shade);
175         lv_subject_add_observer_with_target(&theme_subject, my_button_style_observer_cb, &styles, NULL);
176     }
177 
178     lv_obj_t * btn = lv_button_create(parent);
179     lv_obj_remove_style_all(btn);
180     lv_obj_add_style(btn, &styles.style_main, 0);
181     lv_obj_add_style(btn, &styles.style_pressed, LV_STATE_PRESSED);
182     lv_obj_add_event_cb(btn, event_cb, LV_EVENT_CLICKED, NULL);
183 
184     lv_obj_t * label = lv_label_create(btn);
185     lv_label_set_text(label, text);
186 
187     return btn;
188 }
189 
190 #endif
191