LVGL V8之flex grow

flex grow布局

static void lv_example_flex_3(void)
{
    lv_obj_t* cont = lv_obj_create(lv_scr_act()); //当前活动界面创建obj对象作为容器
    lv_obj_set_size(cont, 300, 220); //设置容器对象宽为300,高为220
    lv_obj_center(cont);  //容器对象居中显示
    lv_obj_set_flex_flow(cont, LV_FLEX_FLOW_ROW); //设置LV_FLEX_FLOW_ROW风格布局
    lv_obj_t* obj;
    obj = lv_obj_create(cont);  //在cont对象上创建obj对象
    lv_obj_set_size(obj, 40, 40); //设置宽高都为40
    obj = lv_obj_create(cont); //在cont对象上创建obj对象
    lv_obj_set_height(obj, 40); //设置高为40
    lv_obj_set_flex_grow(obj, 1); //宽为剩余空间的1份权重
    obj = lv_obj_create(cont); //在cont对象上创建obj对象
    lv_obj_set_height(obj, 40);//设置高为40
    lv_obj_set_flex_grow(obj,2);  //宽为剩余空间的2份权重
    obj = lv_obj_create(cont); //在cont对象上创建obj对象
    lv_obj_set_size(obj, 40, 40); //设置宽高都为40
}

效果图

• 修改容器宽为800

 lv_obj_set_size(cont, 800, 220);

• 修改第一个对象的宽度权重值为3

 lv_obj_set_flex_grow(obj,3);

• 修改第二个对象的宽度权重值为3

lv_obj_set_flex_grow(obj, 3); 

• 修改第二个和第三个对象的宽度权重值都为50