App:Library:LVGL:docs:Overview:Style properties

https://docs.lvgl.io/8.2/overview/style.html

英文	自動翻訳

Styles

Styles are used to set the appearance of objects. Styles in lvgl are heavily inspired by CSS. The concept in a nutshell is as follows:

• A style is an lv_style_t variable which can hold properties like border width, text color and so on. It's similar to a class in CSS.
• Styles can be assigned to objects to change their appearance. Upon assignment, the target part (pseudo-element in CSS) and target state (pseudo class) can be specified. For example one can add style_blue to the knob of a slider when it's in pressed state.
• The same style can be used by any number of objects.
• Styles can be cascaded which means multiple styles may be assigned to an object and each style can have different properties. Therefore, not all properties have to be specified in a style. LVGL will search for a property until a style defines it or use a default if it's not specified by any of the styles. For example style_btn can result in a default gray button and style_btn_red can add only a background-color=red to overwrite the background color.
• The most recently added style has higher precedence. This means if a property is specified in two styles the newest style in the object will be used.
• Some properties (e.g. text color) can be inherited from a parent(s) if it's not specified in an object.
• Objects can also have local styles with higher precedence than "normal" styles.
• Unlike CSS (where pseudo-classes describe different states, e.g. :focus), in LVGL a property is assigned to a given state.
• Transitions can be applied when the object changes state.

States

The objects can be in the combination of the following states:

• LV_STATE_DEFAULT (0x0000) Normal, released state
• LV_STATE_CHECKED (0x0001) Toggled or checked state
• LV_STATE_FOCUSED (0x0002) Focused via keypad or encoder or clicked via touchpad/mouse
• LV_STATE_FOCUS_KEY (0x0004) Focused via keypad or encoder but not via touchpad/mouse
• LV_STATE_EDITED (0x0008) Edit by an encoder
• LV_STATE_HOVERED (0x0010) Hovered by mouse (not supported now)
• LV_STATE_PRESSED (0x0020) Being pressed
• LV_STATE_SCROLLED (0x0040) Being scrolled
• LV_STATE_DISABLED (0x0080) Disabled state
• LV_STATE_USER_1 (0x1000) Custom state
• LV_STATE_USER_2 (0x2000) Custom state
• LV_STATE_USER_3 (0x4000) Custom state
• LV_STATE_USER_4 (0x8000) Custom state

An object can be in a combination of states such as being focused and pressed at the same time. This is represented as LV_STATE_FOCUSED | LV_STATE_PRESSED.

A style can be added to any state or state combination. For example, setting a different background color for the default and pressed states. If a property is not defined in a state the best matching state's property will be used. Typically this means the property with LV_STATE_DEFAULT is used.˛ If the property is not set even for the default state the default value will be used. (See later)

But what does the "best matching state's property" really mean? States have a precedence which is shown by their value (see in the above list). A higher value means higher precedence. To determine which state's property to use let's take an example. Imagine the background color is defined like this:

• LV_STATE_DEFAULT: white
• LV_STATE_PRESSED: gray
• LV_STATE_FOCUSED: red

1. Initially the object is in the default state, so it's a simple case: the property is perfectly defined in the object's current state as white.
2. When the object is pressed there are 2 related properties: default with white (default is related to every state) and pressed with gray. The pressed state has 0x0020 precedence which is higher than the default state's 0x0000 precedence, so gray color will be used.
3. When the object is focused the same thing happens as in pressed state and red color will be used. (Focused state has higher precedence than default state).
4. When the object is focused and pressed both gray and red would work, but the pressed state has higher precedence than focused so gray color will be used.
5. It's possible to set e.g. rose color for LV_STATE_PRESSED | LV_STATE_FOCUSED. In this case, this combined state has 0x0020 + 0x0002 = 0x0022 precedence, which is higher than the pressed state's precedence so rose color would be used.
6. When the object is in the checked state there is no property to set the background color for this state. So for lack of a better option, the object remains white from the default state's property.

Some practical notes:

