TUI酷炫动画的使用

2023-11-02 18:59
文章标签 使用 动画 酷炫 tui

本文主要是介绍TUI酷炫动画的使用,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

描述 参考代码仓库例子

TUI支持各种酷炫动画的使用,所有动画一个函数代码就可以完成。
动画有这几类,普通控件动画屏幕切换动画图片动画

普通控件动画

下面接口函数,每一个接口使能一种动画,每种动画,有不同的路径效果(path_type变量),重点说下如下的参数:

  • obj需要动画的控件
  • need_time_ms控件完成动画的时间毫秒单位
  • start_XXX控件动画前的值
  • end_XXX控件动画结束后的值
  • path_type值变化的算法路径
  • end_cb动画结束的回调函数
typedef void(*tui_object_anim_cb_t)(tui_obj_t * obj);				//动画结束回调函数,用于动画结束后处理其他的事
typedef void(*tui_object_anim_value_cb_t)(tui_obj_t * obj, int32_t value);	//自定义值回调函数
void tui_obj_anim_stop(tui_obj_t * obj);					//强制停止动画void tui_obj_anim_fade_in(tui_obj_t * obj, uint32_t need_time_ms, tui_object_anim_cb_t end_cb);
void tui_obj_anim_fade_out(tui_obj_t * obj, uint32_t need_time_ms, tui_object_anim_cb_t end_cb);
void tui_obj_anim_mov_x(tui_obj_t * obj, uint32_t need_time_ms, tui_coord_t start_x, tui_coord_t end_x, tui_anim_path_e path_type, tui_object_anim_cb_t end_cb);
void tui_obj_anim_mov_y(tui_obj_t * obj, uint32_t need_time_ms, tui_coord_t start_y, tui_coord_t end_y, tui_anim_path_e path_type, tui_object_anim_cb_t end_cb);
void tui_obj_anim_set_width(tui_obj_t * obj, uint32_t need_time_ms, tui_coord_t start_width, tui_coord_t end_width, tui_anim_path_e path_type, tui_object_anim_cb_t end_cb);
void tui_obj_anim_set_height(tui_obj_t * obj, uint32_t need_time_ms, tui_coord_t start_height, tui_coord_t end_height, tui_anim_path_e path_type, tui_object_anim_cb_t end_cb);
void tui_obj_anim_set_vaule(tui_obj_t * obj, uint32_t need_time_ms, int32_t start_value, int32_t end_value, tui_anim_path_e path_type, tui_object_anim_value_cb_t value_cb, tui_object_anim_cb_t end_cb);

举例说明其中一种动画的7种路径效果,如图是不同路径的动画:
在这里插入图片描述

typedef enum tag_tui_anim_path {TUI_ANIM_PATH_LINEAR = 0,               /* 线性效果 */TUI_ANIM_PATH_EASE_IN,                  /* 加速效果 */TUI_ANIM_PATH_EASE_OUT,                 /* 减速效果 */TUI_ANIM_PATH_EASE_IN_OUT,              /* 加速减速效果 */TUI_ANIM_PATH_OVERSHOOT,                /* 越界回来效果 */TUI_ANIM_PATH_BOUNCE,                   /* 反弹来回效果 */TUI_ANIM_PATH_STEP,                     /* 时间到了直接显示 */
} tui_anim_path_e;

测试代码如下:

