lv_style.h

API reference for lv_style.h

Report on GitHub
See Also: Private HeaderThis header has a companion private implementation with internal data structures.lv_style_private.h

Functions

lv_style_set_prop

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()

 
void lv_style_set_prop(lv_style_t *style, lv_style_prop_t prop, lv_style_value_t value)
Parameters
NameTypeDescription
stylelv_style_t *pointer to style
proplv_style_prop_tthe ID of a property (e.g. LV_STYLE_BG_COLOR)
valuelv_style_value_tlv_style_value_t variable in which a field is set according to the type of prop

lv_style_set_size

Set styles width and height.

 
static void lv_style_set_size(lv_style_t *style, int32_t width, int32_t height)
Parameters
NameTypeDescription
stylelv_style_t *pointer to style to be modified
widthint32_twidth in pixels
heightint32_theight in pixels

lv_style_set_pad_all

Set all 4 of styles padding values.

 
static void lv_style_set_pad_all(lv_style_t *style, int32_t value)
Parameters
NameTypeDescription
stylelv_style_t *pointer to style to be modified
valueint32_tpadding dimension in pixels

lv_style_set_pad_hor

Set styles left and right padding values.

 
static void lv_style_set_pad_hor(lv_style_t *style, int32_t value)
Parameters
NameTypeDescription
stylelv_style_t *pointer to style to be modified
valueint32_tpadding dimension in pixels

lv_style_set_pad_ver

Set styles top and bottom padding values.

 
static void lv_style_set_pad_ver(lv_style_t *style, int32_t value)
Parameters
NameTypeDescription
stylelv_style_t *pointer to style to be modified
valueint32_tpadding dimension in pixels

lv_style_set_pad_gap

Set styles row and column padding gaps (applies only to Grid and Flex layouts).

 
static void lv_style_set_pad_gap(lv_style_t *style, int32_t value)
Parameters
NameTypeDescription
stylelv_style_t *pointer to style to be modified
valueint32_tgap dimension in pixels

lv_style_set_margin_hor

Set styles left and right margin values.

 
static void lv_style_set_margin_hor(lv_style_t *style, int32_t value)
Parameters
NameTypeDescription
stylelv_style_t *pointer to style to be modified
valueint32_tmargin dimension in pixels

lv_style_set_margin_ver

Set styles top and bottom margin values.

 
static void lv_style_set_margin_ver(lv_style_t *style, int32_t value)
Parameters
NameTypeDescription
stylelv_style_t *pointer to style to be modified
valueint32_tmargin dimension in pixels

lv_style_set_margin_all

Set all 4 of styles margin values.

 
static void lv_style_set_margin_all(lv_style_t *style, int32_t value)
Parameters
NameTypeDescription
stylelv_style_t *pointer to style to be modified
valueint32_tmargin dimension in pixels

lv_style_set_transform_scale

Set styles X and Y transform scale values.

 
static void lv_style_set_transform_scale(lv_style_t *style, int32_t value)
Parameters
NameTypeDescription
stylelv_style_t *pointer to style to be modified
valueint32_tscale factor. Example values:
- 256 or LV_SCALE_NONE: no zoom
- <256: scale down
- >256: scale up
- 128: half size
- 512: double size

Enums

lv_blend_mode_t

Possible options for blending opaque drawings

NameDescription
LV_BLEND_MODE_NORMALSimply mix according to the opacity value
LV_BLEND_MODE_ADDITIVEAdd the respective color channels
LV_BLEND_MODE_SUBTRACTIVESubtract the foreground from the background
LV_BLEND_MODE_MULTIPLYMultiply the foreground and background
LV_BLEND_MODE_DIFFERENCEAbsolute difference between foreground and background
Used by 5 functions
  • lv_obj_set_style_blend_mode — param value
  • lv_nemagfx_blending_mode — param lv_blend_mode
  • lv_vg_lite_blend_mode — param blend_mode
  • lv_style_set_blend_mode — param value
  • lv_image_set_blend_mode — param blend_mode

lv_text_decor_t

Some options to apply decorations on texts. 'OR'ed values can be used.

