LVGL8.3动画图像(太空人)

2024-06-23 19:12
文章标签 图像 动画 太空 lvgl8.3

本文主要是介绍LVGL8.3动画图像(太空人),希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

LVGL8.3 动画图像

1. 动画图像本质

我们知道电影属于视频,而电影的本质是将一系列动作的静态图像进行快速切换而呈现出动画的形式,也就是说动画本质是一系列照片。所以 lvgl 依照这样的思想而定义了动画图像,所以在 lvgl 中动画图像类似于普通的静态图像对象。 唯一的区别是,动画图像设置了一个由多个源图像组成的数组,而不仅仅指定一个源图像。

2. 设置动画图像图片来源

不过在此之前需要将 GIF 文件逐帧拆解为每一张图片,再将得到得图片使用 LVGL 提供得图片转换工具转换为数组(所以你需要知道 LVGL 图片控件是如何使用的,如果不知道可以看看之前的文章:https://blog.csdn.net/jf_52001760/article/details/123981424),这里再提供一个在线的 GIF 图片帧拆分工具。

在线 GIF 图片帧拆分工具:https://uutool.cn/gif2img/

前面说到动画图像和普通静态图像唯一的区别是动画图像需要指定多个源图像,所以现在需要定义一个图像组用于放置多个图像源,注意在使用图像之前需要先声明图像,数组定义如下所示。

LV_IMG_DECLARE(animimg001)
LV_IMG_DECLARE(animimg002)
LV_IMG_DECLARE(animimg003)static const lv_img_dsc_t * anim_imgs[3] = {&animimg001,&animimg002,&animimg003,
};

3. 创建动画图像

在使用动画图像对象之前首先需要创建对象,创建动画图像对象使用 lv_animimg_create(lv_obj_t * parent) 函数接口。

lv_obj_t * animimg0 = lv_animimg_create(lv_scr_act());

4. 设置动画对象图像源

动画需要一系列的图像,所以需要给动画对象指定一个图像数组,数组即为前面定义的图像源数组,将数组指向动画对象使用 lv_animimg_set_src(lv_obj_t * obj, lv_img_dsc_t * dsc[], uint8_t num) 函数接口,其中 参数 num 为数组中图像的数量。

lv_animimg_set_src(animimg0, (lv_img_dsc_t**)anim_imgs, 3);

5. 设置动画图像持续时间

动画持续时间就是将数组中所有的图像加载显示完成需要的时间,时间单位是毫秒设置持续时间使用 lv_animimg_set_duration(lv_obj_t * obj, uint32_t duration) 函数接口。这里持续时间设置为 1 秒同时组成动画的共 3 张图像,那么动画对象将每隔 0.33 秒的时间加载一张图像显示到屏幕,即 0.33 秒刷新一次图像。

lv_animimg_set_duration(animimg0, 1000);

6. 设置动画图像动画重复次数

lv_animimg_set_repeat_count(lv_obj_t * obj, uint16_t count) 函数接口用于设置动画的重复次数,动画重复次数可以设置为无线(LV_ANIM_REPEAT_INFINITE),例如下方这样。

lv_animimg_set_repeat_count(animimg0, LV_ANIM_REPEAT_INFINITE);

7. 启动动画图像

lv_animimg_start(animimg0);

8. 实例

LV_IMG_DECLARE(image0)
LV_IMG_DECLARE(image1)
LV_IMG_DECLARE(image2)
LV_IMG_DECLARE(image3)
LV_IMG_DECLARE(image4)
LV_IMG_DECLARE(image5)
LV_IMG_DECLARE(image6)
LV_IMG_DECLARE(image7)static const lv_img_dsc_t * anim_imgs[8] = {&image0,&image1,&image2,&image3,&image4,&image5,&image6,&image7,
};lv_obj_t * animimg = lv_animimg_create(par);
lv_obj_center(animimg);
lv_animimg_set_src(animimg, (lv_img_dsc_t**)anim_imgs, 8);
lv_animimg_set_duration(animimg, 1000);
lv_animimg_set_repeat_count(animimg, LV_ANIM_REPEAT_INFINITE);
lv_animimg_start(animimg);

实例动画,太空人效果,整体播放是丝滑的,不过注意这要保证屏幕刷新率 > 15Hz 时才能做到较好得显示效果:
请添加图片描述
实例动画,蝴蝶呼吸般得扇翅效果,很丝滑:
请添加图片描述

这篇关于LVGL8.3动画图像(太空人)的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



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

相关文章

基于Python开发一个图像水印批量添加工具

《基于Python开发一个图像水印批量添加工具》在当今数字化内容爆炸式增长的时代,图像版权保护已成为创作者和企业的核心需求,本方案将详细介绍一个基于PythonPIL库的工业级图像水印解决方案,有需要... 目录一、系统架构设计1.1 整体处理流程1.2 类结构设计(扩展版本)二、核心算法深入解析2.1 自

Python中OpenCV与Matplotlib的图像操作入门指南

《Python中OpenCV与Matplotlib的图像操作入门指南》:本文主要介绍Python中OpenCV与Matplotlib的图像操作指南,本文通过实例代码给大家介绍的非常详细,对大家的学... 目录一、环境准备二、图像的基本操作1. 图像读取、显示与保存 使用OpenCV操作2. 像素级操作3.

C/C++的OpenCV 进行图像梯度提取的几种实现

《C/C++的OpenCV进行图像梯度提取的几种实现》本文主要介绍了C/C++的OpenCV进行图像梯度提取的实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的... 目录预www.chinasem.cn备知识1. 图像加载与预处理2. Sobel 算子计算 X 和 Y

c/c++的opencv图像金字塔缩放实现

《c/c++的opencv图像金字塔缩放实现》本文主要介绍了c/c++的opencv图像金字塔缩放实现,通过对原始图像进行连续的下采样或上采样操作,生成一系列不同分辨率的图像,具有一定的参考价值,感兴... 目录图像金字塔简介图像下采样 (cv::pyrDown)图像上采样 (cv::pyrUp)C++ O

Kotlin Compose Button 实现长按监听并实现动画效果(完整代码)

《KotlinComposeButton实现长按监听并实现动画效果(完整代码)》想要实现长按按钮开始录音,松开发送的功能,因此为了实现这些功能就需要自己写一个Button来解决问题,下面小编给大... 目录Button 实现原理1. Surface 的作用(关键)2. InteractionSource3.

使用WPF实现窗口抖动动画效果

《使用WPF实现窗口抖动动画效果》在用户界面设计中,适当的动画反馈可以提升用户体验,尤其是在错误提示、操作失败等场景下,窗口抖动作为一种常见且直观的视觉反馈方式,常用于提醒用户注意当前状态,本文将详细... 目录前言实现思路概述核心代码实现1、 获取目标窗口2、初始化基础位置值3、创建抖动动画4、动画完成后

使用animation.css库快速实现CSS3旋转动画效果

《使用animation.css库快速实现CSS3旋转动画效果》随着Web技术的不断发展,动画效果已经成为了网页设计中不可或缺的一部分,本文将深入探讨animation.css的工作原理,如何使用以及... 目录1. css3动画技术简介2. animation.css库介绍2.1 animation.cs

Python+wxPython构建图像编辑器

《Python+wxPython构建图像编辑器》图像编辑应用是学习GUI编程和图像处理的绝佳项目,本教程中,我们将使用wxPython,一个跨平台的PythonGUI工具包,构建一个简单的... 目录引言环境设置创建主窗口加载和显示图像实现绘制工具矩形绘制箭头绘制文字绘制临时绘制处理缩放和旋转缩放旋转保存编

python+OpenCV反投影图像的实现示例详解

《python+OpenCV反投影图像的实现示例详解》:本文主要介绍python+OpenCV反投影图像的实现示例详解,本文通过实例代码图文并茂的形式给大家介绍的非常详细,感兴趣的朋友一起看看吧... 目录一、前言二、什么是反投影图像三、反投影图像的概念四、反向投影的工作原理一、利用反向投影backproj

使用Python实现图像LBP特征提取的操作方法

《使用Python实现图像LBP特征提取的操作方法》LBP特征叫做局部二值模式,常用于纹理特征提取,并在纹理分类中具有较强的区分能力,本文给大家介绍了如何使用Python实现图像LBP特征提取的操作方... 目录一、LBP特征介绍二、LBP特征描述三、一些改进版本的LBP1.圆形LBP算子2.旋转不变的LB