【LVGL-平铺视图部件(lv_tileview)】

LVGL-平铺视图部件(lv_tileview)

  • [■ LVGL-平铺视图部件(lv_tileview)](#■ LVGL-平铺视图部件(lv_tileview))
    • [■ 示例一:添加到行列中的位置(1,0)表示第1列第0行](#■ 示例一:添加到行列中的位置(1,0)表示第1列第0行)
    • [■ 示例二:滑动方向LV_DIR_RIGHT ,LV_DIR_LEFT](#■ 示例二:滑动方向LV_DIR_RIGHT ,LV_DIR_LEFT)
    • [■ 示例三:移除滚动条](#■ 示例三:移除滚动条)
    • [■ 综合示例:](#■ 综合示例:)

■ LVGL-平铺视图部件(lv_tileview)


■ 示例一:添加到行列中的位置(1,0)表示第1列第0行

cpp 复制代码
lv_obj_t *tile_2 = lv_tileview_add_tile( tileview, 1, 0, LV_DIR_LEFT|LV_DIR_RIGHT ); //表示第1列第0行

■ 示例二:滑动方向LV_DIR_RIGHT ,LV_DIR_LEFT

cpp 复制代码
    lv_obj_t *tile_1 = lv_tileview_add_tile( tileview, 0, 0, LV_DIR_RIGHT );                /* 添加页面1 */
    lv_obj_t *tile_2 = lv_tileview_add_tile( tileview, 1, 0, LV_DIR_LEFT|LV_DIR_RIGHT );    /* 添加页面2 */
    lv_obj_t *tile_3 = lv_tileview_add_tile( tileview, 2, 0, LV_DIR_LEFT );                 /* 添加页面3 */

■ 示例三:移除滚动条

cpp 复制代码
lv_obj_remove_style(tileview, NULL, LV_PART_SCROLLBAR);                                 /* 移除滚动条 */

移除后就没有下方的滚动条了。

■ 综合示例:

cpp 复制代码
static const lv_font_t *font;           /* 定义字体 */

/**
 * @brief  平铺视图实例
 * @param  无
 * @return 无
 */
static void lv_example_tileview(void)
{
    /* 根据屏幕宽度设置字体 */
    if (scr_act_width() <= 480)
    {
        font = &lv_font_montserrat_14;
    }
    else
    {
        font = &lv_font_montserrat_20;
    }

    /* 创建平铺视图页面 */
    lv_obj_t *tileview = lv_tileview_create(lv_scr_act());                                  /* 创建平铺视图 */

    lv_obj_t *tile_1 = lv_tileview_add_tile( tileview, 0, 0, LV_DIR_RIGHT );                /* 添加页面1 */
    lv_obj_t *tile_2 = lv_tileview_add_tile( tileview, 1, 0, LV_DIR_LEFT|LV_DIR_RIGHT );    /* 添加页面2 */
    lv_obj_t *tile_3 = lv_tileview_add_tile( tileview, 2, 0, LV_DIR_LEFT );                 /* 添加页面3 */

    /* 设置页面内容 */
    lv_obj_t *label_1 = lv_label_create(tile_1);                                            /* 创建标签 */
    lv_label_set_text(label_1, "Page_1");                                                   /* 设置文本内容 */
    lv_obj_set_style_text_font(label_1, font, LV_STATE_DEFAULT);                            /* 设置字体 */
    lv_obj_center(label_1);                                                                 /* 设置位置 */

    lv_obj_t *label_2 = lv_label_create(tile_2);                                            /* 创建标签 */
    lv_label_set_text(label_2, "Page_2");                                                   /* 设置文本内容 */
    lv_obj_set_style_text_font(label_2, font, LV_STATE_DEFAULT);                            /* 设置字体 */
    lv_obj_center(label_2);                                                                 /* 设置位置 */

    lv_obj_t *label_3 = lv_label_create(tile_3);                                            /* 创建标签 */
    lv_label_set_text(label_3, "Page_3");                                                   /* 设置文本内容 */
    lv_obj_set_style_text_font(label_3, font, LV_STATE_DEFAULT);                            /* 设置字体 */
    lv_obj_center(label_3);                                                                 /* 设置位置 */
    lv_obj_remove_style(tileview, NULL, LV_PART_SCROLLBAR);                                 /* 移除滚动条 */

    /* 左侧状态栏 */
    lv_obj_t *label_left = lv_label_create(lv_scr_act());                                   /* 创建标签 */
    lv_label_set_text(label_left, "AM 8:30" );                                              /* 设置文本内容 */
    lv_obj_set_style_text_font(label_left, font, LV_STATE_DEFAULT);                         /* 设置字体 */
    lv_obj_align(label_left, LV_ALIGN_TOP_LEFT, 10, 10);                                    /* 设置位置 */

    /* 右侧状态栏 */
    lv_obj_t *label_right = lv_label_create(lv_scr_act());                                  /* 创建标签 */
    lv_label_set_text(label_right, LV_SYMBOL_WIFI "   80% " LV_SYMBOL_BATTERY_3);           /* 设置文本内容 */
    lv_obj_set_style_text_font(label_right, font, LV_STATE_DEFAULT);                        /* 设置字体 */
    lv_obj_align(label_right, LV_ALIGN_TOP_RIGHT, -10, 10);                                 /* 设置位置 */
}
相关推荐
无敌昊哥战神5 小时前
【LeetCode 257】二叉树的所有路径(回溯法/深度优先遍历)- Python/C/C++详细题解
c语言·c++·python·leetcode·深度优先
m0_488633326 小时前
C语言中枚举类型变量的定义、赋值及使用方法全解析
c语言·枚举类型·实例分析·变量定义·赋值使用
老鱼说AI6 小时前
大规模并发处理器程序设计(PMPP)讲解(CUDA架构):第四期:计算架构与调度
c语言·深度学习·算法·架构·cuda
小白橘颂11 小时前
【C语言】基础概念梳理(一)
c语言·开发语言·stm32·单片机·mcu·物联网·51单片机
co_wait12 小时前
【c 语言】linux下gcc编译工具的使用
linux·c语言·开发语言
always_TT12 小时前
结构体数组与初始化
c语言
是翔仔呐12 小时前
第13章 超声波测距传感器驱动:HC-SR04底层原理与C语言实现
c语言·开发语言·单片机·嵌入式硬件·gitee
光电笑映12 小时前
STL 源码解剖系列:map/set 的底层复用与红黑树封装
c语言·数据结构·c++·算法
for_ever_love__13 小时前
Objective- C学习: 手动内存管理
c语言·学习·ios·objective-c
小龙报14 小时前
【数据结构与算法】栈和队列的综合应用:1.用栈实现队列 2.用队列实现栈 3.设计循环队列
c语言·数据结构·数据库·c++·redis·算法·缓存