NameValue
LV_TEXT_DECOR_NONE0x00
LV_TEXT_DECOR_UNDERLINE0x01
LV_TEXT_DECOR_STRIKETHROUGH0x02
Used by 2 functions
  • lv_obj_set_style_text_decor — param value
  • lv_style_set_text_decor — param value

lv_border_side_t

Selects on which sides border should be drawn 'OR'ed values can be used.

NameValueDescription
LV_BORDER_SIDE_NONE0x00
LV_BORDER_SIDE_BOTTOM0x01
LV_BORDER_SIDE_TOP0x02
LV_BORDER_SIDE_LEFT0x04
LV_BORDER_SIDE_RIGHT0x08
LV_BORDER_SIDE_FULL0x0F
LV_BORDER_SIDE_INTERNAL0x10FOR matrix-like objects (e.g. Button matrix)
Used by 2 functions
  • lv_obj_set_style_border_side — param value
  • lv_style_set_border_side — param value

lv_blur_quality_t

NameValueDescription
LV_BLUR_QUALITY_AUTO0Set the quality automatically
LV_BLUR_QUALITY_SPEEDPrefer speed over precision
LV_BLUR_QUALITY_PRECISIONPrefer precision over speed
Used by 4 functions
  • lv_obj_set_style_blur_quality — param value
  • lv_obj_set_style_drop_shadow_quality — param value
  • lv_style_set_blur_quality — param value
  • lv_style_set_drop_shadow_quality — param value

_lv_style_id_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.

