13 lvgl动画效果实现

static void anim_x_cb(void * var, int32_t v)
{
    lv_obj_set_x(var, v);  //设置坐标
}

static void anim_size_cb(void * var, int32_t v)
{
    lv_obj_set_size(var, v, v);  //设置大小 
}

/**
 * Create a playback animation
 */
void lv_100ask_demo_course_2_1_1(void)
{

    lv_obj_t * obj = lv_obj_create(lv_scr_act());
    lv_obj_set_style_bg_color(obj, lv_palette_main(LV_PALETTE_RED), 0);
    lv_obj_set_style_radius(obj, LV_RADIUS_CIRCLE, 0);  //环形

    lv_obj_align(obj, LV_ALIGN_LEFT_MID, 10, 0);

    lv_anim_t a;
    lv_anim_init(&a);
    lv_anim_set_var(&a, obj);
    lv_anim_set_values(&a, 10, 100);  // 动画 图案大小 起始到结束
    lv_anim_set_time(&a, 1000);  //动画持续时间
    lv_anim_set_playback_delay(&a, 100);   //演示 延迟
    lv_anim_set_playback_time(&a, 300); 
    lv_anim_set_repeat_delay(&a, 500);
    lv_anim_set_repeat_count(&a, LV_ANIM_REPEAT_INFINITE);  //循环 次数
    lv_anim_set_path_cb(&a, lv_anim_path_bounce);  // 弹起效果

    lv_anim_set_exec_cb(&a, anim_size_cb);  //动画回调函数 ,大小变化
    lv_anim_start(&a);  //开始动画 
    lv_anim_set_exec_cb(&a, anim_x_cb);  //位置动画
    lv_anim_set_values(&a, 10, 100);   //位置 范围
    lv_anim_start(&a);
}

在这里插入图片描述

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
以下是一个简单的示例代码,演示了如何使用LVGL 8.3实现流星效果: ```c // 创建流星对象 typedef struct { lv_obj_t* obj; // LVGL对象 int x; // x坐标 int y; // y坐标 int speed; // 速度 } Meteor; // 动画回调函数,更新流星位置 void meteor_anim_cb(lv_obj_t* obj, lv_anim_value_t value) { Meteor* meteor = (Meteor*)lv_obj_get_user_data(obj); meteor->x = value; lv_obj_set_pos(meteor->obj, meteor->x, meteor->y); } // 创建流星效果 void create_meteor(lv_obj_t* parent, int x, int y, int speed) { lv_obj_t* meteor_obj = lv_obj_create(parent, NULL); lv_obj_set_style_local_bg_color(meteor_obj, LV_OBJ_PART_MAIN, LV_STATE_DEFAULT, LV_COLOR_WHITE); lv_obj_set_size(meteor_obj, 10, 40); lv_obj_set_pos(meteor_obj, x, y); Meteor* meteor = malloc(sizeof(Meteor)); meteor->obj = meteor_obj; meteor->x = x; meteor->y = y; meteor->speed = speed; lv_anim_t anim; lv_anim_init(&anim); lv_anim_set_var(&anim, meteor_obj); lv_anim_set_exec_cb(&anim, (lv_anim_exec_xcb_t)meteor_anim_cb); lv_anim_set_values(&anim, x, LV_HOR_RES - 10); // 从左到右移动 lv_anim_set_time(&anim, (LV_HOR_RES - x) * speed); lv_anim_set_playback_time(&anim, 0); lv_anim_set_playback_delay(&anim, 1000); lv_anim_set_repeat_count(&anim, LV_ANIM_REPEAT_INFINITE); lv_anim_set_repeat_delay(&anim, 1000); lv_anim_set_custom_exec_cb(&anim, (lv_anim_custom_exec_xcb_t)meteor_anim_cb); lv_anim_start(&anim); } // 示例代码的主函数 void main_func(void) { lv_obj_t* parent = lv_scr_act(); // 创建流星效果 create_meteor(parent, 0, 0, 2); create_meteor(parent, 50, 20, 3); create_meteor(parent, 100, 40, 4); while (1) { lv_task_handler(); lv_tick_inc(5); lv_delay_ms(5); } } ``` 你可以根据需要调整流星的起始位置、速度等参数。这只是一个简单示例,你可以根据LVGL的文档和你的具体需求进行更复杂的实现。希望对你有所帮助!

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值