feat(style): add length style property (#5135)

docs/overview/style-props.md

@@ -57,6 +57,15 @@ Sets a maximal height. Pixel and percentage values can be used. Percentage value
 <li style='display:inline; margin-right: 20px; margin-left: 0px'><strong>Ext. draw</strong> No</li>
 </ul>
 
+### length
+Its meaning depends on the type of the widget. For example in case of lv_scale it means the length of the ticks.
+<ul>
+<li style='display:inline; margin-right: 20px; margin-left: 0px'><strong>Default</strong> 0</li>
+<li style='display:inline; margin-right: 20px; margin-left: 0px'><strong>Inherited</strong> No</li>
+<li style='display:inline; margin-right: 20px; margin-left: 0px'><strong>Layout</strong> No</li>
+<li style='display:inline; margin-right: 20px; margin-left: 0px'><strong>Ext. draw</strong> Yes</li>
+</ul>
+
 ### x
 Set the X coordinate of the object considering the set `align`. Pixel and percentage values can be used. Percentage values are relative to the width of the parent's content area.
 <ul>
@@ -244,7 +253,7 @@ Sets the padding between the columns. Used by the layouts.
 Properties to describe spacing around an object. Very similar to the margin properties in HTML.
 
 ### margin_top
-Sets the margin on the top. The object will keep this space from its siblings in layouts. 
+Sets the margin on the top. The object will keep this space from its siblings in layouts.
 <ul>
 <li style='display:inline; margin-right: 20px; margin-left: 0px'><strong>Default</strong> 0</li>
 <li style='display:inline; margin-right: 20px; margin-left: 0px'><strong>Inherited</strong> No</li>
@@ -460,7 +469,7 @@ Sets whether the border should be drawn before or after the children are drawn.
 Properties to describe the outline. It's like a border but drawn outside of the rectangles.
 
 ### outline_width
-Set the width of the outline in pixels. 
+Set the width of the outline in pixels.
 <ul>
 <li style='display:inline; margin-right: 20px; margin-left: 0px'><strong>Default</strong> 0</li>
 <li style='display:inline; margin-right: 20px; margin-left: 0px'><strong>Inherited</strong> No</li>
@@ -508,7 +517,7 @@ Set the width of the shadow in pixels. The value should be >= 0.
 </ul>
 
 ### shadow_offset_x
-Set an offset on the shadow in pixels in X direction. 
+Set an offset on the shadow in pixels in X direction.
 <ul>
 <li style='display:inline; margin-right: 20px; margin-left: 0px'><strong>Default</strong> 0</li>
 <li style='display:inline; margin-right: 20px; margin-left: 0px'><strong>Inherited</strong> No</li>
@@ -517,7 +526,7 @@ Set an offset on the shadow in pixels in X direction.
 </ul>
 
 ### shadow_offset_y
-Set an offset on the shadow in pixels in Y direction. 
+Set an offset on the shadow in pixels in Y direction.
 <ul>
 <li style='display:inline; margin-right: 20px; margin-left: 0px'><strong>Default</strong> 0</li>
 <li style='display:inline; margin-right: 20px; margin-left: 0px'><strong>Inherited</strong> No</li>
@@ -613,7 +622,7 @@ Set the gap between dashes in pixel. Note that dash works only on horizontal and
 </ul>
 
 ### line_rounded
-Make the end points of the lines rounded. `true`: rounded, `false`: perpendicular line ending 
+Make the end points of the lines rounded. `true`: rounded, `false`: perpendicular line ending
 <ul>
 <li style='display:inline; margin-right: 20px; margin-left: 0px'><strong>Default</strong> 0</li>
 <li style='display:inline; margin-right: 20px; margin-left: 0px'><strong>Inherited</strong> No</li>
@@ -652,7 +661,7 @@ Set the width (thickness) of the arcs in pixel.
 </ul>
 
 ### arc_rounded
-Make the end points of the arcs rounded. `true`: rounded, `false`: perpendicular line ending 
+Make the end points of the arcs rounded. `true`: rounded, `false`: perpendicular line ending
 <ul>
 <li style='display:inline; margin-right: 20px; margin-left: 0px'><strong>Default</strong> 0</li>
 <li style='display:inline; margin-right: 20px; margin-left: 0px'><strong>Inherited</strong> No</li>
@@ -709,7 +718,7 @@ Set the opacity of the text. Value 0, `LV_OPA_0` or `LV_OPA_TRANSP` means fully
 </ul>
 
 ### text_font
-Set the font of the text (a pointer `lv_font_t *`). 
+Set the font of the text (a pointer `lv_font_t *`).
 <ul>
 <li style='display:inline; margin-right: 20px; margin-left: 0px'><strong>Default</strong> `LV_FONT_DEFAULT`</li>
 <li style='display:inline; margin-right: 20px; margin-left: 0px'><strong>Inherited</strong> Yes</li>

scripts/style_api_gen.py

@@ -30,6 +30,10 @@ props = [
  'style_type': 'num',   'var_type': 'int32_t' , 'default':'LV_COORD_MAX', 'inherited': 0, 'layout': 1, 'ext_draw': 0,
  'dsc': "Sets a maximal height. Pixel and percentage values can be used. Percentage values are relative to the height of the parent's content area."},
 
+{'name': 'LENGTH',
+ 'style_type': 'num',   'var_type': 'int32_t' , 'default':'0', 'inherited': 0, 'layout': 0, 'ext_draw': 1,
+ 'dsc': "Its meaning depends on the type of the widget. For example in case of lv_scale it means the length of the ticks."},
+
 {'name': 'X',
  'style_type': 'num',   'var_type': 'int32_t' , 'default':0, 'inherited': 0, 'layout': 1, 'ext_draw': 0,
  'dsc': "Set the X coordinate of the object considering the set `align`. Pixel and percentage values can be used. Percentage values are relative to the width of the parent's content area."},

src/core/lv_obj_style_gen.c

@@ -6,10 +6,8 @@
  **********************************************************************
  */
 
-
 #include "lv_obj.h"
 
-
 void lv_obj_set_style_width(struct _lv_obj_t * obj, int32_t value, lv_style_selector_t selector)
 {
     lv_style_value_t v = {
@@ -58,6 +56,14 @@ void lv_obj_set_style_max_height(struct _lv_obj_t * obj, int32_t value, lv_style
     lv_obj_set_local_style_prop(obj, LV_STYLE_MAX_HEIGHT, v, selector);
 }
 
+void lv_obj_set_style_length(struct _lv_obj_t * obj, int32_t value, lv_style_selector_t selector)
+{
+    lv_style_value_t v = {
+        .num = (int32_t)value
+    };
+    lv_obj_set_local_style_prop(obj, LV_STYLE_LENGTH, v, selector);
+}
+
 void lv_obj_set_style_x(struct _lv_obj_t * obj, int32_t value, lv_style_selector_t selector)
 {
     lv_style_value_t v = {
@@ -682,7 +688,8 @@ void lv_obj_set_style_opa_layered(struct _lv_obj_t * obj, lv_opa_t value, lv_sty
     lv_obj_set_local_style_prop(obj, LV_STYLE_OPA_LAYERED, v, 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_dsc(struct _lv_obj_t * obj, const lv_color_filter_dsc_t * value,
+                                       lv_style_selector_t selector)
 {
     lv_style_value_t v = {
         .ptr = value
@@ -714,7 +721,8 @@ void lv_obj_set_style_anim_time(struct _lv_obj_t * obj, uint32_t value, lv_style
     lv_obj_set_local_style_prop(obj, LV_STYLE_ANIM_TIME, v, 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_transition(struct _lv_obj_t * obj, const lv_style_transition_dsc_t * value,
+                                 lv_style_selector_t selector)
 {
     lv_style_value_t v = {
         .ptr = value

src/core/lv_obj_style_gen.h

@@ -6,7 +6,6 @@
  **********************************************************************
  */
 
-
 #ifndef LV_OBJ_STYLE_GEN_H
 #define LV_OBJ_STYLE_GEN_H
 
@@ -50,6 +49,12 @@ static inline int32_t lv_obj_get_style_max_height(const struct _lv_obj_t * obj,
     return (int32_t)v.num;
 }
 
+static inline int32_t lv_obj_get_style_length(const struct _lv_obj_t * obj, uint32_t part)
+{
+    lv_style_value_t v = lv_obj_get_style_prop(obj, part, LV_STYLE_LENGTH);
+    return (int32_t)v.num;
+}
+
 static inline int32_t lv_obj_get_style_x(const struct _lv_obj_t * obj, uint32_t part)
 {
     lv_style_value_t v = lv_obj_get_style_prop(obj, part, LV_STYLE_X);
@@ -220,7 +225,8 @@ static inline lv_color_t lv_obj_get_style_bg_grad_color(const struct _lv_obj_t *
 
 static inline lv_color_t lv_obj_get_style_bg_grad_color_filtered(const struct _lv_obj_t * obj, uint32_t part)
 {
-    lv_style_value_t v = _lv_obj_style_apply_color_filter(obj, part, lv_obj_get_style_prop(obj, part, LV_STYLE_BG_GRAD_COLOR));
+    lv_style_value_t v = _lv_obj_style_apply_color_filter(obj, part, lv_obj_get_style_prop(obj, part,
+                                                                                           LV_STYLE_BG_GRAD_COLOR));
     return v.color;
 }
 
@@ -280,7 +286,8 @@ static inline lv_color_t lv_obj_get_style_bg_image_recolor(const struct _lv_obj_
 
 static inline lv_color_t lv_obj_get_style_bg_image_recolor_filtered(const struct _lv_obj_t * obj, uint32_t part)
 {
-    lv_style_value_t v = _lv_obj_style_apply_color_filter(obj, part, lv_obj_get_style_prop(obj, part, LV_STYLE_BG_IMAGE_RECOLOR));
+    lv_style_value_t v = _lv_obj_style_apply_color_filter(obj, part, lv_obj_get_style_prop(obj, part,
+                                                                                           LV_STYLE_BG_IMAGE_RECOLOR));
     return v.color;
 }
 
@@ -304,7 +311,8 @@ static inline lv_color_t lv_obj_get_style_border_color(const struct _lv_obj_t *
 
 static inline lv_color_t lv_obj_get_style_border_color_filtered(const struct _lv_obj_t * obj, uint32_t part)
 {
-    lv_style_value_t v = _lv_obj_style_apply_color_filter(obj, part, lv_obj_get_style_prop(obj, part, LV_STYLE_BORDER_COLOR));
+    lv_style_value_t v = _lv_obj_style_apply_color_filter(obj, part, lv_obj_get_style_prop(obj, part,
+                                                                                           LV_STYLE_BORDER_COLOR));
     return v.color;
 }
 
@@ -346,7 +354,8 @@ static inline lv_color_t lv_obj_get_style_outline_color(const struct _lv_obj_t *
 
 static inline lv_color_t lv_obj_get_style_outline_color_filtered(const struct _lv_obj_t * obj, uint32_t part)
 {
-    lv_style_value_t v = _lv_obj_style_apply_color_filter(obj, part, lv_obj_get_style_prop(obj, part, LV_STYLE_OUTLINE_COLOR));
+    lv_style_value_t v = _lv_obj_style_apply_color_filter(obj, part, lv_obj_get_style_prop(obj, part,
+                                                                                           LV_STYLE_OUTLINE_COLOR));
     return v.color;
 }
 
@@ -394,7 +403,8 @@ static inline lv_color_t lv_obj_get_style_shadow_color(const struct _lv_obj_t *
 
 static inline lv_color_t lv_obj_get_style_shadow_color_filtered(const struct _lv_obj_t * obj, uint32_t part)
 {
-    lv_style_value_t v = _lv_obj_style_apply_color_filter(obj, part, lv_obj_get_style_prop(obj, part, LV_STYLE_SHADOW_COLOR));
+    lv_style_value_t v = _lv_obj_style_apply_color_filter(obj, part, lv_obj_get_style_prop(obj, part,
+                                                                                           LV_STYLE_SHADOW_COLOR));
     return v.color;
 }
 
@@ -418,7 +428,8 @@ static inline lv_color_t lv_obj_get_style_image_recolor(const struct _lv_obj_t *
 
 static inline lv_color_t lv_obj_get_style_image_recolor_filtered(const struct _lv_obj_t * obj, uint32_t part)
 {
-    lv_style_value_t v = _lv_obj_style_apply_color_filter(obj, part, lv_obj_get_style_prop(obj, part, LV_STYLE_IMAGE_RECOLOR));
+    lv_style_value_t v = _lv_obj_style_apply_color_filter(obj, part, lv_obj_get_style_prop(obj, part,
+                                                                                           LV_STYLE_IMAGE_RECOLOR));
     return v.color;
 }
 
@@ -578,7 +589,8 @@ static inline lv_opa_t lv_obj_get_style_opa_layered(const struct _lv_obj_t * obj
     return (lv_opa_t)v.num;
 }
 
-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 const lv_color_filter_dsc_t * lv_obj_get_style_color_filter_dsc(const struct _lv_obj_t * obj,
+                                                                              uint32_t part)
 {
     lv_style_value_t v = lv_obj_get_style_prop(obj, part, LV_STYLE_COLOR_FILTER_DSC);
     return (const lv_color_filter_dsc_t *)v.ptr;
@@ -722,6 +734,7 @@ void lv_obj_set_style_max_width(struct _lv_obj_t * obj, int32_t value, lv_style_
 void lv_obj_set_style_height(struct _lv_obj_t * obj, int32_t value, lv_style_selector_t selector);
 void lv_obj_set_style_min_height(struct _lv_obj_t * obj, int32_t value, lv_style_selector_t selector);
 void lv_obj_set_style_max_height(struct _lv_obj_t * obj, int32_t value, lv_style_selector_t selector);
+void lv_obj_set_style_length(struct _lv_obj_t * obj, int32_t value, lv_style_selector_t selector);
 void lv_obj_set_style_x(struct _lv_obj_t * obj, int32_t value, lv_style_selector_t selector);
 void lv_obj_set_style_y(struct _lv_obj_t * obj, int32_t value, lv_style_selector_t selector);
 void lv_obj_set_style_align(struct _lv_obj_t * obj, lv_align_t value, lv_style_selector_t selector);
@@ -800,11 +813,13 @@ void lv_obj_set_style_radius(struct _lv_obj_t * obj, int32_t value, lv_style_sel
 void lv_obj_set_style_clip_corner(struct _lv_obj_t * obj, bool value, lv_style_selector_t selector);
 void lv_obj_set_style_opa(struct _lv_obj_t * obj, lv_opa_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_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_transition(struct _lv_obj_t * obj, const lv_style_transition_dsc_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);
 void lv_obj_set_style_layout(struct _lv_obj_t * obj, uint16_t value, lv_style_selector_t selector);
 void lv_obj_set_style_base_dir(struct _lv_obj_t * obj, lv_base_dir_t value, lv_style_selector_t selector);
@@ -813,7 +828,8 @@ void lv_obj_set_style_flex_main_place(struct _lv_obj_t * obj, lv_flex_align_t va
 void lv_obj_set_style_flex_cross_place(struct _lv_obj_t * obj, lv_flex_align_t value, lv_style_selector_t selector);
 void lv_obj_set_style_flex_track_place(struct _lv_obj_t * obj, lv_flex_align_t value, lv_style_selector_t selector);
 void lv_obj_set_style_flex_grow(struct _lv_obj_t * obj, uint8_t value, lv_style_selector_t selector);
-void lv_obj_set_style_grid_column_dsc_array(struct _lv_obj_t * obj, const int32_t * value, lv_style_selector_t selector);
+void lv_obj_set_style_grid_column_dsc_array(struct _lv_obj_t * obj, const int32_t * value,
+                                            lv_style_selector_t selector);
 void lv_obj_set_style_grid_column_align(struct _lv_obj_t * obj, lv_grid_align_t value, lv_style_selector_t selector);
 void lv_obj_set_style_grid_row_dsc_array(struct _lv_obj_t * obj, const int32_t * value, lv_style_selector_t selector);
 void lv_obj_set_style_grid_row_align(struct _lv_obj_t * obj, lv_grid_align_t value, lv_style_selector_t selector);

src/misc/lv_style.c

@@ -41,6 +41,7 @@ const uint8_t _lv_style_builtin_prop_flag_lookup_table[_LV_STYLE_NUM_BUILT_IN_PR
     [LV_STYLE_HEIGHT] =                   LV_STYLE_PROP_FLAG_LAYOUT_UPDATE,
     [LV_STYLE_MIN_HEIGHT] =               LV_STYLE_PROP_FLAG_LAYOUT_UPDATE,
     [LV_STYLE_MAX_HEIGHT] =               LV_STYLE_PROP_FLAG_LAYOUT_UPDATE,
+    [LV_STYLE_LENGTH] =                   LV_STYLE_PROP_FLAG_EXT_DRAW_UPDATE,
     [LV_STYLE_X] =                        LV_STYLE_PROP_FLAG_LAYOUT_UPDATE,
     [LV_STYLE_Y] =                        LV_STYLE_PROP_FLAG_LAYOUT_UPDATE,
     [LV_STYLE_ALIGN] =                    LV_STYLE_PROP_FLAG_LAYOUT_UPDATE,

src/misc/lv_style.h

@@ -180,6 +180,7 @@ enum _lv_style_prop_t {
     /*Group 0*/
     LV_STYLE_WIDTH                  = 1,
     LV_STYLE_HEIGHT                 = 2,
+    LV_STYLE_LENGTH                 = 3,
 
     LV_STYLE_MIN_WIDTH              = 4,
     LV_STYLE_MAX_WIDTH              = 5,

src/misc/lv_style_gen.c

@@ -68,6 +68,16 @@ void lv_style_set_max_height(lv_style_t * style, int32_t value)
 
 const lv_style_prop_t _lv_style_const_prop_id_MAX_HEIGHT = LV_STYLE_MAX_HEIGHT;
 
+void lv_style_set_length(lv_style_t * style, int32_t value)
+{
+    lv_style_value_t v = {
+        .num = (int32_t)value
+    };
+    lv_style_set_prop(style, LV_STYLE_LENGTH, v);
+}
+
+const lv_style_prop_t _lv_style_const_prop_id_LENGTH = LV_STYLE_LENGTH;
+
 void lv_style_set_x(lv_style_t * style, int32_t value)
 {
     lv_style_value_t v = {

src/misc/lv_style_gen.h

@@ -21,6 +21,8 @@ void lv_style_set_min_height(lv_style_t * style, int32_t value);
 extern const lv_style_prop_t _lv_style_const_prop_id_MIN_HEIGHT;
 void lv_style_set_max_height(lv_style_t * style, int32_t value);
 extern const lv_style_prop_t _lv_style_const_prop_id_MAX_HEIGHT;
+void lv_style_set_length(lv_style_t * style, int32_t value);
+extern const lv_style_prop_t _lv_style_const_prop_id_LENGTH;
 void lv_style_set_x(lv_style_t * style, int32_t value);
 extern const lv_style_prop_t _lv_style_const_prop_id_X;
 void lv_style_set_y(lv_style_t * style, int32_t value);
@@ -254,6 +256,11 @@ extern const lv_style_prop_t _lv_style_const_prop_id_GRID_CELL_ROW_SPAN;
         .prop_ptr = &_lv_style_const_prop_id_MAX_HEIGHT, .value = { .num = (int32_t)val } \
     }
 
+#define LV_STYLE_CONST_LENGTH(val) \
+    { \
+        .prop_ptr = &_lv_style_const_prop_id_LENGTH, .value = { .num = (int32_t)val } \
+    }
+
 #define LV_STYLE_CONST_X(val) \
     { \
         .prop_ptr = &_lv_style_const_prop_id_X, .value = { .num = (int32_t)val } \