static void tui_object_anim0_end_cb(tui_obj_t * obj);
static void tui_object_anim1_end_cb(tui_obj_t * obj);
static void tui_object_anim2_end_cb(tui_obj_t * obj);
static void tui_object_anim3_end_cb(tui_obj_t * obj);
static void tui_object_anim4_end_cb(tui_obj_t * obj);
static void tui_object_anim5_end_cb(tui_obj_t * obj);
static void tui_object_anim6_end_cb(tui_obj_t * obj);static void tui_object_anim0_end_cb(tui_obj_t * obj)
{tui_obj_anim_mov_x(TUI_OBJ(HOME_MAIN_VIEW_CONTAINER_3), 1000, 58, 720, TUI_ANIM_PATH_EASE_IN, tui_object_anim1_end_cb);}
static void tui_object_anim1_end_cb(tui_obj_t * obj)
{tui_obj_anim_mov_x(TUI_OBJ(HOME_MAIN_VIEW_CONTAINER_4), 1000, 58, 720, TUI_ANIM_PATH_EASE_OUT, tui_object_anim2_end_cb);}
static void tui_object_anim2_end_cb(tui_obj_t * obj)
{tui_obj_anim_mov_x(TUI_OBJ(HOME_MAIN_VIEW_CONTAINER_5), 1000, 58, 720, TUI_ANIM_PATH_EASE_IN_OUT, tui_object_anim3_end_cb);}
static void tui_object_anim3_end_cb(tui_obj_t * obj)
{tui_obj_anim_mov_x(TUI_OBJ(HOME_MAIN_VIEW_CONTAINER_6), 1000, 58, 720, TUI_ANIM_PATH_OVERSHOOT, tui_object_anim4_end_cb);}
static void tui_object_anim4_end_cb(tui_obj_t * obj)
{tui_obj_anim_mov_x(TUI_OBJ(HOME_MAIN_VIEW_CONTAINER_7), 1000, 58, 720, TUI_ANIM_PATH_BOUNCE, tui_object_anim5_end_cb);}
static void tui_object_anim5_end_cb(tui_obj_t * obj)
{tui_obj_anim_mov_x(TUI_OBJ(HOME_MAIN_VIEW_CONTAINER_8), 1000, 58, 720, TUI_ANIM_PATH_STEP, tui_object_anim6_end_cb);}
static void tui_object_anim6_end_cb(tui_obj_t * obj)
{tui_obj_anim_mov_x(TUI_OBJ(HOME_MAIN_VIEW_CONTAINER_2), 1000, 58, 720, TUI_ANIM_PATH_LINEAR, tui_object_anim0_end_cb);
}

屏幕切换动画

下面接口函数是屏幕的一般切换, 其中有10种切换效果,重点说下如下的参数::

  • new_scr需要显示的视图
  • old_scr旧视图需要删除
  • anim_type屏幕的切换效果类型
  • need_time_ms完成动画的时间毫秒单位
  • auto_del_old_scr是否tui_obj_del删除旧视图
  • end_cb动画结束的回调函数
typedef enum tag_tui_scr_load_anim {TUI_SCR_LOAD_ANIM_NONE = 0,             /* 无动画 */TUI_SCR_LOAD_ANIM_OVER_LEFT,            /* 单向左移动 */TUI_SCR_LOAD_ANIM_OVER_RIGHT,           /* 单向右移动 */TUI_SCR_LOAD_ANIM_OVER_TOP,             /* 单向上移动 */TUI_SCR_LOAD_ANIM_OVER_BOTTOM,          /* 单向下移动 */TUI_SCR_LOAD_ANIM_MOVE_LEFT,            /* 双向左移动 */TUI_SCR_LOAD_ANIM_MOVE_RIGHT,           /* 双向右移动 */TUI_SCR_LOAD_ANIM_MOVE_TOP,             /* 双向上移动 */TUI_SCR_LOAD_ANIM_MOVE_BOTTOM,          /* 双向下移动 */TUI_SCR_LOAD_ANIM_FADE_ON,              /* 双淡入淡出 */
} tui_scr_load_anim_e;void tui_screen_load_anim(tui_obj_t * new_scr, tui_obj_t * old_scr, tui_scr_load_anim_e anim_type, uint32_t need_time_ms, bool auto_del_old_scr, tui_object_anim_cb_t end_cb);

各种效果,可以参考 home.c

图片动画

  • image图片控件,也可以设置不同图片切换的动画,每张图片的切换时间一样,如:
    在这里插入图片描述

  • gif控件动画

  • animation动画控件,如图
    在这里插入图片描述