NameValue
LV_STYLE_PROP_INV0
LV_STYLE_WIDTH1
LV_STYLE_HEIGHT
LV_STYLE_LENGTH
LV_STYLE_TRANSFORM_WIDTH
LV_STYLE_TRANSFORM_HEIGHT
LV_STYLE_MIN_WIDTH8
LV_STYLE_MAX_WIDTH
LV_STYLE_MIN_HEIGHT
LV_STYLE_MAX_HEIGHT
LV_STYLE_TRANSLATE_X
LV_STYLE_TRANSLATE_Y
LV_STYLE_RADIAL_OFFSET
LV_STYLE_X16
LV_STYLE_Y
LV_STYLE_ALIGN
LV_STYLE_PAD_TOP24
LV_STYLE_PAD_BOTTOM
LV_STYLE_PAD_LEFT
LV_STYLE_PAD_RIGHT
LV_STYLE_PAD_RADIAL
LV_STYLE_PAD_ROW
LV_STYLE_PAD_COLUMN
LV_STYLE_MARGIN_TOP32
LV_STYLE_MARGIN_BOTTOM
LV_STYLE_MARGIN_LEFT
LV_STYLE_MARGIN_RIGHT
LV_STYLE_BG_GRAD40
LV_STYLE_BG_GRAD_DIR
LV_STYLE_BG_MAIN_OPA
LV_STYLE_BG_GRAD_OPA
LV_STYLE_BG_GRAD_COLOR
LV_STYLE_BG_MAIN_STOP
LV_STYLE_BG_GRAD_STOP
LV_STYLE_BG_IMAGE_SRC48
LV_STYLE_BG_IMAGE_OPA
LV_STYLE_BG_IMAGE_RECOLOR_OPA
LV_STYLE_BG_IMAGE_TILED
LV_STYLE_BG_IMAGE_RECOLOR
LV_STYLE_BORDER_WIDTH56
LV_STYLE_BORDER_COLOR
LV_STYLE_BORDER_OPA
LV_STYLE_BORDER_POST
LV_STYLE_BORDER_SIDE
LV_STYLE_OUTLINE_WIDTH64
LV_STYLE_OUTLINE_COLOR
LV_STYLE_OUTLINE_OPA
LV_STYLE_OUTLINE_PAD
LV_STYLE_BG_OPA72
LV_STYLE_BG_COLOR
LV_STYLE_SHADOW_WIDTH
LV_STYLE_LINE_WIDTH
LV_STYLE_ARC_WIDTH
LV_STYLE_TEXT_FONT
LV_STYLE_IMAGE_RECOLOR_OPA
LV_STYLE_IMAGE_OPA80
LV_STYLE_SHADOW_OPA
LV_STYLE_LINE_OPA
LV_STYLE_ARC_OPA
LV_STYLE_TEXT_OPA
LV_STYLE_SHADOW_COLOR88
LV_STYLE_IMAGE_RECOLOR
LV_STYLE_LINE_COLOR
LV_STYLE_ARC_COLOR
LV_STYLE_TEXT_COLOR
LV_STYLE_ARC_IMAGE_SRC96
LV_STYLE_SHADOW_OFFSET_X
LV_STYLE_SHADOW_OFFSET_Y
LV_STYLE_SHADOW_SPREAD
LV_STYLE_LINE_DASH_WIDTH
LV_STYLE_TEXT_ALIGN
LV_STYLE_TEXT_LETTER_SPACE
LV_STYLE_TEXT_LINE_SPACE
LV_STYLE_LINE_DASH_GAP104
LV_STYLE_LINE_ROUNDED
LV_STYLE_IMAGE_COLORKEY
LV_STYLE_TEXT_OUTLINE_STROKE_WIDTH
LV_STYLE_TEXT_OUTLINE_STROKE_OPA
LV_STYLE_TEXT_OUTLINE_STROKE_COLOR
LV_STYLE_TEXT_DECOR
LV_STYLE_ARC_ROUNDED
LV_STYLE_OPA112
LV_STYLE_OPA_LAYERED
LV_STYLE_COLOR_FILTER_DSC
LV_STYLE_COLOR_FILTER_OPA
LV_STYLE_ANIM
LV_STYLE_ANIM_DURATION
LV_STYLE_TRANSITION
LV_STYLE_RADIUS120
LV_STYLE_BITMAP_MASK_SRC
LV_STYLE_BLEND_MODE
LV_STYLE_ROTARY_SENSITIVITY
LV_STYLE_TRANSLATE_RADIAL
LV_STYLE_CLIP_CORNER128
LV_STYLE_BASE_DIR
LV_STYLE_RECOLOR
LV_STYLE_RECOLOR_OPA
LV_STYLE_LAYOUT
LV_STYLE_BLUR_RADIUS136
LV_STYLE_BLUR_BACKDROP
LV_STYLE_BLUR_QUALITY
LV_STYLE_DROP_SHADOW_RADIUS144
LV_STYLE_DROP_SHADOW_OFFSET_X
LV_STYLE_DROP_SHADOW_OFFSET_Y
LV_STYLE_DROP_SHADOW_COLOR
LV_STYLE_DROP_SHADOW_OPA
LV_STYLE_DROP_SHADOW_QUALITY
LV_STYLE_TRANSFORM_SCALE_X152
LV_STYLE_TRANSFORM_SCALE_Y
LV_STYLE_TRANSFORM_PIVOT_X
LV_STYLE_TRANSFORM_PIVOT_Y
LV_STYLE_TRANSFORM_ROTATION
LV_STYLE_TRANSFORM_SKEW_X
LV_STYLE_TRANSFORM_SKEW_Y
LV_STYLE_FLEX_FLOW160
LV_STYLE_FLEX_MAIN_PLACE
LV_STYLE_FLEX_CROSS_PLACE
LV_STYLE_FLEX_TRACK_PLACE
LV_STYLE_FLEX_GROW
LV_STYLE_GRID_COLUMN_DSC_ARRAY
LV_STYLE_GRID_ROW_DSC_ARRAY
LV_STYLE_GRID_COLUMN_ALIGN168
LV_STYLE_GRID_ROW_ALIGN
LV_STYLE_GRID_CELL_COLUMN_POS
LV_STYLE_GRID_CELL_COLUMN_SPAN
LV_STYLE_GRID_CELL_X_ALIGN
LV_STYLE_GRID_CELL_ROW_POS
LV_STYLE_GRID_CELL_ROW_SPAN
LV_STYLE_GRID_CELL_Y_ALIGN
LV_STYLE_TEXT_LEADING_TRIM176
LV_STYLE_LAST_BUILT_IN_PROP
LV_STYLE_NUM_BUILT_IN_PROPSLV_STYLE_LAST_BUILT_IN_PROP + 1
LV_STYLE_PROP_ANY0xFF
LV_STYLE_PROP_CONST0xFF

lv_style_res_t

Name
LV_STYLE_RES_NOT_FOUND
LV_STYLE_RES_FOUND

Structs

struct

lv_image_colorkey_t

