当前位置：首页 > java >正文

lvgl 布局管理

java 2025/7/13 7:18:11

一、重要接口

void lv_obj_set_layout(struct _lv_obj_t * obj, uint32_t layout)：为一个对象设置布局描述符。
bool lv_obj_is_layout_positioned(const struct _lv_obj_t * obj)：检查一个对象是否由布局管理器定位。
void lv_obj_mark_layout_as_dirty(struct _lv_obj_t * obj)：标记对象的布局为“脏”状态，表示需要更新。
void lv_obj_update_layout(const struct _lv_obj_t * obj)：更新对象的布局。
uint32_t lv_layout_register(lv_layout_update_cb_t cb, void * user_data)：注册一个新的布局。
void lv_obj_set_align(struct _lv_obj_t * obj, lv_align_t align)：设置对象的对齐方式。
void lv_obj_align(struct _lv_obj_t * obj, lv_align_t align, lv_coord_t x_ofs, lv_coord_t y_ofs)：设置对象的对齐方式，并指定偏移量。
void lv_obj_align_to(struct _lv_obj_t * obj, const struct _lv_obj_t * base, lv_align_t align, lv_coord_t x_ofs, lv_coord_t y_ofs)：将一个对象对齐到另一个对象。
static inline void lv_obj_center(struct _lv_obj_t * obj)：将对象在其父对象中居中对齐。
void lv_obj_set_flex_flow(lv_obj_t * obj, lv_flex_flow_t flow)：设置对象的弹性布局的流方向。
void lv_obj_set_flex_align(lv_obj_t * obj, lv_flex_align_t main_place, lv_flex_align_t cross_place,lv_flex_align_t track_cross_place)：设置弹性布局中子对象的对齐方式。
void lv_obj_set_flex_grow(lv_obj_t * obj, uint8_t grow)：设置对象在主轴方向上如何扩展以填充剩余空间。
void lv_style_set_flex_flow(lv_style_t * style, lv_flex_flow_t value)：设置样式中的弹性布局流方向。
void lv_style_set_flex_main_place(lv_style_t * style, lv_flex_align_t value)：设置样式中主轴方向上的对齐方式。
void lv_style_set_flex_cross_place(lv_style_t * style, lv_flex_align_t value)：设置样式中交叉轴方向上的对齐方式。
void lv_style_set_flex_track_place(lv_style_t * style, lv_flex_align_t value)：设置样式中轨道在交叉轴方向上的对齐方式。
void lv_style_set_flex_grow(lv_style_t * style, uint8_t value)：设置样式中对象在主轴方向上的扩展比例。
void lv_obj_set_style_flex_flow(lv_obj_t * obj, lv_flex_flow_t value, lv_style_selector_t selector)：为对象设置弹性布局流方向的样式。
void lv_obj_set_style_flex_main_place(lv_obj_t * obj, lv_flex_align_t value, lv_style_selector_t selector)：为对象设置主轴方向上的对齐方式。
void lv_obj_set_style_flex_cross_place(lv_obj_t * obj, lv_flex_align_t value, lv_style_selector_t selector)：为对象设置交叉轴方向上的对齐方式。
void lv_obj_set_style_flex_track_place(lv_obj_t * obj, lv_flex_align_t value, lv_style_selector_t selector)：为对象设置轨道在交叉轴方向上的对齐方式。
void lv_obj_set_style_flex_grow(lv_obj_t * obj, uint8_t value, lv_style_selector_t selector)：为对象设置主轴方向上的扩展比例。

二、实例

//水平+竖直布局
static void lv_example_flex_1(void)
{/*Create a container with ROW flex direction*/lv_obj_t * cont_row = lv_obj_create(lv_scr_act());lv_obj_set_size(cont_row, 600, 75);lv_obj_align(cont_row, LV_ALIGN_TOP_MID, 0, 5);lv_obj_set_flex_flow(cont_row, LV_FLEX_FLOW_ROW);/*Create a container with COLUMN flex direction*/lv_obj_t * cont_col = lv_obj_create(lv_scr_act());lv_obj_set_size(cont_col, 600, 150);lv_obj_align_to(cont_col, cont_row, LV_ALIGN_OUT_BOTTOM_MID, 0, 5);lv_obj_set_flex_flow(cont_col, LV_FLEX_FLOW_COLUMN);uint32_t i;for(i = 0; i < 10; i++) {lv_obj_t * obj;lv_obj_t * label;/*Add items to the row*/obj= lv_btn_create(cont_row);lv_obj_set_size(obj, 100, LV_PCT(100));label = lv_label_create(obj);lv_label_set_text_fmt(label, "Item: %u", i);lv_obj_center(label);/*Add items to the column*/obj = lv_btn_create(cont_col);lv_obj_set_size(obj, LV_PCT(100), LV_SIZE_CONTENT);label = lv_label_create(obj);lv_label_set_text_fmt(label, "Item: %"LV_PRIu32, i);lv_obj_center(label);}
}

