Embedded/lvgl
1
0
Fork 0
mirror of https://github.com/lvgl/lvgl.git synced 2025-01-28 07:03:00 +08:00
Code Issues Projects Releases Wiki Activity

lv_example: style_usage example added

Browse Source
This commit is contained in:
Gabor 2017-08-17 09:42:12 +02:00
parent d69c18dba4
commit e044e02541
1 changed files with 103 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

108
lv_examples/1_3_style_usage/style_usage.c
View File

@ -4,8 +4,25 @@
*/
/*
* You can modify the appearance of the graphical objects with styles.
* A style is simple 'lv_style_t' variable.
* Objects save the address of this variable so it has to be 'static or 'global'.
*
*/
* A style contains various attributes to describe rectangle, image or text like
* objects at same time. To know which attribute is used by an object see:
* http://www.gl.littlev.hu/object-types
*
* To set a new style for an object use: 'lv_obj_set_style(obj, &style);
* If NULL is set as style then the object will inherit the parents style.
* For example is you create a style for button the label appearance can be defined there as well.
*
* You can use built-in styles. 'lv_style_get(LV_STYLE_... , &copy)' will give you a pointer to built in style
* and copy it to variable (second parameter) if it is not NULL.
* By default the objects use the built-in styles.
* The built-in styles can be modified in run time to give a new default skin to your GUI.
*
* Learn more here: http://www.gl.littlev.hu/objects#style
* */
/*********************
* INCLUDES
@ -46,15 +63,96 @@
void style_usage_init(void)
{
/*3 buttons*/
/*copy default style and mod, create new style*/
/************************************
* BUTTON + LABEL WITH DEFAULT STYLE
************************************/
lv_obj_t * btn1;
btn1 = lv_btn_create(lv_scr_act(), NULL); /*Create a simple button*/
lv_obj_set_pos(btn1, 10, 10);
lv_obj_t * label = lv_label_create(btn1, NULL); /*Add a lebel tothe button*/
lv_label_set_text(label, "Default");
/************************
* BUTTON WITH NEW STYLE
************************/
/* Create a new style
* Don't forget a style can describe any object type
* like buttons and labels */
static lv_style_t style_btn2; /*Styles can't be local variables*/
lv_style_get(LV_STYLE_PRETTY_COLOR, &style_btn2); /*Copy a built-in style as a starting point*/
style_btn2.swidth = 10; /*10 px shadow*/
style_btn2.bwidth = 5; /*5 px border width*/
style_btn2.mcolor = COLOR_ORANGE; /*Orange main color*/
style_btn2.gcolor = COLOR_RED; /*Red gradient color*/
style_btn2.letter_space = 10; /*10 px letter space*/
style_btn2.txt_align = LV_TXT_ALIGN_MID; /*Text align: middle*/
/*Create a button and apply the new style*/
lv_obj_t * btn2;
btn2 = lv_btn_create(lv_scr_act(), NULL);
lv_obj_align(btn2, btn1, LV_ALIGN_OUT_RIGHT_MID, 20, 0);
lv_obj_set_style(btn2, &style_btn2);
/* Add a label to the button.
* Label by default inherits the parent's style */
label = lv_label_create(btn2, NULL);
lv_label_set_text(label, "New\nstyle");
/************************
* LABEL WITH NEW STYLE
************************/
/*Create new style for the label*/
static lv_style_t style_label;
lv_style_get(LV_STYLE_PRETTY_COLOR, &style_label); /*Use a built-in style*/
style_label.ccolor = color_mix(COLOR_BLUE, COLOR_WHITE, OPA_70);/*Light blue content color (text color) */
style_label.letter_space = 4; /*4 px letter space*/
style_label.txt_align = LV_TXT_ALIGN_MID; /*Text align: middle*/
/*Copy 'btn2'. It will use the same style as 'btn2'*/
lv_obj_t * btn3;
btn3 = lv_btn_create(lv_scr_act(), btn2);
lv_obj_align(btn3, btn2, LV_ALIGN_OUT_RIGHT_MID, 20, 0);
/*Create a label and apply the new style */
label = lv_label_create(btn3, NULL);
lv_label_set_text(label, "Label\nstyle");
lv_obj_set_style(label, &style_label);
/************************
* CREATE A STYLED LED
***********************/
/*3 labels font + symbol font*/
/*Create a style for the LED*/
static lv_style_t style_led;
lv_style_get(LV_STYLE_PRETTY_COLOR, &style_led);
style_led.swidth = 15;
style_led.radius = LV_RADIUS_CIRCLE;
style_led.bwidth = 5;
style_led.bopa = OPA_30;
style_led.mcolor = COLOR_MAKE(0xb5, 0x0f, 0x04);
style_led.gcolor = COLOR_MAKE(0x50, 0x07, 0x02);
style_led.bcolor = COLOR_MAKE(0xfa, 0x0f, 0x00);
style_led.scolor = COLOR_MAKE(0xb5, 0x0f, 0x04);
/*3 leds*/
/*Create a LED and switch it ON*/
lv_obj_t * led1 = lv_led_create(lv_scr_act(), NULL);
lv_obj_set_style(led1, &style_led);
lv_obj_align_us(led1, btn1, LV_ALIGN_OUT_BOTTOM_MID, 0, 40);
lv_led_on(led1);
/*Copy the previous LED and set a brightness*/
lv_obj_t * led2 = lv_led_create(lv_scr_act(), led1);
lv_obj_align_us(led2, btn2, LV_ALIGN_OUT_BOTTOM_MID, 0, 40);
lv_led_set_bright(led2, 190);
/*Copy the previous LED and switch it OFF*/
lv_obj_t * led3 = lv_led_create(lv_scr_act(), led1);
lv_obj_align_us(led3, btn3, LV_ALIGN_OUT_BOTTOM_MID, 0, 40);
lv_led_off(led3);
}
/**********************