LVGL8学习之Flex布局2
·
这一篇来学习Flex布局的把项目按行包裹,且让他们周围的控件平均。(Arrange items in rows with wrap and even spacing),还是通过codeblock来模拟代码的运行,代码如下:
void lv_flex_layout_test2()
{
static lv_style_t style;
lv_style_init(&style); // 初始化style
lv_style_set_layout(&style, LV_LAYOUT_FLEX); // 给style添加flex弹性布局
lv_style_set_flex_flow(&style, LV_FLEX_FLOW_ROW_WRAP); // 包裹子控件按行排列
lv_style_set_flex_main_place(&style, LV_FLEX_ALIGN_SPACE_EVENLY); // 任意两个项目(以及边缘的空间)之间的间距相等
lv_obj_t * cont = lv_obj_create(lv_scr_act()); // 创建一个容器对象
if (cont == NULL)
{
return ;
}
lv_obj_set_size(cont, 300, 240); // 设置容器对象的大小
lv_obj_center(cont); // 容器对象屏幕居中显示
lv_obj_add_style(cont, &style, 0); // 给容器对象添加style
static lv_style_t obj_style;
lv_style_init(&obj_style); // 初始化样式
lv_style_set_radius(&obj_style, 5); // 设置按钮样式圆角弧度
lv_style_set_bg_opa(&obj_style, LV_OPA_COVER); // 设置背景的透明度
lv_style_set_bg_color(&obj_style, lv_palette_lighten(LV_PALETTE_BLUE, 2)); //设置背景色
lv_style_set_border_color(&obj_style, lv_palette_darken(LV_PALETTE_GREEN, 2)); // 设置边框颜色
lv_style_set_border_width(&obj_style, 3); // 设置边框宽度
int i = 0;
for(i = 0; i < 8; i++)
{
lv_obj_t * obj = lv_obj_create(cont);
if (obj != NULL)
{
lv_obj_set_size(obj, 70, LV_SIZE_CONTENT); // 设置对象大小
lv_obj_add_style(obj, &obj_style, 0); // 给对象添加样式
lv_obj_t * label = lv_label_create(obj);
if (label != NULL)
{
lv_label_set_text_fmt(label, "%d", i); // 设置文本
lv_obj_center(label);
}
}
}
}
运行效果:
更多推荐
已为社区贡献18条内容
所有评论(0)