• The precedence (value) of states is quite intuitive, and it's something the user would expect naturally. E.g. if an object is focused the user will still want to see if it's pressed, therefore the pressed state has a higher precedence. If the focused state had a higher precedence it would overwrite the pressed color.
• If you want to set a property for all states (e.g. red background color) just set it for the default state. If the object can't find a property for its current state it will fall back to the default state's property.
• Use ORed states to describe the properties for complex cases. (E.g. pressed + checked + focused)
• It might be a good idea to use different style elements for different states. For example, finding background colors for released, pressed, checked + pressed, focused, focused + pressed, focused + pressed + checked, etc. states is quite difficult. Instead, for example, use the background color for pressed and checked states and indicate the focused state with a different border color.

Cascading styles

It's not required to set all the properties in one style. It's possible to add more styles to an object and have the latter added style modify or extend appearance. For example, create a general gray button style and create a new one for red buttons where only the new background color is set.

This is much like in CSS when used classes are listed like <div class=".btn .btn-red">.

Styles added later have precedence over ones set earlier. So in the gray/red button example above, the normal button style should be added first and the red style second. However, the precedence of the states are still taken into account. So let's examine the following case:

• the basic button style defines dark-gray color for the default state and light-gray color for the pressed state
• the red button style defines the background color as red only in the default state