A image colorkey definition. The transparency within the color range of [low, high] will be set to LV_OPA_TRANSP If the "enable" flag is set to true.

MemberTypeDescription
lowlv_color_t
highlv_color_t
Used by 3 functions
  • lv_obj_set_style_image_colorkey — param value
  • lv_vg_lite_set_color_key — param colorkey
  • lv_style_set_image_colorkey — param value
struct

lv_style_value_t

A common type to handle all the property types in the same way.

MemberTypeDescription
numint32_tNumber integer number (opacity, enums, booleans or "normal" numbers)
ptrconst void *Constant pointers (font, cone text, etc)
colorlv_color_tColors
Used by 6 functions
  • lv_obj_set_local_style_prop — param value
  • lv_obj_get_local_style_prop — param value
  • lv_obj_style_apply_color_filter — param v
  • lv_style_set_prop — param value
  • lv_style_get_prop — param value
  • lv_style_get_prop_inlined — param value
struct

lv_style_transition_dsc_t

Descriptor for style transitions

MemberTypeDescription
propsconst lv_style_prop_t *An array with the properties to animate.
user_datavoid *A custom user data that will be passed to the animation's user_data
path_xcblv_anim_path_cb_tA path for the animation.
timeuint32_tDuration of the transition in [ms]
delayuint32_tDelay before the transition in [ms]
Used by 3 functions
  • lv_obj_set_style_transition — param value
  • lv_style_transition_dsc_init — param tr
  • lv_style_set_transition — param value
struct

lv_style_const_prop_t

Descriptor of a constant style property.

MemberTypeDescription
proplv_style_prop_t
valuelv_style_value_t
struct

lv_style_t

Descriptor of a style (a collection of properties and values).