各种效果,可以参考 animation

注意

各种动画相互独立,在普通控件动画里面,各种动画可以一起使用,控制一个控件对象。

这篇关于TUI酷炫动画的使用的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



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

相关文章

shell编程之函数与数组的使用详解

《shell编程之函数与数组的使用详解》:本文主要介绍shell编程之函数与数组的使用,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录shell函数函数的用法俩个数求和系统资源监控并报警函数函数变量的作用范围函数的参数递归函数shell数组获取数组的长度读取某下的

使用Python开发一个带EPUB转换功能的Markdown编辑器

《使用Python开发一个带EPUB转换功能的Markdown编辑器》Markdown因其简单易用和强大的格式支持,成为了写作者、开发者及内容创作者的首选格式,本文将通过Python开发一个Markd... 目录应用概览代码结构与核心组件1. 初始化与布局 (__init__)2. 工具栏 (setup_t

Python虚拟环境终极(含PyCharm的使用教程)

《Python虚拟环境终极(含PyCharm的使用教程)》:本文主要介绍Python虚拟环境终极(含PyCharm的使用教程),具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,... 目录一、为什么需要虚拟环境?二、虚拟环境创建方式对比三、命令行创建虚拟环境(venv)3.1 基础命令3

Python Transformer 库安装配置及使用方法

《PythonTransformer库安装配置及使用方法》HuggingFaceTransformers是自然语言处理(NLP)领域最流行的开源库之一,支持基于Transformer架构的预训练模... 目录python 中的 Transformer 库及使用方法一、库的概述二、安装与配置三、基础使用:Pi

关于pandas的read_csv方法使用解读

《关于pandas的read_csv方法使用解读》:本文主要介绍关于pandas的read_csv方法使用,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录pandas的read_csv方法解读read_csv中的参数基本参数通用解析参数空值处理相关参数时间处理相关

使用Node.js制作图片上传服务的详细教程

《使用Node.js制作图片上传服务的详细教程》在现代Web应用开发中,图片上传是一项常见且重要的功能,借助Node.js强大的生态系统,我们可以轻松搭建高效的图片上传服务,本文将深入探讨如何使用No... 目录准备工作搭建 Express 服务器配置 multer 进行图片上传处理图片上传请求完整代码示例

SpringBoot条件注解核心作用与使用场景详解

《SpringBoot条件注解核心作用与使用场景详解》SpringBoot的条件注解为开发者提供了强大的动态配置能力,理解其原理和适用场景是构建灵活、可扩展应用的关键,本文将系统梳理所有常用的条件注... 目录引言一、条件注解的核心机制二、SpringBoot内置条件注解详解1、@ConditionalOn

Python中使用正则表达式精准匹配IP地址的案例

《Python中使用正则表达式精准匹配IP地址的案例》Python的正则表达式(re模块)是完成这个任务的利器,但你知道怎么写才能准确匹配各种合法的IP地址吗,今天我们就来详细探讨这个问题,感兴趣的朋... 目录为什么需要IP正则表达式?IP地址的基本结构基础正则表达式写法精确匹配0-255的数字验证IP地

使用Python实现全能手机虚拟键盘的示例代码

《使用Python实现全能手机虚拟键盘的示例代码》在数字化办公时代,你是否遇到过这样的场景:会议室投影电脑突然键盘失灵、躺在沙发上想远程控制书房电脑、或者需要给长辈远程协助操作?今天我要分享的Pyth... 目录一、项目概述:不止于键盘的远程控制方案1.1 创新价值1.2 技术栈全景二、需求实现步骤一、需求

Spring LDAP目录服务的使用示例

《SpringLDAP目录服务的使用示例》本文主要介绍了SpringLDAP目录服务的使用示例... 目录引言一、Spring LDAP基础二、LdapTemplate详解三、LDAP对象映射四、基本LDAP操作4.1 查询操作4.2 添加操作4.3 修改操作4.4 删除操作五、认证与授权六、高级特性与最佳