//将项目按行排列，自动换行，并使项目周围的空间均匀分布。
static void lv_example_flex_2(void)
{static lv_style_t style;lv_style_init(&style);lv_style_set_flex_flow(&style, LV_FLEX_FLOW_ROW_WRAP);lv_style_set_flex_main_place(&style, LV_FLEX_ALIGN_SPACE_EVENLY);lv_style_set_layout(&style, LV_LAYOUT_FLEX);lv_obj_t * cont = lv_obj_create(lv_scr_act());lv_obj_set_size(cont, 300, 220);lv_obj_center(cont);lv_obj_add_style(cont, &style, 0);uint32_t i;for(i = 0; i < 8; i++) {lv_obj_t * obj = lv_obj_create(cont);lv_obj_set_size(obj, 70, LV_SIZE_CONTENT);lv_obj_add_flag(obj, LV_OBJ_FLAG_CHECKABLE);lv_obj_t * label = lv_label_create(obj);lv_label_set_text_fmt(label, "%"LV_PRIu32, i);lv_obj_center(label);}
}

//展示弹性增长（flex grow）的效果
static void lv_example_flex_3(void)
{lv_obj_t * cont = lv_obj_create(lv_scr_act());lv_obj_set_size(cont, 300, 220);lv_obj_center(cont);lv_obj_set_flex_flow(cont, LV_FLEX_FLOW_ROW);lv_obj_t * obj;obj = lv_obj_create(cont);lv_obj_set_size(obj, 40, 40);           /*Fix size*/obj = lv_obj_create(cont);lv_obj_set_height(obj, 40);lv_obj_set_flex_grow(obj, 1);           /*1 portion from the free space*/obj = lv_obj_create(cont);lv_obj_set_height(obj, 40);lv_obj_set_flex_grow(obj, 2);           /*2 portion from the free space*/obj = lv_obj_create(cont);lv_obj_set_size(obj, 40, 40);           /*Fix size. It is flushed to the right by the "grow" items*/
}

//反转弹性项目的顺序。
static void lv_example_flex_4(void)
{lv_obj_t * cont = lv_obj_create(lv_scr_act());lv_obj_set_size(cont, 300, 220);lv_obj_center(cont);lv_obj_set_flex_flow(cont, LV_FLEX_FLOW_COLUMN_REVERSE);uint32_t i;for(i = 0; i < 6; i++) {lv_obj_t * obj = lv_obj_create(cont);lv_obj_set_size(obj, 100, 50);lv_obj_t * label = lv_label_create(obj);lv_label_set_text_fmt(label, "Item: %"LV_PRIu32, i);lv_obj_center(label);}
}

//演示列间距和行间距样式属性的效果
static void row_gap_anim(void * obj, int32_t v)
{lv_obj_set_style_pad_row(obj, v, 0);
}static void column_gap_anim(void * obj, int32_t v)
{lv_obj_set_style_pad_column(obj, v, 0);
}static void lv_example_flex_5(void)
{lv_obj_t * cont = lv_obj_create(lv_scr_act());lv_obj_set_size(cont, 300, 220);lv_obj_center(cont);lv_obj_set_flex_flow(cont, LV_FLEX_FLOW_ROW_WRAP);uint32_t i;for(i = 0; i < 9; i++) {lv_obj_t * obj = lv_obj_create(cont);lv_obj_set_size(obj, 70, LV_SIZE_CONTENT);lv_obj_t * label = lv_label_create(obj);lv_label_set_text_fmt(label, "%"LV_PRIu32, i);lv_obj_center(label);}lv_anim_t a;lv_anim_init(&a);lv_anim_set_var(&a, cont);lv_anim_set_values(&a, 0, 10);lv_anim_set_repeat_count(&a, LV_ANIM_REPEAT_INFINITE);lv_anim_set_exec_cb(&a, row_gap_anim);lv_anim_set_time(&a, 500);lv_anim_set_playback_time(&a, 500);lv_anim_start(&a);lv_anim_set_exec_cb(&a, column_gap_anim);lv_anim_set_time(&a, 3000);lv_anim_set_playback_time(&a, 3000);lv_anim_start(&a);
}

//RTL 基础方向改变项目的顺序。
void lv_example_flex_6(void)
{lv_obj_t * cont = lv_obj_create(lv_scr_act());lv_obj_set_style_base_dir(cont, LV_BASE_DIR_RTL, 0);lv_obj_set_size(cont, 300, 220);lv_obj_center(cont);lv_obj_set_flex_flow(cont, LV_FLEX_FLOW_ROW_WRAP);uint32_t i;for(i = 0; i < 20; i++) {lv_obj_t * obj = lv_obj_create(cont);lv_obj_set_size(obj, 70, LV_SIZE_CONTENT);lv_obj_t * label = lv_label_create(obj);lv_label_set_text_fmt(label, "%"LV_PRIu32, i);lv_obj_center(label);}
}