MemberTypeDescription
sentineluint32_t
values_and_propsvoid *
has_groupuint32_t
prop_cntuint8_t255 means it's a constant style
Used by 163 functions
  • lv_obj_add_style — param style
  • lv_obj_replace_style — param old_style
  • lv_obj_replace_style — param new_style
  • lv_obj_remove_style — param style
  • lv_obj_report_style_change — param style
  • lv_obj_style_set_disabled — param style
  • lv_obj_style_get_disabled — param style
  • lv_obj_bind_style — param style
  • lv_style_init — param style
  • lv_style_reset — param style
  • lv_style_copy — param dst
  • lv_style_copy — param src
  • lv_style_merge — param dst
  • lv_style_merge — param src
  • lv_style_is_const — param style
  • lv_style_remove_prop — param style
  • lv_style_set_prop — param style
  • lv_style_get_prop — param style
  • lv_style_get_prop_inlined — param style
  • lv_style_is_empty — param style
  • lv_style_set_size — param style
  • lv_style_set_pad_all — param style
  • lv_style_set_pad_hor — param style
  • lv_style_set_pad_ver — param style
  • lv_style_set_pad_gap — param style
  • lv_style_set_margin_hor — param style
  • lv_style_set_margin_ver — param style
  • lv_style_set_margin_all — param style
  • lv_style_set_transform_scale — param style
  • lv_style_set_width — param style
  • lv_style_set_min_width — param style
  • lv_style_set_max_width — param style
  • lv_style_set_height — param style
  • lv_style_set_min_height — param style
  • lv_style_set_max_height — param style
  • lv_style_set_length — param style
  • lv_style_set_x — param style
  • lv_style_set_y — param style
  • lv_style_set_align — param style
  • lv_style_set_transform_width — param style
  • lv_style_set_transform_height — param style
  • lv_style_set_translate_x — param style
  • lv_style_set_translate_y — param style
  • lv_style_set_translate_radial — param style
  • lv_style_set_transform_scale_x — param style
  • lv_style_set_transform_scale_y — param style
  • lv_style_set_transform_rotation — param style
  • lv_style_set_transform_pivot_x — param style
  • lv_style_set_transform_pivot_y — param style
  • lv_style_set_transform_skew_x — param style
  • lv_style_set_transform_skew_y — param style
  • lv_style_set_pad_top — param style
  • lv_style_set_pad_bottom — param style
  • lv_style_set_pad_left — param style
  • lv_style_set_pad_right — param style
  • lv_style_set_pad_row — param style
  • lv_style_set_pad_column — param style
  • lv_style_set_pad_radial — param style
  • lv_style_set_margin_top — param style
  • lv_style_set_margin_bottom — param style
  • lv_style_set_margin_left — param style
  • lv_style_set_margin_right — param style
  • lv_style_set_bg_color — param style
  • lv_style_set_bg_opa — param style
  • lv_style_set_bg_grad_color — param style
  • lv_style_set_bg_grad_dir — param style
  • lv_style_set_bg_main_stop — param style
  • lv_style_set_bg_grad_stop — param style
  • lv_style_set_bg_main_opa — param style
  • lv_style_set_bg_grad_opa — param style
  • lv_style_set_bg_grad — param style
  • lv_style_set_bg_image_src — param style
  • lv_style_set_bg_image_opa — param style
  • lv_style_set_bg_image_recolor — param style
  • lv_style_set_bg_image_recolor_opa — param style
  • lv_style_set_bg_image_tiled — param style
  • lv_style_set_border_color — param style
  • lv_style_set_border_opa — param style
  • lv_style_set_border_width — param style
  • lv_style_set_border_side — param style
  • lv_style_set_border_post — param style
  • lv_style_set_outline_width — param style
  • lv_style_set_outline_color — param style
  • lv_style_set_outline_opa — param style
  • lv_style_set_outline_pad — param style
  • lv_style_set_shadow_width — param style
  • lv_style_set_shadow_offset_x — param style
  • lv_style_set_shadow_offset_y — param style
  • lv_style_set_shadow_spread — param style
  • lv_style_set_shadow_color — param style
  • lv_style_set_shadow_opa — param style
  • lv_style_set_image_opa — param style
  • lv_style_set_image_recolor — param style
  • lv_style_set_image_recolor_opa — param style
  • lv_style_set_image_colorkey — param style
  • lv_style_set_line_width — param style
  • lv_style_set_line_dash_width — param style
  • lv_style_set_line_dash_gap — param style
  • lv_style_set_line_rounded — param style
  • lv_style_set_line_color — param style
  • lv_style_set_line_opa — param style
  • lv_style_set_arc_width — param style
  • lv_style_set_arc_rounded — param style
  • lv_style_set_arc_color — param style
  • lv_style_set_arc_opa — param style
  • lv_style_set_arc_image_src — param style
  • lv_style_set_text_color — param style
  • lv_style_set_text_opa — param style
  • lv_style_set_text_font — param style
  • lv_style_set_text_letter_space — param style
  • lv_style_set_text_line_space — param style
  • lv_style_set_text_decor — param style
  • lv_style_set_text_align — param style
  • lv_style_set_text_outline_stroke_color — param style
  • lv_style_set_text_outline_stroke_width — param style
  • lv_style_set_text_outline_stroke_opa — param style
  • lv_style_set_text_leading_trim — param style
  • lv_style_set_blur_radius — param style
  • lv_style_set_blur_backdrop — param style
  • lv_style_set_blur_quality — param style
  • lv_style_set_drop_shadow_radius — param style
  • lv_style_set_drop_shadow_offset_x — param style
  • lv_style_set_drop_shadow_offset_y — param style
  • lv_style_set_drop_shadow_color — param style
  • lv_style_set_drop_shadow_opa — param style
  • lv_style_set_drop_shadow_quality — param style
  • lv_style_set_radius — param style
  • lv_style_set_radial_offset — param style
  • lv_style_set_clip_corner — param style
  • lv_style_set_opa — param style
  • lv_style_set_opa_layered — param style
  • lv_style_set_color_filter_dsc — param style
  • lv_style_set_color_filter_opa — param style
  • lv_style_set_recolor — param style
  • lv_style_set_recolor_opa — param style
  • lv_style_set_anim — param style
  • lv_style_set_anim_duration — param style
  • lv_style_set_transition — param style
  • lv_style_set_blend_mode — param style
  • lv_style_set_layout — param style
  • lv_style_set_base_dir — param style
  • lv_style_set_bitmap_mask_src — param style
  • lv_style_set_rotary_sensitivity — param style
  • lv_style_set_flex_flow — param style
  • lv_style_set_flex_main_place — param style
  • lv_style_set_flex_cross_place — param style
  • lv_style_set_flex_track_place — param style
  • lv_style_set_flex_grow — param style
  • lv_style_set_grid_column_dsc_array — param style
  • lv_style_set_grid_column_align — param style
  • lv_style_set_grid_row_dsc_array — param style
  • lv_style_set_grid_row_align — param style
  • lv_style_set_grid_cell_column_pos — param style
  • lv_style_set_grid_cell_x_align — param style
  • lv_style_set_grid_cell_column_span — param style
  • lv_style_set_grid_cell_row_pos — param style
  • lv_style_set_grid_cell_y_align — param style
  • lv_style_set_grid_cell_row_span — param style
  • lv_scale_section_set_style — param section_part_style
  • lv_scale_set_section_style_main — param style
  • lv_scale_set_section_style_indicator — param style
  • lv_scale_set_section_style_items — param style
  • lv_spangroup_set_span_style — param style

