lvgl|让tabview的页面循环切换(无限切换)

2023-11-09 09:50

本文主要是介绍lvgl|让tabview的页面循环切换(无限切换),希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

前言

lvgl默认创建出来的tabview是不能在第一个和最后一个页面之间循环切换的。

下面的教大家怎么让tabview的页面可以循环切换,也就是:

  • 当切换到第一个页面的时候可以继续切换到最后一个页面
  • 反过来,当切换到最后一个页面的时候可以继续切换到第一个页面

实现思路

我们先要弄清楚 tabview 由哪些部分组成。
选项卡视图对象可用于组织选项卡中的内容。选项卡视图是从其他小部件构建的:

  • tabview主容器
    • 选项卡按钮
    • 选项卡的容器(页面)

选项卡按钮可以位于选项卡视图的顶部、底部、左侧和右侧,或者隐藏起来。
我们可以通过单击选项卡按钮或在选项卡容器上水平滑切换选项卡。

在这里插入图片描述

也就是当我滑动tabview中的页面(选项卡)的时候实际上是在操作tabview中的选项卡部分

所以我们可以给 tabview 中的页面(选项卡)添加一个事件处理回调函数,来完成页面的循环切换功能。

实现代码

// 为 tabview 中的页面(选项卡)部分添加事件处理回调函数
lv_obj_add_event_cb(lv_tabview_get_content(tabview), scroll_begin_event, LV_EVENT_SCROLL_END, NULL);// 处理滚动事件,完成页面循环切换(无限切换)
static void scroll_begin_event(lv_event_t * e)
{lv_obj_t * cont = lv_event_get_target(e);lv_event_code_t code = lv_event_get_code(e);lv_obj_t * tv = lv_obj_get_parent(cont);if(lv_event_get_code(e) == LV_EVENT_SCROLL_END) {lv_tabview_t * tabview = (lv_tabview_t *)tv;lv_coord_t s = lv_obj_get_scroll_x(cont);lv_point_t p;lv_obj_get_scroll_end(cont, &p);lv_coord_t w = lv_obj_get_content_width(cont);lv_coord_t t;if(lv_obj_get_style_base_dir(tv, LV_PART_MAIN) == LV_BASE_DIR_RTL)  t = -(p.x - w / 2) / w;else t = (p.x + w / 2) / w;if(s < 0) t = tabview->tab_cnt - 1;else if((t == (tabview->tab_cnt - 1)) && (s > p.x)) t = 0;bool new_tab = false;if(t != lv_tabview_get_tab_act(tv)) new_tab = true;lv_tabview_set_act(tv, t, LV_ANIM_ON);}
}

效果

请添加图片描述

lvgl视频教程

百问网LVGL(v8)系列课程(韦东山·监制) 教程基于lvgl v8.2版本,课程适配多个平台、多款板子

百问网LVGL(v8)视频课程(韦东山·监制) 教程基于lvgl v8.2版本,课程适配多个平台、多款板子!视频学习地址:https://www.bilibili.com/video/BV1Ya411r7K2

视频教程配套资料

  • https://gitee.com/weidongshan/lvgl_100ask_course_materials

相关学习资源

  • lvgl官网:https://lvgl.io
  • lvgl官方文档:https://docs.lvgl.io
  • 百问网lvgl中文文档:http://lvgl.100ask.net
  • 百问网lvgl论坛:https://forums.100ask.net/c/13-category/13
  • 百问网lvgl学习交流群:http://lvgl.100ask.net/master/contact_us/index.html
  • 百问网lvgl视频教程:
    • https://www.bilibili.com/video/BV1Ya411r7K2
    • https://www.100ask.net/detail/p_61c5a317e4b0cca4a4e8b6f1/6

这篇关于lvgl|让tabview的页面循环切换(无限切换)的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/375408

相关文章

Python判断for循环最后一次的6种方法

《Python判断for循环最后一次的6种方法》在Python中,通常我们不会直接判断for循环是否正在执行最后一次迭代,因为Python的for循环是基于可迭代对象的,它不知道也不关心迭代的内部状态... 目录1.使用enuhttp://www.chinasem.cnmerate()和len()来判断for

Java循环创建对象内存溢出的解决方法

《Java循环创建对象内存溢出的解决方法》在Java中,如果在循环中不当地创建大量对象而不及时释放内存,很容易导致内存溢出(OutOfMemoryError),所以本文给大家介绍了Java循环创建对象... 目录问题1. 解决方案2. 示例代码2.1 原始版本(可能导致内存溢出)2.2 修改后的版本问题在

IDEA如何切换数据库版本mysql5或mysql8

《IDEA如何切换数据库版本mysql5或mysql8》本文介绍了如何将IntelliJIDEA从MySQL5切换到MySQL8的详细步骤,包括下载MySQL8、安装、配置、停止旧服务、启动新服务以及... 目录问题描述解决方案第一步第二步第三步第四步第五步总结问题描述最近想开发一个新应用,想使用mysq

使用JavaScript将PDF页面中的标注扁平化的操作指南

《使用JavaScript将PDF页面中的标注扁平化的操作指南》扁平化(flatten)操作可以将标注作为矢量图形包含在PDF页面的内容中,使其不可编辑,DynamsoftDocumentViewer... 目录使用Dynamsoft Document Viewer打开一个PDF文件并启用标注添加功能扁平化

React实现原生APP切换效果

《React实现原生APP切换效果》最近需要使用Hybrid的方式开发一个APP,交互和原生APP相似并且需要IM通信,本文给大家介绍了使用React实现原生APP切换效果,文中通过代码示例讲解的非常... 目录背景需求概览技术栈实现步骤根据 react-router-dom 文档配置好路由添加过渡动画使用

SpringBoot如何访问jsp页面

《SpringBoot如何访问jsp页面》本文介绍了如何在SpringBoot项目中进行Web开发,包括创建项目、配置文件、添加依赖、控制层修改、测试效果以及在IDEA中进行配置的详细步骤... 目录SpringBoot如何访问JSP页python面简介实现步骤1. 首先创建的项目一定要是web项目2. 在

JAVA中while循环的使用与注意事项

《JAVA中while循环的使用与注意事项》:本文主要介绍while循环在编程中的应用,包括其基本结构、语句示例、适用场景以及注意事项,文中通过代码介绍的非常详细,需要的朋友可以参考下... 目录while循环1. 什么是while循环2. while循环的语句3.while循环的适用场景以及优势4. 注意

Spring Boot实现多数据源连接和切换的解决方案

《SpringBoot实现多数据源连接和切换的解决方案》文章介绍了在SpringBoot中实现多数据源连接和切换的几种方案,并详细描述了一个使用AbstractRoutingDataSource的实... 目录前言一、多数据源配置与切换方案二、实现步骤总结前言在 Spring Boot 中实现多数据源连接

Python中的异步:async 和 await以及操作中的事件循环、回调和异常

《Python中的异步:async和await以及操作中的事件循环、回调和异常》在现代编程中,异步操作在处理I/O密集型任务时,可以显著提高程序的性能和响应速度,Python提供了asyn... 目录引言什么是异步操作?python 中的异步编程基础async 和 await 关键字asyncio 模块理论

好题——hdu2522(小数问题:求1/n的第一个循环节)

好喜欢这题,第一次做小数问题,一开始真心没思路,然后参考了网上的一些资料。 知识点***********************************无限不循环小数即无理数,不能写作两整数之比*****************************(一开始没想到,小学没学好) 此题1/n肯定是一个有限循环小数,了解这些后就能做此题了。 按照除法的机制,用一个函数表示出来就可以了,代码如下