lvgl有哪些布局？

LVGL 提供了多种布局方式，帮助你高效组织界面元素，避免手动计算坐标。在 v8.2.0 中，主要有以下几种布局方法：

---

1. 绝对定位（手动设置坐标）

最基础的方式，通过 lv_obj_set_pos(obj, x, y) 直接指定控件相对于父对象的位置。
适用场景：控件数量少、固定位置（如状态栏图标）。

lv_obj_set_pos(btn, 10, 20);

---

2. 对齐（Alignment）

将控件相对于父对象或其他控件对齐，支持偏移。常用函数：

• lv_obj_center(obj) --- 居中
• lv_obj_align(obj, LV_ALIGN_TOP_MID, dx, dy) --- 顶部中间对齐
• lv_obj_align_to(obj, ref_obj, LV_ALIGN_OUT_RIGHT_TOP, dx, dy) --- 相对于另一个控件对齐

适用场景：单一控件或控件组的位置固定，但无需复杂的自动排列。

lv_obj_align(btn, LV_ALIGN_BOTTOM_MID, 0, -10);  // 底部中间，向上偏移10

---

3. Flex 布局（弹性布局）

类似 CSS Flexbox，让子控件在一行或一列中自动排列，支持换行、对齐方式、间距等。

启用方式：

lv_obj_set_flex_flow(container, LV_FLEX_FLOW_ROW);      // 水平排列
lv_obj_set_flex_align(container, LV_FLEX_ALIGN_CENTER, LV_FLEX_ALIGN_CENTER, LV_FLEX_ALIGN_CENTER);
lv_obj_set_style_pad_row(container, 10, 0);             // 行间距
lv_obj_set_style_pad_column(container, 5, 0);           // 列间距

常用参数：

• flex_flow：LV_FLEX_FLOW_ROW（水平）、LV_FLEX_FLOW_COLUMN（垂直）、LV_FLEX_FLOW_ROW_WRAP（换行）等。
• flex_align：主轴上对齐（LV_FLEX_ALIGN_START/CENTER/END/SPACE_BETWEEN/SPACE_AROUND/SPACE_EVENLY）和交叉轴对齐。

适用场景：列表、按钮组、工具栏等需要动态排列的控件组。

---

4. Grid 布局（网格布局）

将容器划分为网格，子控件可指定占据的行列，支持跨行跨列。

启用方式：

static lv_coord_t col_dsc[] = {100, LV_GRID_FR(1), 100, LV_GRID_TEMPLATE_LAST};
static lv_coord_t row_dsc[] = {40, 40, LV_GRID_TEMPLATE_LAST};
lv_obj_set_grid_dsc_array(cont, col_dsc, row_dsc);

// 将按钮放置在网格的第0行第1列
lv_obj_set_grid_cell(btn, LV_GRID_ALIGN_STRETCH, 1, 1, LV_GRID_ALIGN_CENTER, 0, 1);

参数：

• col_dsc / row_dsc：定义列宽/行高，可以使用固定值或 LV_GRID_FR(1)（比例分配剩余空间）。
• lv_obj_set_grid_cell：设置控件位置和跨度。

适用场景：复杂表单、仪表盘、等宽多列布局。

---

5. 布局容器（lv_obj_set_layout）

LVGL 内置了几种简单布局，可通过 lv_obj_set_layout(cont, LV_LAYOUT_...) 快速启用：

• LV_LAYOUT_NONE：默认，无特殊布局
• LV_LAYOUT_FLEX：启用 Flex 布局（效果与 lv_obj_set_flex_flow 类似）
• LV_LAYOUT_GRID：启用 Grid 布局

通常更推荐直接使用 lv_obj_set_flex_flow 和 lv_obj_set_grid_dsc_array，因为它们提供了更丰富的控制。

---

布局选择建议

场景	推荐布局
固定位置（如状态栏）	绝对定位 + 对齐
垂直排列的菜单、列表	Flex（列）
水平排列的工具栏	Flex（行）
复杂仪表板、等分网格	Grid
响应式布局（自适应宽高）	Flex（配合 LV_FLEX_ALIGN_SPACE_BETWEEN）或 Grid（配合 LV_GRID_FR）

---

注意事项

• 布局与样式：布局主要控制位置和尺寸，样式则控制外观，两者可叠加。
• 容器背景 ：启用布局的容器如果希望有背景，需设置 lv_obj_set_style_bg_opa(cont, LV_OPA_COVER, 0) 等样式。
• 子控件大小 ：在布局中，子控件可通过 lv_obj_set_size 固定大小，也可由布局自动分配（如 lv_obj_set_flex_grow）。

掌握这些布局方法后，你可以轻松构建出适应不同屏幕尺寸的界面，无需为每个控件手动计算坐标。