网站运营心得建网站找哪个公司
文章目录
- 一、功能概述
- 二、基本使用方法
- 1. 创建 tabview 控件
- 2. 添加标签页（tab）
- 3. 往 tab 中添加控件
- 4. 设置默认选中标签
- 三、常用函数接口
- 四、事件使用示例（监听切换）
- 五、方向与风格配置
- 六、应用场景示例
- 七、版本注意事项
lv_tabview 是 LVGL（Light and Versatile Graphics Library） 图形库中用于创建**选项卡式界面（Tab View）**的控件，它允许用户通过点击不同的标签页，在同一个区域中切换不同的界面内容。
这是在嵌入式 GUI 中常见的界面布局方式，适合用于信息分类展示、设置菜单、状态分组等场景。
一、功能概述
lv_tabview 控件由以下几部分组成：
- 选项卡标题区域（tab buttons）：一排标签标题，点击可切换内容；
- 内容页面区域（tab content）：每个标签对应一个页面容器；
- 滑动/切换效果：支持滑动切换 tab 页面；
- 样式配置：可设置背景色、字体、间距等样式；
- 事件回调：可获取 tab 切换事件。
二、基本使用方法
1. 创建 tabview 控件
lv_obj_t *tabview = lv_tabview_create(lv_scr_act(), LV_DIR_TOP, 50);
- 第一个参数是父对象（一般是
lv_scr_act()） - 第二个参数是标签页的位置方向（顶部、左侧、右侧、底部）
- 第三个参数是标签页高度或宽度（单位像素）
2. 添加标签页（tab）
lv_obj_t *tab1 = lv_tabview_add_tab(tabview, "信息");
lv_obj_t *tab2 = lv_tabview_add_tab(tabview, "设置");
lv_obj_t *tab3 = lv_tabview_add_tab(tabview, "状态");
每个 tabX 都是一个容器对象，可以在其上创建按钮、标签、图表等控件。
3. 往 tab 中添加控件
lv_label_create(tab1); // 在“信息”页创建一个标签
lv_btn_create(tab2); // 在“设置”页添加一个按钮
4. 设置默认选中标签
lv_tabview_set_act(tabview, 0, LV_ANIM_OFF); // 默认选中第0页，无动画
三、常用函数接口
| 函数 | 功能 |
|---|---|
lv_tabview_create() | 创建 tabview 控件 |
lv_tabview_add_tab() | 添加一个标签页并返回容器对象 |
lv_tabview_set_act() | 设置当前选中标签页 |
lv_tabview_get_tab_act() | 获取当前活动页索引 |
lv_tabview_get_tab() | 获取指定索引的标签页对象 |
lv_tabview_set_tab_name() | 设置标签页标题（LVGL v9） |
lv_obj_add_event_cb() | 添加事件回调函数（监听 tab 切换） |
四、事件使用示例（监听切换）
static void tab_event_cb(lv_event_t *e)
{uint32_t act_id = lv_tabview_get_tab_act(lv_event_get_target(e));printf("当前选中标签页：%d\n", act_id);
}lv_obj_add_event_cb(tabview, tab_event_cb, LV_EVENT_VALUE_CHANGED, NULL);
五、方向与风格配置
lv_obj_set_style_bg_color(tabview, lv_color_hex(0x333333), 0); // 背景色
lv_obj_set_style_text_color(tabview, lv_color_white(), 0); // 文本颜色
可以通过样式系统自定义标签页样式、内容页边距、动画方式等。
六、应用场景示例
- 系统设置界面：多个 tab 页分别显示“网络”、“显示”、“声音”等设置项；
- 状态监控系统：每个 tab 显示不同传感器状态；
- 工业触摸屏界面：左侧 tab 控制不同机器模块状态显示。
七、版本注意事项
LVGL v8 与 v9 的 tabview 接口有所不同，v9 中 lv_tabview_set_tab_name() 替代了部分接口，结构也更清晰，具体需查阅对应版本 API 文档。