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 aclass
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 andstyle_btn_red
can add only abackground-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 stateLV_STATE_CHECKED
(0x0001) Toggled or checked stateLV_STATE_FOCUSED
(0x0002) Focused via keypad or encoder or clicked via touchpad/mouseLV_STATE_FOCUS_KEY
(0x0004) Focused via keypad or encoder but not via touchpad/mouseLV_STATE_EDITED
(0x0008) Edit by an encoderLV_STATE_HOVERED
(0x0010) Hovered by mouse (not supported now)LV_STATE_PRESSED
(0x0020) Being pressedLV_STATE_SCROLLED
(0x0040) Being scrolledLV_STATE_DISABLED
(0x0080) Disabled stateLV_STATE_USER_1
(0x1000) Custom stateLV_STATE_USER_2
(0x2000) Custom stateLV_STATE_USER_3
(0x4000) Custom stateLV_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
: whiteLV_STATE_PRESSED
: grayLV_STATE_FOCUSED
: red
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.
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.
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).
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.
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.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.
Forced value inheritance/default value¶
Sometimes you may want to force a child object to use the parent's value for a given style property. To do this you can use one of the following (depending on what type of style you're using):
/* regular style */
lv_style_set_prop_meta(&style, LV_STYLE_TEXT_COLOR, LV_STYLE_PROP_META_INHERIT);
/* local style */
lv_obj_set_local_style_prop_meta(child, LV_STYLE_TEXT_COLOR, LV_STYLE_PROP_META_INHERIT, LV_PART_MAIN);
This acts like a value has been set on the style, so setting the value of the property afterwards will remove the flag.
You may also want to force the default value of a property to be used, without needing to hardcode it in your application.
To do this you can use the same API but with LV_STYLE_PROP_META_INITIAL
instead. In future versions of LVGL, this
will use the value based upon the current theme, but for now it just selects the internal default regardless of theme.
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 rectangleLV_PART_SCROLLBAR
The scrollbar(s)LV_PART_INDICATOR
Indicator, e.g. for slider, bar, switch, or the tick box of the checkboxLV_PART_KNOB
Like a handle to grab to adjust a valueLV_PART_SELECTED
Indicate the currently selected option or sectionLV_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 meterLV_PART_CURSOR
Mark a specific place e.g. text area's or chart's cursorLV_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 propertiescolor
for color propertiesptr
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 omittedLV_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 scrolled0
Same asLV_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:
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)
orlv_obj_invalidate(lv_scr_act())
.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 uselv_obj_refresh_style(obj, LV_PART_ANY, LV_STYLE_PROP_ANY)
.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)
. Ifstyle
isNULL
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);
Opacity, Blend modes and Transformations¶
If the opa
, blend_mode
, transform_angle
, or transform_zoom
properties are set to their non-default value LVGL creates a snapshot about the widget and all its children in order to blend the whole widget with the set opacity, blend mode and transformation properties.
These properties have this effect only on the MAIN
part of the widget.
The created snapshot is called "intermediate layer" or simply "layer". If only opa
and/or blend_mode
is set to a non-default value LVGL can build the layer from smaller chunks. The size of these chunks can be configured by the following properties in lv_conf.h
:
LV_LAYER_SIMPLE_BUF_SIZE
: [bytes] the optimal target buffer size. LVGL will try to allocate this size of memory.LV_LAYER_SIMPLE_FALLBACK_BUF_SIZE
: [bytes] used ifLV_LAYER_SIMPLE_BUF_SIZE
couldn't be allocated.
If transformation properties were also used the layer can not be rendered in chunks, but one larger memory needs to be allocated. The required memory depends on the angle, zoom and pivot parameters, and the size of the area to redraw, but it's never larger than the size of the widget (including the extra draw size used for shadow, outline, etc).
If the widget can fully cover the area to redraw, LVGL creates an RGB layer (which is faster to render and uses less memory). If the opposite case ARGB rendering needs to be used. A widget might not cover its area if it has radius, bg_opa != 255
, has shadow, outline, etc.
The click area of the widget is also transformed accordingly.
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:
Initialize a theme
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¶
Size styles¶
C code
GitHub#include "../lv_examples.h"
#if LV_BUILD_EXAMPLES && LV_USE_IMG
/**
* Using the Size, Position and Padding style properties
*/
void lv_example_style_1(void)
{
static lv_style_t style;
lv_style_init(&style);
lv_style_set_radius(&style, 5);
/*Make a gradient*/
lv_style_set_width(&style, 150);
lv_style_set_height(&style, LV_SIZE_CONTENT);
lv_style_set_pad_ver(&style, 20);
lv_style_set_pad_left(&style, 5);
lv_style_set_x(&style, lv_pct(50));
lv_style_set_y(&style, 80);
/*Create an object with the new style*/
lv_obj_t * obj = lv_obj_create(lv_scr_act());
lv_obj_add_style(obj, &style, 0);
lv_obj_t * label = lv_label_create(obj);
lv_label_set_text(label, "Hello");
}
#endif
#
# Using the Size, Position and Padding style properties
#
style = lv.style_t()
style.init()
style.set_radius(5)
# Make a gradient
style.set_width(150)
style.set_height(lv.SIZE.CONTENT)
style.set_pad_ver(20)
style.set_pad_left(5)
style.set_x(lv.pct(50))
style.set_y(80)
# Create an object with the new style
obj = lv.obj(lv.scr_act())
obj.add_style(style, 0)
label = lv.label(obj)
label.set_text("Hello")
Background styles¶
C code
GitHub#include "../lv_examples.h"
#if LV_BUILD_EXAMPLES
/**
* Using the background style properties
*/
void lv_example_style_2(void)
{
static lv_style_t style;
lv_style_init(&style);
lv_style_set_radius(&style, 5);
/*Make a gradient*/
lv_style_set_bg_opa(&style, LV_OPA_COVER);
static lv_grad_dsc_t grad;
grad.dir = LV_GRAD_DIR_VER;
grad.stops_count = 2;
grad.stops[0].color = lv_palette_lighten(LV_PALETTE_GREY, 1);
grad.stops[1].color = lv_palette_main(LV_PALETTE_BLUE);
/*Shift the gradient to the bottom*/
grad.stops[0].frac = 128;
grad.stops[1].frac = 192;
lv_style_set_bg_grad(&style, &grad);
/*Create an object with the new style*/
lv_obj_t * obj = lv_obj_create(lv_scr_act());
lv_obj_add_style(obj, &style, 0);
lv_obj_center(obj);
}
#endif
#
# Using the background style properties
#
style = lv.style_t()
style.init()
style.set_radius(5)
# Make a gradient
style.set_bg_opa(lv.OPA.COVER)
style.set_bg_color(lv.palette_lighten(lv.PALETTE.GREY, 1))
style.set_bg_grad_color(lv.palette_main(lv.PALETTE.BLUE))
style.set_bg_grad_dir(lv.GRAD_DIR.VER)
# Shift the gradient to the bottom
style.set_bg_main_stop(128)
style.set_bg_grad_stop(192)
# Create an object with the new style
obj = lv.obj(lv.scr_act())
obj.add_style(style, 0)
obj.center()
Border styles¶
C code
GitHub#include "../lv_examples.h"
#if LV_BUILD_EXAMPLES
/**
* Using the border style properties
*/
void lv_example_style_3(void)
{
static lv_style_t style;
lv_style_init(&style);
/*Set a background color and a radius*/
lv_style_set_radius(&style, 10);
lv_style_set_bg_opa(&style, LV_OPA_COVER);
lv_style_set_bg_color(&style, lv_palette_lighten(LV_PALETTE_GREY, 1));
/*Add border to the bottom+right*/
lv_style_set_border_color(&style, lv_palette_main(LV_PALETTE_BLUE));
lv_style_set_border_width(&style, 5);
lv_style_set_border_opa(&style, LV_OPA_50);
lv_style_set_border_side(&style, LV_BORDER_SIDE_BOTTOM | LV_BORDER_SIDE_RIGHT);
/*Create an object with the new style*/
lv_obj_t * obj = lv_obj_create(lv_scr_act());
lv_obj_add_style(obj, &style, 0);
lv_obj_center(obj);
}
#endif
#
# Using the border style properties
#
style = lv.style_t()
style.init()
# Set a background color and a radius
style.set_radius(10)
style.set_bg_opa(lv.OPA.COVER)
style.set_bg_color(lv.palette_lighten(lv.PALETTE.GREY, 1))
# Add border to the bottom+right
style.set_border_color(lv.palette_main(lv.PALETTE.BLUE))
style.set_border_width(5)
style.set_border_opa(lv.OPA._50)
style.set_border_side(lv.BORDER_SIDE.BOTTOM | lv.BORDER_SIDE.RIGHT)
# Create an object with the new style
obj = lv.obj(lv.scr_act())
obj.add_style(style, 0)
obj.center()
Outline styles¶
C code
GitHub#include "../lv_examples.h"
#if LV_BUILD_EXAMPLES
/**
* Using the outline style properties
*/
void lv_example_style_4(void)
{
static lv_style_t style;
lv_style_init(&style);
/*Set a background color and a radius*/
lv_style_set_radius(&style, 5);
lv_style_set_bg_opa(&style, LV_OPA_COVER);
lv_style_set_bg_color(&style, lv_palette_lighten(LV_PALETTE_GREY, 1));
/*Add outline*/
lv_style_set_outline_width(&style, 2);
lv_style_set_outline_color(&style, lv_palette_main(LV_PALETTE_BLUE));
lv_style_set_outline_pad(&style, 8);
/*Create an object with the new style*/
lv_obj_t * obj = lv_obj_create(lv_scr_act());
lv_obj_add_style(obj, &style, 0);
lv_obj_center(obj);
}
#endif
#
# Using the outline style properties
#
style = lv.style_t()
style.init()
# Set a background color and a radius
style.set_radius(5)
style.set_bg_opa(lv.OPA.COVER)
style.set_bg_color(lv.palette_lighten(lv.PALETTE.GREY, 1))
# Add outline
style.set_outline_width(2)
style.set_outline_color(lv.palette_main(lv.PALETTE.BLUE))
style.set_outline_pad(8)
# Create an object with the new style
obj = lv.obj(lv.scr_act())
obj.add_style(style, 0)
obj.center()
Shadow styles¶
C code
GitHub#include "../lv_examples.h"
#if LV_BUILD_EXAMPLES
/**
* Using the Shadow style properties
*/
void lv_example_style_5(void)
{
static lv_style_t style;
lv_style_init(&style);
/*Set a background color and a radius*/
lv_style_set_radius(&style, 5);
lv_style_set_bg_opa(&style, LV_OPA_COVER);
lv_style_set_bg_color(&style, lv_palette_lighten(LV_PALETTE_GREY, 1));
/*Add a shadow*/
lv_style_set_shadow_width(&style, 55);
lv_style_set_shadow_color(&style, lv_palette_main(LV_PALETTE_BLUE));
// lv_style_set_shadow_ofs_x(&style, 10);
// lv_style_set_shadow_ofs_y(&style, 20);
/*Create an object with the new style*/
lv_obj_t * obj = lv_obj_create(lv_scr_act());
lv_obj_add_style(obj, &style, 0);
lv_obj_center(obj);
}
#endif
#
# Using the Shadow style properties
#
style = lv.style_t()
style.init()
# Set a background color and a radius
style.set_radius(5)
style.set_bg_opa(lv.OPA.COVER)
style.set_bg_color(lv.palette_lighten(lv.PALETTE.GREY, 1))
# Add a shadow
style.set_shadow_width(8)
style.set_shadow_color(lv.palette_main(lv.PALETTE.BLUE))
style.set_shadow_ofs_x(10)
style.set_shadow_ofs_y(20)
# Create an object with the new style
obj = lv.obj(lv.scr_act())
obj.add_style(style, 0)
obj.center()
Image styles¶
C code
GitHub#include "../lv_examples.h"
#if LV_BUILD_EXAMPLES && LV_USE_IMG
/**
* Using the Image style properties
*/
void lv_example_style_6(void)
{
static lv_style_t style;
lv_style_init(&style);
/*Set a background color and a radius*/
lv_style_set_radius(&style, 5);
lv_style_set_bg_opa(&style, LV_OPA_COVER);
lv_style_set_bg_color(&style, lv_palette_lighten(LV_PALETTE_GREY, 3));
lv_style_set_border_width(&style, 2);
lv_style_set_border_color(&style, lv_palette_main(LV_PALETTE_BLUE));
lv_style_set_img_recolor(&style, lv_palette_main(LV_PALETTE_BLUE));
lv_style_set_img_recolor_opa(&style, LV_OPA_50);
lv_style_set_transform_angle(&style, 300);
/*Create an object with the new style*/
lv_obj_t * obj = lv_img_create(lv_scr_act());
lv_obj_add_style(obj, &style, 0);
LV_IMG_DECLARE(img_cogwheel_argb);
lv_img_set_src(obj, &img_cogwheel_argb);
lv_obj_center(obj);
}
#endif
from imagetools import get_png_info, open_png
# Register PNG image decoder
decoder = lv.img.decoder_create()
decoder.info_cb = get_png_info
decoder.open_cb = open_png
# Create an image from the png file
try:
with open('../assets/img_cogwheel_argb.png', 'rb') as f:
png_data = f.read()
except:
print("Could not find img_cogwheel_argb.png")
sys.exit()
img_cogwheel_argb = lv.img_dsc_t({
'data_size': len(png_data),
'data': png_data
})
#
# Using the Image style properties
#
style = lv.style_t()
style.init()
# Set a background color and a radius
style.set_radius(5)
style.set_bg_opa(lv.OPA.COVER)
style.set_bg_color(lv.palette_lighten(lv.PALETTE.GREY, 3))
style.set_border_width(2)
style.set_border_color(lv.palette_main(lv.PALETTE.BLUE))
style.set_img_recolor(lv.palette_main(lv.PALETTE.BLUE))
style.set_img_recolor_opa(lv.OPA._50)
# style.set_transform_angle(300)
# Create an object with the new style
obj = lv.img(lv.scr_act())
obj.add_style(style, 0)
obj.set_src(img_cogwheel_argb)
obj.center()
Arc styles¶
C code
GitHubError encountered while trying to open /home/runner/work/lvgl/lvgl/examples/style/lv_example_style_7.c
Error encountered while trying to open /home/runner/work/lvgl/lvgl/examples/style/lv_example_style_7.py
Text styles¶
C code
GitHub#include "../lv_examples.h"
#if LV_BUILD_EXAMPLES && LV_USE_LABEL
/**
* Using the text style properties
*/
void lv_example_style_8(void)
{
static lv_style_t style;
lv_style_init(&style);
lv_style_set_radius(&style, 5);
lv_style_set_bg_opa(&style, LV_OPA_COVER);
lv_style_set_bg_color(&style, lv_palette_lighten(LV_PALETTE_GREY, 2));
lv_style_set_border_width(&style, 2);
lv_style_set_border_color(&style, lv_palette_main(LV_PALETTE_BLUE));
lv_style_set_pad_all(&style, 10);
lv_style_set_text_color(&style, lv_palette_main(LV_PALETTE_BLUE));
lv_style_set_text_letter_space(&style, 5);
lv_style_set_text_line_space(&style, 20);
lv_style_set_text_decor(&style, LV_TEXT_DECOR_UNDERLINE);
/*Create an object with the new style*/
lv_obj_t * obj = lv_label_create(lv_scr_act());
lv_obj_add_style(obj, &style, 0);
lv_label_set_text(obj, "Text of\n"
"a label");
lv_obj_center(obj);
}
#endif
#
# Using the text style properties
#
style = lv.style_t()
style.init()
style.set_radius(5)
style.set_bg_opa(lv.OPA.COVER)
style.set_bg_color(lv.palette_lighten(lv.PALETTE.GREY, 3))
style.set_border_width(2)
style.set_border_color(lv.palette_main(lv.PALETTE.BLUE))
style.set_pad_all(10)
style.set_text_color(lv.palette_main(lv.PALETTE.BLUE))
style.set_text_letter_space(5)
style.set_text_line_space(20)
style.set_text_decor(lv.TEXT_DECOR.UNDERLINE)
# Create an object with the new style
obj = lv.label(lv.scr_act())
obj.add_style(style, 0)
obj.set_text("Text of\n"
"a label")
obj.center()
Line styles¶
C code
GitHub#include "../lv_examples.h"
#if LV_BUILD_EXAMPLES && LV_USE_LINE
/**
* Using the line style properties
*/
void lv_example_style_9(void)
{
static lv_style_t style;
lv_style_init(&style);
lv_style_set_line_color(&style, lv_palette_main(LV_PALETTE_GREY));
lv_style_set_line_width(&style, 6);
lv_style_set_line_rounded(&style, true);
/*Create an object with the new style*/
lv_obj_t * obj = lv_line_create(lv_scr_act());
lv_obj_add_style(obj, &style, 0);
static lv_point_t p[] = {{10, 30}, {30, 50}, {100, 0}};
lv_line_set_points(obj, p, 3);
lv_obj_center(obj);
}
#endif
#
# Using the line style properties
#
style = lv.style_t()
style.init()
style.set_line_color(lv.palette_main(lv.PALETTE.GREY))
style.set_line_width(6)
style.set_line_rounded(True)
# Create an object with the new style
obj = lv.line(lv.scr_act())
obj.add_style(style, 0)
p = [ {"x":10, "y":30},
{"x":30, "y":50},
{"x":100, "y":0}]
obj.set_points(p, 3)
obj.center()
Transition¶
C code
GitHub#include "../lv_examples.h"
#if LV_BUILD_EXAMPLES && LV_USE_IMG
/**
* Creating a transition
*/
void lv_example_style_10(void)
{
static const lv_style_prop_t props[] = {LV_STYLE_BG_COLOR, LV_STYLE_BORDER_COLOR, LV_STYLE_BORDER_WIDTH, 0};
/* A default transition
* Make it fast (100ms) and start with some delay (200 ms)*/
static lv_style_transition_dsc_t trans_def;
lv_style_transition_dsc_init(&trans_def, props, lv_anim_path_linear, 100, 200, NULL);
/* A special transition when going to pressed state
* Make it slow (500 ms) but start without delay*/
static lv_style_transition_dsc_t trans_pr;
lv_style_transition_dsc_init(&trans_pr, props, lv_anim_path_linear, 500, 0, NULL);
static lv_style_t style_def;
lv_style_init(&style_def);
lv_style_set_transition(&style_def, &trans_def);
static lv_style_t style_pr;
lv_style_init(&style_pr);
lv_style_set_bg_color(&style_pr, lv_palette_main(LV_PALETTE_RED));
lv_style_set_border_width(&style_pr, 6);
lv_style_set_border_color(&style_pr, lv_palette_darken(LV_PALETTE_RED, 3));
lv_style_set_transition(&style_pr, &trans_pr);
/*Create an object with the new style_pr*/
lv_obj_t * obj = lv_obj_create(lv_scr_act());
lv_obj_add_style(obj, &style_def, 0);
lv_obj_add_style(obj, &style_pr, LV_STATE_PRESSED);
lv_obj_center(obj);
}
#endif
#
# Creating a transition
#
props = [lv.STYLE.BG_COLOR, lv.STYLE.BORDER_COLOR, lv.STYLE.BORDER_WIDTH, 0]
# A default transition
# Make it fast (100ms) and start with some delay (200 ms)
trans_def = lv.style_transition_dsc_t()
trans_def.init(props, lv.anim_t.path_linear, 100, 200, None)
# A special transition when going to pressed state
# Make it slow (500 ms) but start without delay
trans_pr = lv.style_transition_dsc_t()
trans_pr.init(props, lv.anim_t.path_linear, 500, 0, None)
style_def = lv.style_t()
style_def.init()
style_def.set_transition(trans_def)
style_pr = lv.style_t()
style_pr.init()
style_pr.set_bg_color(lv.palette_main(lv.PALETTE.RED))
style_pr.set_border_width(6)
style_pr.set_border_color(lv.palette_darken(lv.PALETTE.RED, 3))
style_pr.set_transition(trans_pr)
# Create an object with the new style_pr
obj = lv.obj(lv.scr_act())
obj.add_style(style_def, 0)
obj.add_style(style_pr, lv.STATE.PRESSED)
obj.center()
Using multiple styles¶
C code
GitHub#include "../lv_examples.h"
#if LV_BUILD_EXAMPLES && LV_USE_IMG
/**
* Using multiple styles
*/
void lv_example_style_11(void)
{
/*A base style*/
static lv_style_t style_base;
lv_style_init(&style_base);
lv_style_set_bg_color(&style_base, lv_palette_main(LV_PALETTE_LIGHT_BLUE));
lv_style_set_border_color(&style_base, lv_palette_darken(LV_PALETTE_LIGHT_BLUE, 3));
lv_style_set_border_width(&style_base, 2);
lv_style_set_radius(&style_base, 10);
lv_style_set_shadow_width(&style_base, 10);
lv_style_set_shadow_ofs_y(&style_base, 5);
lv_style_set_shadow_opa(&style_base, LV_OPA_50);
lv_style_set_text_color(&style_base, lv_color_white());
lv_style_set_width(&style_base, 100);
lv_style_set_height(&style_base, LV_SIZE_CONTENT);
/*Set only the properties that should be different*/
static lv_style_t style_warning;
lv_style_init(&style_warning);
lv_style_set_bg_color(&style_warning, lv_palette_main(LV_PALETTE_YELLOW));
lv_style_set_border_color(&style_warning, lv_palette_darken(LV_PALETTE_YELLOW, 3));
lv_style_set_text_color(&style_warning, lv_palette_darken(LV_PALETTE_YELLOW, 4));
/*Create an object with the base style only*/
lv_obj_t * obj_base = lv_obj_create(lv_scr_act());
lv_obj_add_style(obj_base, &style_base, 0);
lv_obj_align(obj_base, LV_ALIGN_LEFT_MID, 20, 0);
lv_obj_t * label = lv_label_create(obj_base);
lv_label_set_text(label, "Base");
lv_obj_center(label);
/*Create another object with the base style and earnings style too*/
lv_obj_t * obj_warning = lv_obj_create(lv_scr_act());
lv_obj_add_style(obj_warning, &style_base, 0);
lv_obj_add_style(obj_warning, &style_warning, 0);
lv_obj_align(obj_warning, LV_ALIGN_RIGHT_MID, -20, 0);
label = lv_label_create(obj_warning);
lv_label_set_text(label, "Warning");
lv_obj_center(label);
}
#endif
#
# Using multiple styles
#
# A base style
style_base = lv.style_t()
style_base.init()
style_base.set_bg_color(lv.palette_main(lv.PALETTE.LIGHT_BLUE))
style_base.set_border_color(lv.palette_darken(lv.PALETTE.LIGHT_BLUE, 3))
style_base.set_border_width(2)
style_base.set_radius(10)
style_base.set_shadow_width(10)
style_base.set_shadow_ofs_y(5)
style_base.set_shadow_opa(lv.OPA._50)
style_base.set_text_color(lv.color_white())
style_base.set_width(100)
style_base.set_height(lv.SIZE.CONTENT)
# Set only the properties that should be different
style_warning = lv.style_t()
style_warning.init()
style_warning.set_bg_color(lv.palette_main(lv.PALETTE.YELLOW))
style_warning.set_border_color(lv.palette_darken(lv.PALETTE.YELLOW, 3))
style_warning.set_text_color(lv.palette_darken(lv.PALETTE.YELLOW, 4))
# Create an object with the base style only
obj_base = lv.obj(lv.scr_act())
obj_base.add_style(style_base, 0)
obj_base.align(lv.ALIGN.LEFT_MID, 20, 0)
label = lv.label(obj_base)
label.set_text("Base")
label.center()
# Create another object with the base style and earnings style too
obj_warning = lv.obj(lv.scr_act())
obj_warning.add_style(style_base, 0)
obj_warning.add_style(style_warning, 0)
obj_warning.align(lv.ALIGN.RIGHT_MID, -20, 0)
label = lv.label(obj_warning)
label.set_text("Warning")
label.center()
Local styles¶
C code
GitHub#include "../lv_examples.h"
#if LV_BUILD_EXAMPLES && LV_USE_IMG
/**
* Local styles
*/
void lv_example_style_12(void)
{
static lv_style_t style;
lv_style_init(&style);
lv_style_set_bg_color(&style, lv_palette_main(LV_PALETTE_GREEN));
lv_style_set_border_color(&style, lv_palette_lighten(LV_PALETTE_GREEN, 3));
lv_style_set_border_width(&style, 3);
lv_obj_t * obj = lv_obj_create(lv_scr_act());
lv_obj_add_style(obj, &style, 0);
/*Overwrite the background color locally*/
lv_obj_set_style_bg_color(obj, lv_palette_main(LV_PALETTE_ORANGE), LV_PART_MAIN);
lv_obj_center(obj);
}
#endif
#
# Local styles
#
style = lv.style_t()
style.init()
style.set_bg_color(lv.palette_main(lv.PALETTE.GREEN))
style.set_border_color(lv.palette_lighten(lv.PALETTE.GREEN, 3))
style.set_border_width(3)
obj = lv.obj(lv.scr_act())
obj.add_style(style, 0)
# Overwrite the background color locally
obj.set_style_bg_color(lv.palette_main(lv.PALETTE.ORANGE), lv.PART.MAIN)
obj.center()
Add styles to parts and states¶
C code
GitHub#include "../lv_examples.h"
#if LV_BUILD_EXAMPLES && LV_USE_IMG
/**
* Add styles to parts and states
*/
void lv_example_style_13(void)
{
static lv_style_t style_indic;
lv_style_init(&style_indic);
lv_style_set_bg_color(&style_indic, lv_palette_lighten(LV_PALETTE_RED, 3));
lv_style_set_bg_grad_color(&style_indic, lv_palette_main(LV_PALETTE_RED));
lv_style_set_bg_grad_dir(&style_indic, LV_GRAD_DIR_HOR);
static lv_style_t style_indic_pr;
lv_style_init(&style_indic_pr);
lv_style_set_shadow_color(&style_indic_pr, lv_palette_main(LV_PALETTE_RED));
lv_style_set_shadow_width(&style_indic_pr, 10);
lv_style_set_shadow_spread(&style_indic_pr, 3);
/*Create an object with the new style_pr*/
lv_obj_t * obj = lv_slider_create(lv_scr_act());
lv_obj_add_style(obj, &style_indic, LV_PART_INDICATOR);
lv_obj_add_style(obj, &style_indic_pr, LV_PART_INDICATOR | LV_STATE_PRESSED);
lv_slider_set_value(obj, 70, LV_ANIM_OFF);
lv_obj_center(obj);
}
#endif
#
# Add styles to parts and states
#
style_indic = lv.style_t()
style_indic.init()
style_indic.set_bg_color(lv.palette_lighten(lv.PALETTE.RED, 3))
style_indic.set_bg_grad_color(lv.palette_main(lv.PALETTE.RED))
style_indic.set_bg_grad_dir(lv.GRAD_DIR.HOR)
style_indic_pr = lv.style_t()
style_indic_pr.init()
style_indic_pr.set_shadow_color(lv.palette_main(lv.PALETTE.RED))
style_indic_pr.set_shadow_width(10)
style_indic_pr.set_shadow_spread(3)
# Create an object with the new style_pr
obj = lv.slider(lv.scr_act())
obj.add_style(style_indic, lv.PART.INDICATOR)
obj.add_style(style_indic_pr, lv.PART.INDICATOR | lv.STATE.PRESSED)
obj.set_value(70, lv.ANIM.OFF)
obj.center()
Extending the current theme¶
C code
GitHub#include "../lv_examples.h"
#if LV_BUILD_EXAMPLES && LV_USE_IMG
static lv_style_t style_btn;
/*Will be called when the styles of the base theme are already added
to add new styles*/
static void new_theme_apply_cb(lv_theme_t * th, lv_obj_t * obj)
{
LV_UNUSED(th);
if(lv_obj_check_type(obj, &lv_btn_class)) {
lv_obj_add_style(obj, &style_btn, 0);
}
}
static void new_theme_init_and_set(void)
{
/*Initialize the styles*/
lv_style_init(&style_btn);
lv_style_set_bg_color(&style_btn, lv_palette_main(LV_PALETTE_GREEN));
lv_style_set_border_color(&style_btn, lv_palette_darken(LV_PALETTE_GREEN, 3));
lv_style_set_border_width(&style_btn, 3);
/*Initialize the new theme from the current theme*/
lv_theme_t * th_act = lv_disp_get_theme(NULL);
static lv_theme_t th_new;
th_new = *th_act;
/*Set the parent theme and the style apply callback for the new theme*/
lv_theme_set_parent(&th_new, th_act);
lv_theme_set_apply_cb(&th_new, new_theme_apply_cb);
/*Assign the new theme to the current display*/
lv_disp_set_theme(NULL, &th_new);
}
/**
* Extending the current theme
*/
void lv_example_style_14(void)
{
lv_obj_t * btn;
lv_obj_t * label;
btn = lv_btn_create(lv_scr_act());
lv_obj_align(btn, LV_ALIGN_TOP_MID, 0, 20);
label = lv_label_create(btn);
lv_label_set_text(label, "Original theme");
new_theme_init_and_set();
btn = lv_btn_create(lv_scr_act());
lv_obj_align(btn, LV_ALIGN_BOTTOM_MID, 0, -20);
label = lv_label_create(btn);
lv_label_set_text(label, "New theme");
}
#endif
# Will be called when the styles of the base theme are already added
# to add new styles
class NewTheme(lv.theme_t):
def __init__(self):
super().__init__()
# Initialize the styles
self.style_btn = lv.style_t()
self.style_btn.init()
self.style_btn.set_bg_color(lv.palette_main(lv.PALETTE.GREEN))
self.style_btn.set_border_color(lv.palette_darken(lv.PALETTE.GREEN, 3))
self.style_btn.set_border_width(3)
# This theme is based on active theme
th_act = lv.theme_get_from_obj(lv.scr_act())
# This theme will be applied only after base theme is applied
self.set_parent(th_act)
class ExampleStyle_14:
def __init__(self):
#
# Extending the current theme
#
btn = lv.btn(lv.scr_act())
btn.align(lv.ALIGN.TOP_MID, 0, 20)
label = lv.label(btn)
label.set_text("Original theme")
self.new_theme_init_and_set()
btn = lv.btn(lv.scr_act())
btn.align(lv.ALIGN.BOTTOM_MID, 0, -20)
label = lv.label(btn)
label.set_text("New theme")
def new_theme_apply_cb(self, th, obj):
print(th,obj)
if obj.get_class() == lv.btn_class:
obj.add_style(self.th_new.style_btn, 0)
def new_theme_init_and_set(self):
print("new_theme_init_and_set")
# Initialize the new theme from the current theme
self.th_new = NewTheme()
self.th_new.set_apply_cb(self.new_theme_apply_cb)
lv.disp_get_default().set_theme(self.th_new)
exampleStyle_14 = ExampleStyle_14()
Opacity and Transformations¶
C code
GitHub#include "../lv_examples.h"
#if LV_BUILD_EXAMPLES && LV_USE_BTN && LV_USE_LABEL
/**
* Opacity and Transformations
*/
void lv_example_style_15(void)
{
lv_obj_t * btn;
lv_obj_t * label;
/*Normal button*/
btn = lv_btn_create(lv_scr_act());
lv_obj_set_size(btn, 100, 40);
lv_obj_align(btn, LV_ALIGN_CENTER, 0, -70);
label = lv_label_create(btn);
lv_label_set_text(label, "Normal");
lv_obj_center(label);
/*Set opacity
*The button and the label is rendered to a layer first and that layer is blended*/
btn = lv_btn_create(lv_scr_act());
lv_obj_set_size(btn, 100, 40);
lv_obj_set_style_opa(btn, LV_OPA_50, 0);
lv_obj_align(btn, LV_ALIGN_CENTER, 0, 0);
label = lv_label_create(btn);
lv_label_set_text(label, "Opa:50%");
lv_obj_center(label);
/*Set transformations
*The button and the label is rendered to a layer first and that layer is transformed*/
btn = lv_btn_create(lv_scr_act());
lv_obj_set_size(btn, 100, 40);
lv_obj_set_style_transform_angle(btn, 150, 0); /*15 deg*/
lv_obj_set_style_transform_zoom(btn, 256 + 64, 0); /*1.25x*/
lv_obj_set_style_transform_pivot_x(btn, 50, 0);
lv_obj_set_style_transform_pivot_y(btn, 20, 0);
lv_obj_set_style_opa(btn, LV_OPA_50, 0);
lv_obj_align(btn, LV_ALIGN_CENTER, 0, 70);
label = lv_label_create(btn);
lv_label_set_text(label, "Transf.");
lv_obj_center(label);
}
#endif
Error encountered while trying to open /home/runner/work/lvgl/lvgl/examples/styles/lv_example_style_15.py
API¶
Typedefs
-
typedef uint8_t lv_blend_mode_t¶
-
typedef uint8_t lv_text_decor_t¶
-
typedef uint8_t lv_border_side_t¶
-
typedef uint8_t lv_grad_dir_t¶
-
typedef uint8_t lv_dither_mode_t¶
-
typedef uint8_t lv_style_res_t¶
Enums
-
enum [anonymous]¶
Possible options how to blend opaque drawings
Values:
-
enumerator LV_BLEND_MODE_NORMAL¶
Simply mix according to the opacity value
-
enumerator LV_BLEND_MODE_ADDITIVE¶
Add the respective color channels
-
enumerator LV_BLEND_MODE_SUBTRACTIVE¶
Subtract the foreground from the background
-
enumerator LV_BLEND_MODE_MULTIPLY¶
Multiply the foreground and background
-
enumerator LV_BLEND_MODE_REPLACE¶
Replace background with foreground in the area
-
enumerator LV_BLEND_MODE_NORMAL¶
-
enum [anonymous]¶
Some options to apply decorations on texts. 'OR'ed values can be used.
Values:
-
enumerator LV_TEXT_DECOR_NONE¶
-
enumerator LV_TEXT_DECOR_UNDERLINE¶
-
enumerator LV_TEXT_DECOR_STRIKETHROUGH¶
-
enumerator LV_TEXT_DECOR_NONE¶
-
enum [anonymous]¶
Selects on which sides border should be drawn 'OR'ed values can be used.
Values:
-
enumerator LV_BORDER_SIDE_NONE¶
-
enumerator LV_BORDER_SIDE_BOTTOM¶
-
enumerator LV_BORDER_SIDE_TOP¶
-
enumerator LV_BORDER_SIDE_LEFT¶
-
enumerator LV_BORDER_SIDE_RIGHT¶
-
enumerator LV_BORDER_SIDE_FULL¶
-
enumerator LV_BORDER_SIDE_INTERNAL¶
FOR matrix-like objects (e.g. Button matrix)
-
enumerator LV_BORDER_SIDE_NONE¶
-
enum [anonymous]¶
The direction of the gradient.
Values:
-
enumerator LV_GRAD_DIR_NONE¶
No gradient (the
grad_color
property is ignored)
-
enumerator LV_GRAD_DIR_VER¶
Vertical (top to bottom) gradient
-
enumerator LV_GRAD_DIR_HOR¶
Horizontal (left to right) gradient
-
enumerator LV_GRAD_DIR_NONE¶
-
enum [anonymous]¶
The dithering algorithm for the gradient Depends on LV_DITHER_GRADIENT
Values:
-
enumerator LV_DITHER_NONE¶
No dithering, colors are just quantized to the output resolution
-
enumerator LV_DITHER_ORDERED¶
Ordered dithering. Faster to compute and use less memory but lower quality
-
enumerator LV_DITHER_ERR_DIFF¶
Error diffusion mode. Slower to compute and use more memory but give highest dither quality
-
enumerator LV_DITHER_NONE¶
-
enum lv_style_prop_t¶
Enumeration of all built in style properties
Props are split into groups of 16. When adding a new prop to a group, ensure it does not overflow into the next one.
Values:
-
enumerator LV_STYLE_PROP_INV¶
-
enumerator LV_STYLE_WIDTH¶
-
enumerator LV_STYLE_MIN_WIDTH¶
-
enumerator LV_STYLE_MAX_WIDTH¶
-
enumerator LV_STYLE_HEIGHT¶
-
enumerator LV_STYLE_MIN_HEIGHT¶
-
enumerator LV_STYLE_MAX_HEIGHT¶
-
enumerator LV_STYLE_X¶
-
enumerator LV_STYLE_Y¶
-
enumerator LV_STYLE_ALIGN¶
-
enumerator LV_STYLE_LAYOUT¶
-
enumerator LV_STYLE_RADIUS¶
-
enumerator LV_STYLE_PAD_TOP¶
-
enumerator LV_STYLE_PAD_BOTTOM¶
-
enumerator LV_STYLE_PAD_LEFT¶
-
enumerator LV_STYLE_PAD_RIGHT¶
-
enumerator LV_STYLE_PAD_ROW¶
-
enumerator LV_STYLE_PAD_COLUMN¶
-
enumerator LV_STYLE_BASE_DIR¶
-
enumerator LV_STYLE_CLIP_CORNER¶
-
enumerator LV_STYLE_BG_COLOR¶
-
enumerator LV_STYLE_BG_OPA¶
-
enumerator LV_STYLE_BG_GRAD_COLOR¶
-
enumerator LV_STYLE_BG_GRAD_DIR¶
-
enumerator LV_STYLE_BG_MAIN_STOP¶
-
enumerator LV_STYLE_BG_GRAD_STOP¶
-
enumerator LV_STYLE_BG_GRAD¶
-
enumerator LV_STYLE_BG_DITHER_MODE¶
-
enumerator LV_STYLE_BG_IMG_SRC¶
-
enumerator LV_STYLE_BG_IMG_OPA¶
-
enumerator LV_STYLE_BG_IMG_RECOLOR¶
-
enumerator LV_STYLE_BG_IMG_RECOLOR_OPA¶
-
enumerator LV_STYLE_BG_IMG_TILED¶
-
enumerator LV_STYLE_BORDER_COLOR¶
-
enumerator LV_STYLE_BORDER_OPA¶
-
enumerator LV_STYLE_BORDER_WIDTH¶
-
enumerator LV_STYLE_BORDER_SIDE¶
-
enumerator LV_STYLE_BORDER_POST¶
-
enumerator LV_STYLE_OUTLINE_WIDTH¶
-
enumerator LV_STYLE_OUTLINE_COLOR¶
-
enumerator LV_STYLE_OUTLINE_OPA¶
-
enumerator LV_STYLE_OUTLINE_PAD¶
-
enumerator LV_STYLE_SHADOW_WIDTH¶
-
enumerator LV_STYLE_SHADOW_OFS_X¶
-
enumerator LV_STYLE_SHADOW_OFS_Y¶
-
enumerator LV_STYLE_SHADOW_SPREAD¶
-
enumerator LV_STYLE_SHADOW_COLOR¶
-
enumerator LV_STYLE_SHADOW_OPA¶
-
enumerator LV_STYLE_IMG_OPA¶
-
enumerator LV_STYLE_IMG_RECOLOR¶
-
enumerator LV_STYLE_IMG_RECOLOR_OPA¶
-
enumerator LV_STYLE_LINE_WIDTH¶
-
enumerator LV_STYLE_LINE_DASH_WIDTH¶
-
enumerator LV_STYLE_LINE_DASH_GAP¶
-
enumerator LV_STYLE_LINE_ROUNDED¶
-
enumerator LV_STYLE_LINE_COLOR¶
-
enumerator LV_STYLE_LINE_OPA¶
-
enumerator LV_STYLE_ARC_WIDTH¶
-
enumerator LV_STYLE_ARC_ROUNDED¶
-
enumerator LV_STYLE_ARC_COLOR¶
-
enumerator LV_STYLE_ARC_OPA¶
-
enumerator LV_STYLE_ARC_IMG_SRC¶
-
enumerator LV_STYLE_TEXT_COLOR¶
-
enumerator LV_STYLE_TEXT_OPA¶
-
enumerator LV_STYLE_TEXT_FONT¶
-
enumerator LV_STYLE_TEXT_LETTER_SPACE¶
-
enumerator LV_STYLE_TEXT_LINE_SPACE¶
-
enumerator LV_STYLE_TEXT_DECOR¶
-
enumerator LV_STYLE_TEXT_ALIGN¶
-
enumerator LV_STYLE_OPA¶
-
enumerator LV_STYLE_OPA_LAYERED¶
-
enumerator LV_STYLE_COLOR_FILTER_DSC¶
-
enumerator LV_STYLE_COLOR_FILTER_OPA¶
-
enumerator LV_STYLE_ANIM¶
-
enumerator LV_STYLE_ANIM_TIME¶
-
enumerator LV_STYLE_ANIM_SPEED¶
-
enumerator LV_STYLE_TRANSITION¶
-
enumerator LV_STYLE_BLEND_MODE¶
-
enumerator LV_STYLE_TRANSFORM_WIDTH¶
-
enumerator LV_STYLE_TRANSFORM_HEIGHT¶
-
enumerator LV_STYLE_TRANSLATE_X¶
-
enumerator LV_STYLE_TRANSLATE_Y¶
-
enumerator LV_STYLE_TRANSFORM_ZOOM¶
-
enumerator LV_STYLE_TRANSFORM_ANGLE¶
-
enumerator LV_STYLE_TRANSFORM_PIVOT_X¶
-
enumerator LV_STYLE_TRANSFORM_PIVOT_Y¶
-
enumerator _LV_STYLE_LAST_BUILT_IN_PROP¶
-
enumerator _LV_STYLE_NUM_BUILT_IN_PROPS¶
-
enumerator LV_STYLE_PROP_ANY¶
-
enumerator _LV_STYLE_PROP_CONST¶
-
enumerator LV_STYLE_PROP_INV¶
Functions
-
LV_EXPORT_CONST_INT(LV_IMG_ZOOM_NONE)¶
-
void lv_style_init(lv_style_t *style)¶
Initialize a style
Note
Do not 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)¶
Clear all properties from a style and free all allocated memories.
- Parameters
style -- pointer to a style
-
lv_style_prop_t lv_style_register_prop(uint8_t flag)¶
-
lv_style_prop_t lv_style_get_num_custom_props(void)¶
Get the number of custom properties that have been registered thus far.
-
bool lv_style_remove_prop(lv_style_t *style, lv_style_prop_t prop)¶
Remove a property from a style
- Parameters
style -- pointer 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)¶
Set the value of property in a style. This function shouldn't be used directly by the 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 ofprop
-
void lv_style_set_prop_meta(lv_style_t *style, lv_style_prop_t prop, uint16_t meta)¶
Set a special meta state for a property in a style. This function shouldn't be used directly by the user.
- Parameters
style -- pointer to style
prop -- the ID of a property (e.g.
LV_STYLE_BG_COLOR
)meta -- the meta value to attach to the property in the style
-
lv_style_res_t lv_style_get_prop(const lv_style_t *style, lv_style_prop_t prop, lv_style_value_t *value)¶
Get the value of a property
Note
For performance reasons there are no sanity check on
style
- 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, andvalue
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)¶
-
lv_style_value_t lv_style_prop_get_default(lv_style_prop_t prop)¶
Get the default value of a property
- Parameters
prop -- the ID of a property
- Returns
the default value
-
static inline lv_style_res_t lv_style_get_prop_inlined(const lv_style_t *style, lv_style_prop_t prop, lv_style_value_t *value)¶
Get the value of a property
Note
For performance reasons there are no sanity check on
style
Note
This function is 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, andvalue
is set accordingly
-
bool lv_style_is_empty(const lv_style_t *style)¶
Checks if a style is empty (has no properties)
- 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)¶
Tell the group of a property. If the a property from 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
-
uint8_t _lv_style_prop_lookup_flags(lv_style_prop_t prop)¶
Get the flags of a built-in or custom property.
- Parameters
prop -- a style property
- Returns
the flags of the property
-
static inline void lv_style_set_size(lv_style_t *style, lv_coord_t value)¶
-
static inline void lv_style_set_pad_all(lv_style_t *style, lv_coord_t value)¶
-
static inline void lv_style_set_pad_hor(lv_style_t *style, lv_coord_t value)¶
-
static inline void lv_style_set_pad_ver(lv_style_t *style, lv_coord_t value)¶
-
static inline void lv_style_set_pad_gap(lv_style_t *style, lv_coord_t value)¶
-
static inline bool lv_style_prop_has_flag(lv_style_prop_t prop, uint8_t flag)¶
Check if the style property has a specified behavioral flag.
Do not pass multiple flags to this function as backwards-compatibility is not guaranteed for that.
- Parameters
prop -- Property ID
flag -- Flag
- Returns
true if the flag is set for this property
-
struct lv_gradient_stop_t¶
- #include <lv_style.h>
A gradient stop definition. This matches a color and a position in a virtual 0-255 scale.
-
struct lv_grad_dsc_t¶
- #include <lv_style.h>
A descriptor of a gradient.
Public Members
-
lv_gradient_stop_t stops[LV_GRADIENT_MAX_STOPS]¶
A gradient stop array
-
uint8_t stops_count¶
The number of used stops in the array
-
lv_grad_dir_t dir¶
The gradient direction. Any of LV_GRAD_DIR_HOR, LV_GRAD_DIR_VER, LV_GRAD_DIR_NONE
-
lv_dither_mode_t dither¶
Whether to dither the gradient or not. Any of LV_DITHER_NONE, LV_DITHER_ORDERED, LV_DITHER_ERR_DIFF
-
lv_gradient_stop_t stops[LV_GRADIENT_MAX_STOPS]¶
-
union lv_style_value_t¶
- #include <lv_style.h>
A common type to handle all the property types in the same way.
-
struct lv_style_transition_dsc_t¶
- #include <lv_style.h>
Descriptor for style transitions
Public Members
-
const lv_style_prop_t *props¶
An array with the properties to animate.
-
void *user_data¶
A custom user data that will be passed to the animation's user_data
-
lv_anim_path_cb_t path_xcb¶
A path for the animation.
-
uint32_t time¶
Duration of the transition in [ms]
-
uint32_t delay¶
Delay before the transition in [ms]
-
const lv_style_prop_t *props¶
-
struct lv_style_const_prop_t¶
- #include <lv_style.h>
Descriptor of a constant style property.
-
struct lv_style_t¶
- #include <lv_style.h>
Descriptor of a style (a collection of properties and values).
Public Members
-
uint32_t sentinel¶
-
lv_style_value_t value1¶
-
uint8_t *values_and_props¶
-
const lv_style_const_prop_t *const_props¶
-
union lv_style_t::[anonymous] v_p¶
-
uint16_t prop1¶
-
uint8_t has_group¶
-
uint8_t prop_cnt¶
-
uint32_t sentinel¶
Typedefs
-
typedef void (*lv_theme_apply_cb_t)(struct _lv_theme_t*, lv_obj_t*)¶
-
typedef struct _lv_theme_t lv_theme_t¶
Functions
-
lv_theme_t *lv_theme_get_from_obj(lv_obj_t *obj)¶
Get the theme assigned to the display of the 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)¶
Apply the active theme on an object
- Parameters
obj -- pointer to an object
-
void lv_theme_set_parent(lv_theme_t *new_theme, lv_theme_t *parent)¶
Set a base theme for a theme. The styles from the base them will 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)¶
Set an apply callback for a theme. The apply callback is used to add styles 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)¶
Get the small font of the theme
- Parameters
obj -- pointer to an object
- Returns
pointer to the font
-
const lv_font_t *lv_theme_get_font_normal(lv_obj_t *obj)¶
Get the normal font of the theme
- Parameters
obj -- pointer to an object
- Returns
pointer to the font
-
const lv_font_t *lv_theme_get_font_large(lv_obj_t *obj)¶
Get the subtitle font of the theme
- Parameters
obj -- pointer to an object
- Returns
pointer to the font
-
struct _lv_theme_t¶
Public Members
-
lv_theme_apply_cb_t apply_cb¶
-
struct _lv_theme_t *parent¶
Apply the current theme's style on top of this theme.
-
void *user_data¶
-
struct _lv_disp_t *disp¶
-
lv_color_t color_primary¶
-
lv_color_t color_secondary¶
-
const lv_font_t *font_small¶
-
const lv_font_t *font_normal¶
-
const lv_font_t *font_large¶
-
uint32_t flags¶
-
lv_theme_apply_cb_t apply_cb¶
Functions
-
static inline lv_coord_t lv_obj_get_style_transform_width(const struct _lv_obj_t *obj, uint32_t part)¶
-
static inline lv_coord_t lv_obj_get_style_transform_height(const struct _lv_obj_t *obj, uint32_t part)¶
-
static inline lv_coord_t lv_obj_get_style_transform_zoom(const struct _lv_obj_t *obj, uint32_t part)¶
-
static inline lv_coord_t lv_obj_get_style_transform_angle(const struct _lv_obj_t *obj, uint32_t part)¶
-
static inline lv_coord_t lv_obj_get_style_transform_pivot_x(const struct _lv_obj_t *obj, uint32_t part)¶
-
static inline lv_coord_t lv_obj_get_style_transform_pivot_y(const struct _lv_obj_t *obj, uint32_t part)¶
-
static inline lv_color_t lv_obj_get_style_bg_color_filtered(const struct _lv_obj_t *obj, uint32_t part)¶
-
static inline lv_color_t lv_obj_get_style_bg_grad_color(const struct _lv_obj_t *obj, uint32_t part)¶
-
static inline lv_color_t lv_obj_get_style_bg_grad_color_filtered(const struct _lv_obj_t *obj, uint32_t part)¶
-
static inline lv_grad_dir_t lv_obj_get_style_bg_grad_dir(const struct _lv_obj_t *obj, uint32_t part)¶
-
static inline const lv_grad_dsc_t *lv_obj_get_style_bg_grad(const struct _lv_obj_t *obj, uint32_t part)¶
-
static inline lv_dither_mode_t lv_obj_get_style_bg_dither_mode(const struct _lv_obj_t *obj, uint32_t part)¶
-
static inline lv_color_t lv_obj_get_style_bg_img_recolor(const struct _lv_obj_t *obj, uint32_t part)¶
-
static inline lv_color_t lv_obj_get_style_bg_img_recolor_filtered(const struct _lv_obj_t *obj, uint32_t part)¶
-
static inline lv_opa_t lv_obj_get_style_bg_img_recolor_opa(const struct _lv_obj_t *obj, uint32_t part)¶
-
static inline lv_color_t lv_obj_get_style_border_color_filtered(const struct _lv_obj_t *obj, uint32_t part)¶
-
static inline lv_border_side_t lv_obj_get_style_border_side(const struct _lv_obj_t *obj, uint32_t part)¶
-
static inline lv_coord_t lv_obj_get_style_outline_width(const struct _lv_obj_t *obj, uint32_t part)¶
-
static inline lv_color_t lv_obj_get_style_outline_color(const struct _lv_obj_t *obj, uint32_t part)¶
-
static inline lv_color_t lv_obj_get_style_outline_color_filtered(const struct _lv_obj_t *obj, uint32_t part)¶
-
static inline lv_coord_t lv_obj_get_style_shadow_spread(const struct _lv_obj_t *obj, uint32_t part)¶
-
static inline lv_color_t lv_obj_get_style_shadow_color_filtered(const struct _lv_obj_t *obj, uint32_t part)¶
-
static inline lv_color_t lv_obj_get_style_img_recolor_filtered(const struct _lv_obj_t *obj, uint32_t part)¶
-
static inline lv_opa_t lv_obj_get_style_img_recolor_opa(const struct _lv_obj_t *obj, uint32_t part)¶
-
static inline lv_coord_t lv_obj_get_style_line_dash_width(const struct _lv_obj_t *obj, uint32_t part)¶
-
static inline lv_coord_t lv_obj_get_style_line_dash_gap(const struct _lv_obj_t *obj, uint32_t part)¶
-
static inline lv_color_t lv_obj_get_style_line_color_filtered(const struct _lv_obj_t *obj, uint32_t part)¶
-
static inline lv_color_t lv_obj_get_style_arc_color_filtered(const struct _lv_obj_t *obj, uint32_t part)¶
-
static inline lv_color_t lv_obj_get_style_text_color_filtered(const struct _lv_obj_t *obj, uint32_t part)¶
-
static inline const lv_font_t *lv_obj_get_style_text_font(const struct _lv_obj_t *obj, uint32_t part)¶
-
static inline lv_coord_t lv_obj_get_style_text_letter_space(const struct _lv_obj_t *obj, uint32_t part)¶
-
static inline lv_coord_t lv_obj_get_style_text_line_space(const struct _lv_obj_t *obj, uint32_t part)¶
-
static inline lv_text_decor_t lv_obj_get_style_text_decor(const struct _lv_obj_t *obj, uint32_t part)¶
-
static inline lv_text_align_t lv_obj_get_style_text_align(const struct _lv_obj_t *obj, uint32_t part)¶
-
static inline const lv_color_filter_dsc_t *lv_obj_get_style_color_filter_dsc(const struct _lv_obj_t *obj, uint32_t part)¶
-
static inline lv_opa_t lv_obj_get_style_color_filter_opa(const struct _lv_obj_t *obj, uint32_t part)¶
-
static inline const lv_style_transition_dsc_t *lv_obj_get_style_transition(const struct _lv_obj_t *obj, uint32_t part)¶
-
static inline lv_blend_mode_t lv_obj_get_style_blend_mode(const struct _lv_obj_t *obj, uint32_t part)¶
-
void lv_obj_set_style_min_width(struct _lv_obj_t *obj, lv_coord_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_max_width(struct _lv_obj_t *obj, lv_coord_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_height(struct _lv_obj_t *obj, lv_coord_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_min_height(struct _lv_obj_t *obj, lv_coord_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_max_height(struct _lv_obj_t *obj, lv_coord_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_transform_width(struct _lv_obj_t *obj, lv_coord_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_transform_height(struct _lv_obj_t *obj, lv_coord_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_translate_x(struct _lv_obj_t *obj, lv_coord_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_translate_y(struct _lv_obj_t *obj, lv_coord_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_transform_zoom(struct _lv_obj_t *obj, lv_coord_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_transform_angle(struct _lv_obj_t *obj, lv_coord_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_transform_pivot_x(struct _lv_obj_t *obj, lv_coord_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_transform_pivot_y(struct _lv_obj_t *obj, lv_coord_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_pad_top(struct _lv_obj_t *obj, lv_coord_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_pad_bottom(struct _lv_obj_t *obj, lv_coord_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_pad_left(struct _lv_obj_t *obj, lv_coord_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_pad_right(struct _lv_obj_t *obj, lv_coord_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_pad_row(struct _lv_obj_t *obj, lv_coord_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_pad_column(struct _lv_obj_t *obj, lv_coord_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_bg_color(struct _lv_obj_t *obj, lv_color_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_bg_grad_color(struct _lv_obj_t *obj, lv_color_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_bg_grad_dir(struct _lv_obj_t *obj, lv_grad_dir_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_bg_main_stop(struct _lv_obj_t *obj, lv_coord_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_bg_grad_stop(struct _lv_obj_t *obj, lv_coord_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_bg_grad(struct _lv_obj_t *obj, const lv_grad_dsc_t *value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_bg_dither_mode(struct _lv_obj_t *obj, lv_dither_mode_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_bg_img_src(struct _lv_obj_t *obj, const void *value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_bg_img_opa(struct _lv_obj_t *obj, lv_opa_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_bg_img_recolor(struct _lv_obj_t *obj, lv_color_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_bg_img_recolor_opa(struct _lv_obj_t *obj, lv_opa_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_bg_img_tiled(struct _lv_obj_t *obj, bool value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_border_color(struct _lv_obj_t *obj, lv_color_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_border_opa(struct _lv_obj_t *obj, lv_opa_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_border_width(struct _lv_obj_t *obj, lv_coord_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_border_side(struct _lv_obj_t *obj, lv_border_side_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_outline_width(struct _lv_obj_t *obj, lv_coord_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_outline_color(struct _lv_obj_t *obj, lv_color_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_outline_opa(struct _lv_obj_t *obj, lv_opa_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_outline_pad(struct _lv_obj_t *obj, lv_coord_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_shadow_width(struct _lv_obj_t *obj, lv_coord_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_shadow_ofs_x(struct _lv_obj_t *obj, lv_coord_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_shadow_ofs_y(struct _lv_obj_t *obj, lv_coord_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_shadow_spread(struct _lv_obj_t *obj, lv_coord_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_shadow_color(struct _lv_obj_t *obj, lv_color_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_shadow_opa(struct _lv_obj_t *obj, lv_opa_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_img_recolor(struct _lv_obj_t *obj, lv_color_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_img_recolor_opa(struct _lv_obj_t *obj, lv_opa_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_line_width(struct _lv_obj_t *obj, lv_coord_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_line_dash_width(struct _lv_obj_t *obj, lv_coord_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_line_dash_gap(struct _lv_obj_t *obj, lv_coord_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_line_rounded(struct _lv_obj_t *obj, bool value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_line_color(struct _lv_obj_t *obj, lv_color_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_line_opa(struct _lv_obj_t *obj, lv_opa_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_arc_width(struct _lv_obj_t *obj, lv_coord_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_arc_color(struct _lv_obj_t *obj, lv_color_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_arc_img_src(struct _lv_obj_t *obj, const void *value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_text_color(struct _lv_obj_t *obj, lv_color_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_text_opa(struct _lv_obj_t *obj, lv_opa_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_text_font(struct _lv_obj_t *obj, const lv_font_t *value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_text_letter_space(struct _lv_obj_t *obj, lv_coord_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_text_line_space(struct _lv_obj_t *obj, lv_coord_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_text_decor(struct _lv_obj_t *obj, lv_text_decor_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_text_align(struct _lv_obj_t *obj, lv_text_align_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_radius(struct _lv_obj_t *obj, lv_coord_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_opa_layered(struct _lv_obj_t *obj, lv_opa_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_color_filter_dsc(struct _lv_obj_t *obj, const lv_color_filter_dsc_t *value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_color_filter_opa(struct _lv_obj_t *obj, lv_opa_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_anim(struct _lv_obj_t *obj, const lv_anim_t *value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_anim_time(struct _lv_obj_t *obj, uint32_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_anim_speed(struct _lv_obj_t *obj, uint32_t value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_transition(struct _lv_obj_t *obj, const lv_style_transition_dsc_t *value, lv_style_selector_t selector)¶
-
void lv_obj_set_style_blend_mode(struct _lv_obj_t *obj, lv_blend_mode_t value, lv_style_selector_t selector)¶
Functions
-
void lv_style_set_width(lv_style_t *style, lv_coord_t value)¶
-
void lv_style_set_min_width(lv_style_t *style, lv_coord_t value)¶
-
void lv_style_set_max_width(lv_style_t *style, lv_coord_t value)¶
-
void lv_style_set_height(lv_style_t *style, lv_coord_t value)¶
-
void lv_style_set_min_height(lv_style_t *style, lv_coord_t value)¶
-
void lv_style_set_max_height(lv_style_t *style, lv_coord_t value)¶
-
void lv_style_set_x(lv_style_t *style, lv_coord_t value)¶
-
void lv_style_set_y(lv_style_t *style, lv_coord_t value)¶
-
void lv_style_set_align(lv_style_t *style, lv_align_t value)¶
-
void lv_style_set_transform_width(lv_style_t *style, lv_coord_t value)¶
-
void lv_style_set_transform_height(lv_style_t *style, lv_coord_t value)¶
-
void lv_style_set_translate_x(lv_style_t *style, lv_coord_t value)¶
-
void lv_style_set_translate_y(lv_style_t *style, lv_coord_t value)¶
-
void lv_style_set_transform_zoom(lv_style_t *style, lv_coord_t value)¶
-
void lv_style_set_transform_angle(lv_style_t *style, lv_coord_t value)¶
-
void lv_style_set_transform_pivot_x(lv_style_t *style, lv_coord_t value)¶
-
void lv_style_set_transform_pivot_y(lv_style_t *style, lv_coord_t value)¶
-
void lv_style_set_pad_top(lv_style_t *style, lv_coord_t value)¶
-
void lv_style_set_pad_bottom(lv_style_t *style, lv_coord_t value)¶
-
void lv_style_set_pad_left(lv_style_t *style, lv_coord_t value)¶
-
void lv_style_set_pad_right(lv_style_t *style, lv_coord_t value)¶
-
void lv_style_set_pad_row(lv_style_t *style, lv_coord_t value)¶
-
void lv_style_set_pad_column(lv_style_t *style, lv_coord_t value)¶
-
void lv_style_set_bg_color(lv_style_t *style, lv_color_t value)¶
-
void lv_style_set_bg_opa(lv_style_t *style, lv_opa_t value)¶
-
void lv_style_set_bg_grad_color(lv_style_t *style, lv_color_t value)¶
-
void lv_style_set_bg_grad_dir(lv_style_t *style, lv_grad_dir_t value)¶
-
void lv_style_set_bg_main_stop(lv_style_t *style, lv_coord_t value)¶
-
void lv_style_set_bg_grad_stop(lv_style_t *style, lv_coord_t value)¶
-
void lv_style_set_bg_grad(lv_style_t *style, const lv_grad_dsc_t *value)¶
-
void lv_style_set_bg_dither_mode(lv_style_t *style, lv_dither_mode_t value)¶
-
void lv_style_set_bg_img_src(lv_style_t *style, const void *value)¶
-
void lv_style_set_bg_img_opa(lv_style_t *style, lv_opa_t value)¶
-
void lv_style_set_bg_img_recolor(lv_style_t *style, lv_color_t value)¶
-
void lv_style_set_bg_img_recolor_opa(lv_style_t *style, lv_opa_t value)¶
-
void lv_style_set_bg_img_tiled(lv_style_t *style, bool value)¶
-
void lv_style_set_border_color(lv_style_t *style, lv_color_t value)¶
-
void lv_style_set_border_opa(lv_style_t *style, lv_opa_t value)¶
-
void lv_style_set_border_width(lv_style_t *style, lv_coord_t value)¶
-
void lv_style_set_border_side(lv_style_t *style, lv_border_side_t value)¶
-
void lv_style_set_border_post(lv_style_t *style, bool value)¶
-
void lv_style_set_outline_width(lv_style_t *style, lv_coord_t value)¶
-
void lv_style_set_outline_color(lv_style_t *style, lv_color_t value)¶
-
void lv_style_set_outline_opa(lv_style_t *style, lv_opa_t value)¶
-
void lv_style_set_outline_pad(lv_style_t *style, lv_coord_t value)¶
-
void lv_style_set_shadow_width(lv_style_t *style, lv_coord_t value)¶
-
void lv_style_set_shadow_ofs_x(lv_style_t *style, lv_coord_t value)¶
-
void lv_style_set_shadow_ofs_y(lv_style_t *style, lv_coord_t value)¶
-
void lv_style_set_shadow_spread(lv_style_t *style, lv_coord_t value)¶
-
void lv_style_set_shadow_color(lv_style_t *style, lv_color_t value)¶
-
void lv_style_set_shadow_opa(lv_style_t *style, lv_opa_t value)¶
-
void lv_style_set_img_opa(lv_style_t *style, lv_opa_t value)¶
-
void lv_style_set_img_recolor(lv_style_t *style, lv_color_t value)¶
-
void lv_style_set_img_recolor_opa(lv_style_t *style, lv_opa_t value)¶
-
void lv_style_set_line_width(lv_style_t *style, lv_coord_t value)¶
-
void lv_style_set_line_dash_width(lv_style_t *style, lv_coord_t value)¶
-
void lv_style_set_line_dash_gap(lv_style_t *style, lv_coord_t value)¶
-
void lv_style_set_line_rounded(lv_style_t *style, bool value)¶
-
void lv_style_set_line_color(lv_style_t *style, lv_color_t value)¶
-
void lv_style_set_line_opa(lv_style_t *style, lv_opa_t value)¶
-
void lv_style_set_arc_width(lv_style_t *style, lv_coord_t value)¶
-
void lv_style_set_arc_rounded(lv_style_t *style, bool value)¶
-
void lv_style_set_arc_color(lv_style_t *style, lv_color_t value)¶
-
void lv_style_set_arc_opa(lv_style_t *style, lv_opa_t value)¶
-
void lv_style_set_arc_img_src(lv_style_t *style, const void *value)¶
-
void lv_style_set_text_color(lv_style_t *style, lv_color_t value)¶
-
void lv_style_set_text_opa(lv_style_t *style, lv_opa_t value)¶
-
void lv_style_set_text_font(lv_style_t *style, const lv_font_t *value)¶
-
void lv_style_set_text_letter_space(lv_style_t *style, lv_coord_t value)¶
-
void lv_style_set_text_line_space(lv_style_t *style, lv_coord_t value)¶
-
void lv_style_set_text_decor(lv_style_t *style, lv_text_decor_t value)¶
-
void lv_style_set_text_align(lv_style_t *style, lv_text_align_t value)¶
-
void lv_style_set_radius(lv_style_t *style, lv_coord_t value)¶
-
void lv_style_set_clip_corner(lv_style_t *style, bool value)¶
-
void lv_style_set_opa(lv_style_t *style, lv_opa_t value)¶
-
void lv_style_set_opa_layered(lv_style_t *style, lv_opa_t value)¶
-
void lv_style_set_color_filter_dsc(lv_style_t *style, const lv_color_filter_dsc_t *value)¶
-
void lv_style_set_color_filter_opa(lv_style_t *style, lv_opa_t value)¶
-
void lv_style_set_anim(lv_style_t *style, const lv_anim_t *value)¶
-
void lv_style_set_anim_time(lv_style_t *style, uint32_t value)¶
-
void lv_style_set_anim_speed(lv_style_t *style, uint32_t value)¶
-
void lv_style_set_transition(lv_style_t *style, const lv_style_transition_dsc_t *value)¶
-
void lv_style_set_blend_mode(lv_style_t *style, lv_blend_mode_t value)¶
-
void lv_style_set_layout(lv_style_t *style, uint16_t value)¶
-
void lv_style_set_base_dir(lv_style_t *style, lv_base_dir_t value)¶