ESP32 LVGL8.1 ——Style Creating transition 创建样式转换 (Style 10)
提示:本博客作为学习笔记,有错误的地方希望指正文章目录一、创建样式转换简介三、StyleLineAPI四、示例五、仿真结果一、创建样式转换简介本次主要讲述lvgl的创建样式转换,主要通过动画的形式去显示样式的转换。三、StyleLineAPI用于文字样式的API可以在lv_style_gen.h文件中找到,主要有以下几个APIlv_style_transition_dsc_init这个API的参数
·
提示:本博客作为学习笔记,有错误的地方希望指正
一、创建样式转换简介
本次主要讲述lvgl的创建样式转换,主要通过动画的形式去显示样式的转换。
三、创建样式转换 API
用于文字样式的API可以在lv_style_gen.h文件中找到,主要有以下几个API
lv_style_transition_dsc_init这个API的参数还是挺多的,
第一个参数 lv_style_transition_dsc_t * tr 样式转换描述符
第二个参数 const lv_style_prop_t props[] 描述动画特性的数组 最后一个数组值必须为0
第三个参数 lv_anim_path_cb_t path_cb 动画路径 动画路径的回调函数主要有以下几种
第四个参数 uint32_t time 样式转换持续的时间
第五个参数 uint32_t delay 样式转换前的延时(就是点击之后不立即执行,而是延时等待一段时间)
第六个参数 void * user_data 在转换动画中的自定义数据
/**
* 初始化一个转换描述符。
* @param tr转换描述符的指针
* @param道具一个数组的属性要转换。最后一个元素必须为零。
* @param path_cb动画路径(ease)回调。如果' NULL '线性路径将被使用。
* @param时间转换的持续时间[ms]
* @param delay在转换前的延迟[ms]
* @param user_data任何将被保存在转换动画中的自定义数据,当调用' path_cb '时可用
* @example
* const static lv_style_prop_t trans_props[] = {LV_STYLE_BG_OPA, LV_STYLE_BG_COLOR, 0};
*静态lv_style_transition_dsc_t trans1;
* lv_style_transition_dsc_init(&trans1, trans_props, NULL, 300, 0, NULL);
*/
void lv_style_transition_dsc_init(lv_style_transition_dsc_t * tr, const lv_style_prop_t props[], lv_anim_path_cb_t path_cb, uint32_t time, uint32_t delay, void * user_data);
void lv_style_set_transition(lv_style_t * style, const lv_style_transition_dsc_t * value); //设置过渡
lv_anim_path_cb_t path_cb 回调函数
int32_t lv_anim_path_linear(const lv_anim_t * a) ; //应用线性特性计算动画的当前值
int32_t lv_anim_path_ease_in(const lv_anim_t * a); //计算放慢起始阶段动画的当前值
int32_t lv_anim_path_ease_out(const lv_anim_t * a); //计算放慢结束阶段动画的当前值
int32_t lv_anim_path_ease_in_out(const lv_anim_t * a); // 应用“S”特征(余弦)计算动画的当前值
int32_t lv_anim_path_overshoot(const lv_anim_t * a); //计算动画的当前值,并在最后使用超调
int32_t lv_anim_path_bounce(const lv_anim_t * a); //计算一个动画的当前值3次反弹
int32_t lv_anim_path_step(const lv_anim_t * a); //计算应用步长特征的动画的当前值
三、示例
/*************************************************
* 函数名称 : lv_Creating_transition_style 转换样式
* 参 数 : 无
* 函数功能 : 转换样式
*************************************************/
void lv_Creating_transition_style()
{
//描述动画特性的数组
static const lv_style_prop_t props[] = {LV_STYLE_BG_COLOR,LV_STYLE_BORDER_COLOR,LV_STYLE_BORDER_WIDTH,0};
//样式转换描述符
//lv_anim_path_linear 应用线性特性计算动画的当前值
//lv_anim_path_ease_in 计算放慢起始阶段动画的当前值
//lv_anim_path_ease_out 计算放慢结束阶段动画的当前值
//lv_anim_path_ease_in_out 应用“S”特征(余弦)计算动画的当前值
//lv_anim_path_overshoot 计算动画的当前值,并在最后使用超调
//lv_anim_path_bounce 计算一个动画的当前值3次反弹
//lv_anim_path_step 计算应用步长特征的动画的当前值
static lv_style_transition_dsc_t trans_def;
lv_style_transition_dsc_init(&trans_def,props,lv_anim_path_linear,100,200,NULL); //初始化转换描述符。 100ms时显示的时间,200是开始显示的延时
//样式转换描述符
static lv_style_transition_dsc_t trans_pr;
lv_style_transition_dsc_init(&trans_pr,props,lv_anim_path_linear,500,0,NULL); //初始化转换描述符。
//定义默认样式
static lv_style_t style_def; //创建样式
lv_style_init(&style_def); //初始化样式
lv_style_set_transition(&style_def,&trans_def); //设置样式风格设置过渡
//定义默认样式
static lv_style_t style_pr; //创建样式
lv_style_init(&style_pr); //初始化样式
lv_style_set_bg_color(&style_pr,lv_palette_lighten(LV_PALETTE_RED,1)); //设置样式背颜色
lv_style_set_bg_opa(&style_pr,LV_OPA_COVER); //设置样式背景颜色透明度
lv_style_set_border_color(&style_pr,lv_palette_lighten(LV_PALETTE_BLUE,1)); //设置边框颜色
lv_style_set_border_width(&style_pr,5); //设置边框的宽度
lv_style_set_border_opa(&style_pr,LV_OPA_50); //设置边框的透明度
lv_style_set_transition(&style_pr,&trans_pr); //设置样式风格设置过渡
lv_obj_t * obj = lv_obj_create(lv_scr_act()); //创建对象
lv_obj_add_style(obj,&style_def,0); //添加对象的风格默认
lv_obj_add_style(obj,&style_pr,LV_STATE_PRESSED); //设置样式风格按压的时候
lv_obj_center(obj); //设置样式居中
}
更多推荐
已为社区贡献18条内容
所有评论(0)