Macros

LV_STYLE_SENTINEL_VALUE

 
#define LV_STYLE_SENTINEL_VALUE 0xAABBCCDD

LV_STYLE_PROP_FLAG_NONE

 
#define LV_STYLE_PROP_FLAG_NONE (0)

No special behavior

LV_STYLE_PROP_FLAG_INHERITABLE

 
#define LV_STYLE_PROP_FLAG_INHERITABLE (1 << 0)

Inherited

LV_STYLE_PROP_FLAG_EXT_DRAW_UPDATE

 
#define LV_STYLE_PROP_FLAG_EXT_DRAW_UPDATE (1 << 1)

Requires ext. draw size update when changed

LV_STYLE_PROP_FLAG_LAYOUT_UPDATE

 
#define LV_STYLE_PROP_FLAG_LAYOUT_UPDATE (1 << 2)

Requires layout update when changed

LV_STYLE_PROP_FLAG_PARENT_LAYOUT_UPDATE

 
#define LV_STYLE_PROP_FLAG_PARENT_LAYOUT_UPDATE (1 << 3)

Requires layout update on parent when changed

LV_STYLE_PROP_FLAG_LAYER_UPDATE

 
#define LV_STYLE_PROP_FLAG_LAYER_UPDATE (1 << 4)

Affects layer handling

LV_STYLE_PROP_FLAG_TRANSFORM

 
#define LV_STYLE_PROP_FLAG_TRANSFORM (1 << 5)

Affects the object's transformation

LV_STYLE_PROP_FLAG_ALL

 
#define LV_STYLE_PROP_FLAG_ALL (0x3F)

Indicating all flags

LV_SCALE_NONE

 
#define LV_SCALE_NONE 256

Value for not zooming the image

LV_STYLE_CONST_INIT

 
#define LV_STYLE_CONST_INIT(var_name, prop_array) \
    const lv_style_t var_name = { \
            .sentinel = LV_STYLE_SENTINEL_VALUE, \
            .values_and_props = (void*)prop_array, \
            .has_group = 0xFFFFFFFF, \
            .prop_cnt = 255 \
        }

LV_STYLE_CONST_PROPS_END

 
#define LV_STYLE_CONST_PROPS_END { .prop = LV_STYLE_PROP_INV, .value = { .num = 0 } }

LV_GRAD_LEFT

 
#define LV_GRAD_LEFT LV_PCT(0)

LV_GRAD_RIGHT

 
#define LV_GRAD_RIGHT LV_PCT(100)

LV_GRAD_TOP

 
#define LV_GRAD_TOP LV_PCT(0)

LV_GRAD_BOTTOM

 
#define LV_GRAD_BOTTOM LV_PCT(100)

LV_GRAD_CENTER

 
#define LV_GRAD_CENTER LV_PCT(50)

LV_ASSERT_STYLE

 
#define LV_ASSERT_STYLE(style_p) \
    do { \
            LV_ASSERT_MSG(style_p != NULL, "The style is NULL"); \
            LV_ASSERT_MSG(style_p->sentinel == LV_STYLE_SENTINEL_VALUE, "Style is not initialized or corrupted"); \
        } while(0)

Variables

lv_style_const_prop_id_inv

 
const lv_style_prop_t lv_style_const_prop_id_inv

Dependencies

How is this guide?

Last updated on

On this page