In this case, when the button is released (it's in default state) it will be red because a perfect match is found in the most recently added style (red). When the button is pressed the light-gray color is a better match because it describes the current state perfectly, so the button will be light-gray.

Inheritance

Some properties (typically those related to text) can be inherited from the parent object's styles. Inheritance is applied only if the given property is not set in the object's styles (even in default state). In this case, if the property is inheritable, the property's value will be searched in the parents until an object specifies a value for the property. The parents will use their own state to determine the value. So if a button is pressed, and the text color comes from here, the pressed text color will be used.

Parts

Objects can be composed of parts which may each have their own styles.

The following predefined parts exist in LVGL:

• LV_PART_MAIN A background like rectangle
• LV_PART_SCROLLBAR The scrollbar(s)
• LV_PART_INDICATOR Indicator, e.g. for slider, bar, switch, or the tick box of the checkbox
• LV_PART_KNOB Like a handle to grab to adjust a value
• LV_PART_SELECTED Indicate the currently selected option or section
• LV_PART_ITEMS Used if the widget has multiple similar elements (e.g. table cells)
• LV_PART_TICKS Ticks on scales e.g. for a chart or meter
• LV_PART_CURSOR Mark a specific place e.g. text area's or chart's cursor
• LV_PART_CUSTOM_FIRST Custom part identifiers can be added starting from here.

For example a Slider has three parts:

• Background
• Indicator
• Knob

This means all three parts of the slider can have their own styles. See later how to add styles to objects and parts.

Initialize styles and set/get properties

Styles are stored in lv_style_t variables. Style variables should be static, global or dynamically allocated. In other words they cannot be local variables in functions which are destroyed when the function exits. Before using a style it should be initialized with lv_style_init(&my_style). After initializing a style, properties can be added or changed.

Property set functions looks like this: lv_style_set_<property_name>(&style, <value>); For example:

static lv_style_t style_btn;
lv_style_init(&style_btn);
lv_style_set_bg_color(&style_btn, lv_color_hex(0x115588));
lv_style_set_bg_opa(&style_btn, LV_OPA_50);
lv_style_set_border_width(&style_btn, 2);
lv_style_set_border_color(&style_btn, lv_color_black());

static lv_style_t style_btn_red;
lv_style_init(&style_btn_red);
lv_style_set_bg_color(&style_btn_red, lv_plaette_main(LV_PALETTE_RED));
lv_style_set_bg_opa(&style_btn_red, LV_OPA_COVER);

To remove a property use:

lv_style_remove_prop(&style, LV_STYLE_BG_COLOR);

To get a property's value from a style:

lv_style_value_t v;
lv_res_t res = lv_style_get_prop(&style, LV_STYLE_BG_COLOR, &v);
if(res == LV_RES_OK) {	/*Found*/
	do_something(v.color);
}

lv_style_value_t has 3 fields:

• num for integer, boolean and opacity properties
• color for color properties
• ptr for pointer properties

To reset a style (free all its data) use:

lv_style_reset(&style);

Styles can be built as const too to save RAM:

const lv_style_const_prop_t style1_props[] = {
   LV_STYLE_CONST_WIDTH(50),
   LV_STYLE_CONST_HEIGHT(50),
   LV_STYLE_PROP_INV,
};
     
LV_STYLE_CONST_INIT(style1, style1_props);

Later const style can be used like any other style but (obviously) new properties can not be added.

Add and remove styles to a widget

A style on its own is not that useful. It must be assigned to an object to take effect.

Add styles

To add a style to an object use lv_obj_add_style(obj, &style, <selector>). <selector> is an OR-ed value of parts and state to which the style should be added. Some examples:

• LV_PART_MAIN | LV_STATE_DEFAULT
• LV_STATE_PRESSED: The main part in pressed state. LV_PART_MAIN can be omitted
• LV_PART_SCROLLBAR: The scrollbar part in the default state. LV_STATE_DEFAULT can be omitted.
• LV_PART_SCROLLBAR | LV_STATE_SCROLLED: The scrollbar part when the object is being scrolled
• 0 Same as LV_PART_MAIN | LV_STATE_DEFAULT.
• LV_PART_INDICATOR | LV_STATE_PRESSED | LV_STATE_CHECKED The indicator part when the object is pressed and checked at the same time.

Using lv_obj_add_style:

lv_obj_add_style(btn, &style_btn, 0);      				  /*Default button style*/
lv_obj_add_style(btn, &btn_red, LV_STATE_PRESSED);  /*Overwrite only some colors to red when pressed*/

Remove styles

To remove all styles from an object use lv_obj_remove_style_all(obj).

To remove specific styles use lv_obj_remove_style(obj, style, selector). This function will remove style only if the selector matches with the selector used in lv_obj_add_style. style can be NULL to check only the selector and remove all matching styles. The selector can use the LV_STATE_ANY and LV_PART_ANY values to remove the style from any state or part.

Report style changes

If a style which is already assigned to an object changes (i.e. a property is added or changed), the objects using that style should be notified. There are 3 options to do this:

1. If you know that the changed properties can be applied by a simple redraw (e.g. color or opacity changes) just call lv_obj_invalidate(obj) or lv_obj_invalidate(lv_scr_act()).
2. If more complex style properties were changed or added, and you know which object(s) are affected by that style call lv_obj_refresh_style(obj, part, property). To refresh all parts and properties use lv_obj_refresh_style(obj, LV_PART_ANY, LV_STYLE_PROP_ANY).
3. To make LVGL check all objects to see if they use a style and refresh them when needed, call lv_obj_report_style_change(&style). If style is NULL all objects will be notified about a style change.

Get a property's value on an object

To get a final value of property - considering cascading, inheritance, local styles and transitions (see below) - property get functions like this can be used: lv_obj_get_style_<property_name>(obj, <part>). These functions use the object's current state and if no better candidate exists they return a default value.   For example:

lv_color_t color = lv_obj_get_style_bg_color(btn, LV_PART_MAIN);

Local styles

In addition to "normal" styles, objects can also store local styles. This concept is similar to inline styles in CSS (e.g. <div style="color:red">) with some modification.

Local styles are like normal styles, but they can't be shared among other objects. If used, local styles are allocated automatically, and freed when the object is deleted. They are useful to add local customization to an object.

Unlike in CSS, LVGL local styles can be assigned to states (pseudo-classes) and parts (pseudo-elements).

To set a local property use functions like lv_obj_set_style_<property_name>(obj, <value>, <selector>);   For example:

lv_obj_set_style_bg_color(slider, lv_color_red(), LV_PART_INDICATOR | LV_STATE_FOCUSED);

Properties

For the full list of style properties click here.

Typical background properties

In the documentation of the widgets you will see sentences like "The widget uses the typical background properties". These "typical background properties" are the ones related to:

• Background
• Border
• Outline
• Shadow
• Padding
• Width and height transformation
• X and Y translation

Transitions

By default, when an object changes state (e.g. it's pressed) the new properties from the new state are set immediately. However, with transitions it's possible to play an animation on state change. For example, on pressing a button its background color can be animated to the pressed color over 300 ms.

The parameters of the transitions are stored in the styles. It's possible to set

• the time of the transition
• the delay before starting the transition
• the animation path (also known as the timing or easing function)
• the properties to animate

The transition properties can be defined for each state. For example, setting a 500 ms transition time in the default state means that when the object goes to the default state a 500 ms transition time is applied. Setting a 100 ms transition time in the pressed state causes a 100 ms transition when going to the pressed state. This example configuration results in going to the pressed state quickly and then going back to default slowly.

To describe a transition an lv_transition_dsc_t variable needs to be initialized and added to a style:

/*Only its pointer is saved so must static, global or dynamically allocated */
static const lv_style_prop_t trans_props[] = {
											LV_STYLE_BG_OPA, LV_STYLE_BG_COLOR,
											0, /*End marker*/
};

static lv_style_transition_dsc_t trans1;
lv_style_transition_dsc_init(&trans1, trans_props, lv_anim_path_ease_out, duration_ms, delay_ms);

lv_style_set_transition(&style1, &trans1);

Color filter

TODO

Themes

Themes are a collection of styles. If there is an active theme LVGL applies it on every created widget. This will give a default appearance to the UI which can then be modified by adding further styles.

Every display can have a different theme. For example, you could have a colorful theme on a TFT and monochrome theme on a secondary monochrome display.

To set a theme for a display, two steps are required:

1. Initialize a theme
2. Assign the initialized theme to a display.

Theme initialization functions can have different prototypes. This example shows how to set the "default" theme:

lv_theme_t * th = lv_theme_default_init(display,  /*Use the DPI, size, etc from this display*/ 
                                        LV_COLOR_PALETTE_BLUE, LV_COLOR_PALETTE_CYAN,   /*Primary and secondary palette*/
                                        false,    /*Light or dark mode*/ 
                                        &lv_font_montserrat_10, &lv_font_montserrat_14, &lv_font_montserrat_18); /*Small, normal, large fonts*/
                                        
lv_disp_set_theme(display, th); /*Assign the theme to the display*/

The included themes are enabled in lv_conf.h. If the default theme is enabled by LV_USE_THEME_DEFAULT 1 LVGL automatically initializes and sets it when a display is created.

Extending themes

Built-in themes can be extended. If a custom theme is created, a parent theme can be selected. The parent theme's styles will be added before the custom theme's styles. Any number of themes can be chained this way. E.g. default theme -> custom theme -> dark theme.

lv_theme_set_parent(new_theme, base_theme) extends the base_theme with the new_theme.

There is an example for it below.

Examples

---

Background styles

---

Border styles

---

Outline styles

---

Shadow styles

---

Image styles

---

Arc styles

---

Text styles

---

Line styles

---

Transition

---

Using multiple styles

---

Local styles

---

Add styles to parts and states

---

Extending the current theme

---

API

Typedefs

typedef uint8_t lv_blend_mode_t[1]

typedef uint8_t lv_te[2]xt_decor_t[3]

typedef uint8_t lv_bo[4]rder_side_t[5]

typedef uint8_t lv_gra[6]d_dir_t[7]

typedef uint8_t lv_[8]dither_mode_t[9]

Enums

enum [anonymous[10]][11]

Possible opt[12]ions how to blend opaque drawings Values:

enumerator LV_BLEND_MODE_NORMAL[13]

Simply mix according to the[14] opacity value

enumerator LV_BLEND_MODE_ADDITIVE[15]

Add the respective color chan[16]nels

enumerator LV_BLEND_MODE_SUBTRACTIVE[17]

Subtract the foreground from the[18] background

enumerator LV_BLEND_MODE_MULTIPLY[19]

Multiply the foreground and b[20]ackground

enumerator LV_BLEND_MODE_REPLACE[21]

Replace background with fore[22]ground in the area

enum [anonymous][23]

Some options[24] to apply decorations on texts. 'OR'ed values can be used. Values:

enumerator LV_TEXT_DECOR_NONE[25]

enumerator LV_TEXT_[26]DECOR_UNDERLINE[27]

enumerator LV_TEXT_DECOR[28]_STRIKETHROUGH[29]

enum [anonymous][30]

Sele[31]cts on w[32]hich sides border should be drawn 'OR'ed values can be used. Values:

enumerator LV_BORDER_SIDE_NONE[33]

enumerator LV_BORDER[34]_SIDE_BOTTOM[35]

enumerator LV_BORDER_S[36]IDE_TOP[37]

enumerator LV_BORDE[38]R_SIDE_LEFT[39]

enumerator LV_BORDER[40]_SIDE_RIGHT[41]

enumerator LV_BORDER_[42]SIDE_FULL[43]

enumerator LV_BORDER[44]_SIDE_INTERNAL[45]

FOR matrix-like objects (e.g. [46]Button matrix)

enum [anonymous][47]

The directio[48]n of the gradient. Values:

enumerator LV_GRAD_DIR_NONE[49]

No gradient (the grad_c[50]olor property is ignored)

enumerator LV_GRAD_DIR_VER[51]

Vertical (top to botto[52]m) gradient

enumerator LV_GRAD_DIR_HOR[53]

Horizontal (left to ri[54]ght) gradient

enum [anonymous][55]

The ditherin[56]g algorithm for the gradient Depends on LV_DITHER_GRADIENT Values:

enumerator LV_DITHER_NONE[57]

No dithering, colors [58]are just quantized to the output resolution

enumerator LV_DITHER_ORDERED[59]

Ordered dithering. Faste[60]r to compute and use less memory but lower quality

enumerator LV_DITHER_ERR_DIFF[61]

Error diffusion mode. Slo[62]wer to compute and use more memory but give highest dither quality

enum lv_style_prop_t[63]

Enumeration of a[64]ll built in style properties

Values:

enumerator LV_STYLE_PROP_INV[65]

enumerator LV_STYL[66]E_WIDTH[67]

enumerator LV_S[68]TYLE_MIN_WIDTH[69]

enumerator LV_STYLE[70]_MAX_WIDTH[71]

enumerator LV_STYLE[72]_HEIGHT[73]

enumerator LV_ST[74]YLE_MIN_HEIGHT[75]

enumerator LV_STYLE_[76]MAX_HEIGHT[77]

enumerator LV_STYLE_[78]X[79]

enumerator [80]LV_STYLE_Y[81]

enumerator [82]LV_STYLE_ALIGN[83]

enumerator LV_S[84]TYLE_TRANSFORM_WIDTH[85]

enumerator LV_STYLE_TRANS[86]FORM_HEIGHT[87]

enumerator LV_STYLE_TRANSL[88]ATE_X[89]

enumerator LV_STYLE_T[90]RANSLATE_Y[91]

enumerator LV_STYLE_T[92]RANSFORM_ZOOM[93]

enumerator LV_STYLE_TRAN[94]SFORM_ANGLE[95]

enumerator LV_STYLE_PAD_T[96]OP[97]

enumerator LV_STY[98]LE_PAD_BOTTOM[99]

enumerator LV_STYLE_[100]PAD_LEFT[101]

enumerator LV_STYL[102]E_PAD_RIGHT[103]

enumerator LV_STYLE[104]_PAD_ROW[105]

enumerator LV_STY[106]LE_PAD_COLUMN[107]

enumerator LV_STYLE_[108]BG_COLOR[109]

enumerator LV_STYL[110]E_BG_COLOR_FILTERED[111]

enumerator LV_STYLE_BG_OPA[112][113]

enumerator LV_ST[114]YLE_BG_GRAD_COLOR[115]

enumerator LV_STYLE_BG_[116]GRAD_COLOR_FILTERED[117]

enumerator LV_STYLE_BG_GRAD_DIR[118][119]

enumerator LV_STYLE_B[120]G_MAIN_STOP[121]

enumerator LV_STYLE_BG[122]_GRAD_STOP[123]

enumerator LV_STYLE_BG[124]_GRAD[125]

enumerator LV_STY[126]LE_BG_DITHER_MODE[127]

enumerator LV_STYLE_BG_I[128]MG_SRC[129]

enumerator LV_STYLE_[130]BG_IMG_OPA[131]

enumerator LV_STYLE_[132]BG_IMG_RECOLOR[133]

enumerator LV_STYLE_BG_I[134]MG_RECOLOR_FILTERED[135]

enumerator LV_STYLE_BG_IMG_RECOLO[136]R_OPA[137]

enumerator LV_STYLE_BG_IMG_T[138]ILED[139]

enumerator LV_STYLE_BO[140]RDER_COLOR[141]

enumerator LV_STYLE_BO[142]RDER_COLOR_FILTERED[143]

enumerator LV_STYLE_BORDER_OPA[144][145]

enumerator LV_STYLE_[146]BORDER_WIDTH[147]

enumerator LV_STYLE_BO[148]RDER_SIDE[149]

enumerator LV_STYLE_B[150]ORDER_POST[151]

enumerator LV_STYLE_O[152]UTLINE_WIDTH[153]

enumerator LV_STYLE_OUT[154]LINE_COLOR[155]

enumerator LV_STYLE_OUT[156]LINE_COLOR_FILTERED[157]

enumerator LV_STYLE_OUTLINE_OPA[158][159]

enumerator LV_STYLE_O[160]UTLINE_PAD[161]

enumerator LV_STYLE_S[162]HADOW_WIDTH[163]

enumerator LV_STYLE_SH[164]ADOW_OFS_X[165]

enumerator LV_STYLE_SH[166]ADOW_OFS_Y[167]

enumerator LV_STYLE_SH[168]ADOW_SPREAD[169]

enumerator LV_STYLE_SHA[170]DOW_COLOR[171]

enumerator LV_STYLE_SH[172]ADOW_COLOR_FILTERED[173]

enumerator LV_STYLE_SHADOW_OPA[174][175]

enumerator LV_STYLE_[176]IMG_OPA[177]

enumerator LV_STY[178]LE_IMG_RECOLOR[179]

enumerator LV_STYLE_I[180]MG_RECOLOR_FILTERED[181]

enumerator LV_STYLE_IMG_RECOLO[182]R_OPA[183]

enumerator LV_STYLE_LINE_[184]WIDTH[185]

enumerator LV_STYLE_[186]LINE_DASH_WIDTH[187]

enumerator LV_STYLE_LINE_[188]DASH_GAP[189]

enumerator LV_STYLE_LIN[190]E_ROUNDED[191]

enumerator LV_STYLE_LI[192]NE_COLOR[193]

enumerator LV_STYLE_[194]LINE_COLOR_FILTERED[195]

enumerator LV_STYLE_LINE_OPA[196][197]

enumerator LV_STYL[198]E_ARC_WIDTH[199]

enumerator LV_STYLE[200]_ARC_ROUNDED[201]

enumerator LV_STYLE_A[202]RC_COLOR[203]

enumerator LV_STYLE[204]_ARC_COLOR_FILTERED[205]

enumerator LV_STYLE_ARC_OPA[206][207]

enumerator LV_STY[208]LE_ARC_IMG_SRC[209]

enumerator LV_STYLE_T[210]EXT_COLOR[211]

enumerator LV_STYLE_[212]TEXT_COLOR_FILTERED[213]

enumerator LV_STYLE_TEXT_OPA[214][215]

enumerator LV_STYL[216]E_TEXT_FONT[217]

enumerator LV_STYLE[218]_TEXT_LETTER_SPACE[219]

enumerator LV_STYLE_TEXT_LI[220]NE_SPACE[221]

enumerator LV_STYLE_TEXT_[222]DECOR[223]

enumerator LV_STYLE_[224]TEXT_ALIGN[225]

enumerator LV_STYLE_[226]RADIUS[227]

enumerator LV_ST[228]YLE_CLIP_CORNER[229]

enumerator LV_STYLE_O[230]PA[231]

enumerator LV[232]_STYLE_COLOR_FILTER_DSC[233]

enumerator LV_STYLE_COLOR_[234]FILTER_OPA[235]

enumerator LV_STYLE_ANIM_T[236]IME[237]

enumerator LV_STYLE[238]_ANIM_SPEED[239]

enumerator LV_STYLE_[240]TRANSITION[241]

enumerator LV_STYLE_[242]BLEND_MODE[243]

enumerator LV_STYLE_[244]LAYOUT[245]

enumerator LV_ST[246]YLE_BASE_DIR[247]

enumerator _LV_STY[248]LE_LAST_BUILT_IN_PROP[249]

enumerator LV_STYLE_PROP_ANY[250]

Functions

LV_EXPORT_CONST_INT(LV_IMG_ZOOM_NONE)[251]

void lv_style_init(lv_style[252]_t *style)[253]

Initialize a style Note Do not [254]call lv_style_init on styles that already have some properties because this function won't free the used memory, just sets a default state for the style. In other words be sure to initialize styles only once!

Parameters

style -- pointer to a style to initialize

void lv_style_reset(lv_style_t *style)[255]

Clear all properties from a style [256]and free all allocated memories.

Parameters

style -- pointer to a style

lv_style_prop_t lv_style_register_prop(void)[257]

bool lv_style_remove_prop(lv_style[258]_t *style, lv_style_prop_t prop)[259]

Remove a property from a style

Parameters

• style -- poi[260]nter to a style
• prop -- a style property ORed with a state.

Returns

true: the property was found and removed; false: the property wasn't found

void lv_style_set_prop(lv_style_t *style, lv_style_prop_t prop, lv_style_value_t value)[261]

Set the value of property in a style. This function shouldn't be used directly by t[262]he user. Instead use lv_style_set_<prop_name>(). E.g. lv_style_set_bg_color()

Parameters

• style -- pointer to style
• prop -- the ID of a property (e.g. LV_STYLE_BG_COLOR)
• value -- lv_style_value_t variable in which a field is set according to the type of prop

lv_res_t lv_style_get_prop(const lv_style_t *style, lv_style_prop_t prop, lv_style_value_t *value)[263]

Get the value of a property Note For performance reasons there are no sanity check on style [264]

Parameters

• style -- pointer to a style
• prop -- the ID of a property
• value -- pointer to a lv_style_value_t variable to store the value

Returns

LV_RES_INV: the property wasn't found in the style (value is unchanged) LV_RES_OK: the property was fond, and value is set accordingly

static inline lv_res_t lv_style_get_prop_inlined(const lv_style_t *style, lv_style_prop_t prop, lv_style_value_t *value)[265]

Get the value of a property Note For performance reasons there are no sanity check on style Note This function i[266]s the same as lv_style_get_prop but inlined. Use it only on performance critical places

Parameters

• style -- pointer to a style
• prop -- the ID of a property
• value -- pointer to a lv_style_value_t variable to store the value

Returns

LV_RES_INV: the property wasn't found in the style (value is unchanged) LV_RES_OK: the property was fond, and value is set accordingly

void lv_style_transition_dsc_init(lv_style_transition_dsc_t *tr, const lv_style_prop_t props[], lv_anim_path_cb_t path_cb, uint32_t time, uint32_t delay, void *user_data)[267]

lv_style_value_t lv_style_prop_get_default(lv_style_prop_t prop)[268]

Get the default value of a property

Parameters

prop --[269] the ID of a property

Retur[270]ns

the default value

bool lv_style_is_empty(const lv_style_t *style)[271]

Checks if a style is empty (has no properti[272]es)

Parameters

style -- pointer to a style

Returns

true if the style is empty

uint8_t _lv_style_get_prop_group(lv_style_prop_t prop)[273]

Tell the group of a property. If the a property fr[274]om a group is set in a style the (1 << group) bit of style->has_group is set. It allows early skipping the style if the property is not exists in the style at all.

Parameters

prop -- a style property

Returns

the group [0..7] 7 means all the custom properties with index > 112

static inline void lv_style_set_size(lv_style_t *style, lv_coord_t value)[275]

static inline void lv_style_set_pad_all(lv_style_t *style, lv_c[276]oord_t value)[277]

static inline void lv_style_set_pad_hor(lv_style_t *style, lv_coor[278]d_t value)[279]

static inline void lv_style_set_pad_ver(lv_style_t *style, lv_coor[280]d_t value)[281]

static inline void lv_style_set_pad_gap(lv_style_t *style, lv_coor[282]d_t value)[283]

struct lv_gradient_stop_t[284]

#include <lv_style.h>[285] A gradient s[286]top definition. This matches a color and a position in a virtual 0-255 scale. Public Members

lv_color_t color[287]

The stop col[288]or

uint8_t frac[289]

The stop[290] position in 1/255 unit

struct lv_grad_dsc_t[291]

#include <lv_sty[292]le.h> A descriptor of a gradient. Public Members

lv_gradient_stop_t stops[LV_GRADIENT_MAX_STOPS][293]

A gradient stop array

uint8_t stops_co[294]unt[295]

The number of u[296]sed stops in the array

lv_grad_dir_t dir[297]

The gradient [298]direction. Any of LV_GRAD_DIR_HOR, LV_GRAD_DIR_VER, LV_GRAD_DIR_NONE

lv_dither_mode_t dither[299]

Whether to dither t[300]he gradient or not. Any of LV_DITHER_NONE, LV_DITHER_ORDERED, LV_DITHER_ERR_DIFF

union lv_style_value_t[301]

#include <lv_style[302].h> A common type to handle all the property types in the same way. Public Members

int32_t num[303]

Number [304]integer number (opacity, enums, booleans or "normal" numbers)

const void *ptr[305]

Constant po[306]inters (font, cone text, etc)

lv_color_t color[307]

Colors

[308]

struct lv_style_transition_dsc_t[309]

#include <lv_style.h> Descr[310]iptor for style transitions Public Members

const lv_style_prop_t *props[311]

An array with the proper[312]ties to animate.

void *user_data[313]

A custom us[314]er data that will be passed to the animation's user_data

lv_anim_path_cb_t path_xcb[315]

A path for the animati[316]on.

uint32_t time[317]

Duration [318]of the transition in [ms]

uint32_t delay[319]

Delay befo[320]re the transition in [ms]

struct lv_style_const_prop_t[321]

#include <lv_style.h> D[322]escriptor of a constant style property. Public Members

lv_style_prop_t prop[323]

lv_style_v[324]alue_t value[325]

struct lv_[326]style_t[327]

#include <lv_[328]style.h> Descriptor of a style (a collection of properties and values). Public Members

uint32_t sentinel[329]

lv_styl[330]e_value_t value1[331]

uint8_t *valu[332]es_and_props[333]

const lv_style_[334]const_prop_t *const_props[335]

union lv_style_t::[anonymous] [336]v_p[337]

uint16_t prop1[338]

[339]

uint[340]16_t is_const[341]

uint8_t[342] has_group[343]

uint8_t[344] prop_cnt

Typedefs

typedef void (*lv_theme_apply_cb_t)(struct _lv_theme_t*, lv_obj_t*)[345]

typedef struct _lv_theme_t lv_theme_t[346]

Functions

[347]

lv_theme_t *lv_t[348]heme_get_from_obj(lv_obj_t *obj)[349]

Get the theme assigned to the display of the[350] object

Parameters

obj -- pointer to a theme object

Returns

the theme of the object's display (can be NULL)

void lv_theme_apply(lv_obj_t *obj)[351]

Apply the active theme on an o[352]bject

Parameters

obj -- pointer to an object

void lv_theme_set_parent(lv_theme_t *new_theme, lv_theme_t *parent)[353]

Set a base theme for a theme. The styles from the base them wil[354]l be added before the styles of the current theme. Arbitrary long chain of themes can be created by setting base themes.

Parameters

• new_theme -- pointer to theme which base should be set
• parent -- pointer to the base theme

void lv_theme_set_apply_cb(lv_theme_t *theme, lv_theme_apply_cb_t apply_cb)[355]

Set an apply callback for a theme. The apply callback is used to add st[356]yles to different objects

Parameters

• theme -- pointer to theme which callback should be set
• apply_cb -- pointer to the callback

const lv_font_t *lv_theme_get_font_small(lv_obj_t *obj)[357]

Get the small font of the theme

Parameters

ob[358]j -- pointer to an object

Returns

pointer to the font

const lv_font_t *lv_theme_get_font_normal(lv_obj_t *obj)[359]

Get the normal font of the theme

Parameters

ob[360]j -- pointer to an object

Returns

pointer to the font

const lv_font_t *lv_theme_get_font_large(lv_obj_t *obj)[361]

Get the subtitle font of the theme

Parameters

[362] obj -- pointer to an object

Returns

pointer to the font

lv_color_t lv_theme_get_color_primary(lv_obj_t *obj)[363]

Get the primary color of the theme

Parameters[364]

obj -- pointer to an object

Returns

the color

lv_color_t lv_theme_get_color_secondary(lv_obj_t *obj)[365]

Get the secondary color of the theme

Parameters[366]

obj -- pointer to an object

Returns

the color

struct _lv_theme_t[367]

Public Members[368]

lv_theme_apply_cb_t apply_cb[369]

struct _lv_theme_t[370] *parent[371]

Apply the current them[372]e's style on top of this theme.

void *user_data[373]

struc[374]t _lv_disp_t *disp[375]

lv_color_t co[376]lor_primary[377]

lv_color_t col[378]or_secondary[379]

const lv_font_t [380]*font_small[381]

const lv_font_t *[382]font_normal[383]

const lv_font_t *f[384]ont_large[385]

uint32_t flags [386]

戻る : Previous