LVGL V8 animation

animation

/* INITIALIZE AN ANIMATION          		初始化一个动画
 *-----------------------*/
lv_anim_t a;
lv_anim_init(&a);

/* MANDATORY SETTINGS         				必选设置
 *------------------*/
/*Set the "animator" function       		设置“动画”功能*/
lv_anim_set_exec_cb(&a, (lv_anim_exec_xcb_t) lv_obj_set_x); 
/*Set the "animator" function*/
lv_anim_set_var(&a, obj); 
/*Length of the animation [ms]    			动画长度duration毫秒*/
lv_anim_set_time(&a, duration);
/*Set start and end values. E.g. 0, 150     开始值start，结束值end*/
lv_anim_set_values(&a, start, end);

/* OPTIONAL SETTINGS						可选设置
 *------------------*/
/*Time to wait before starting the animation [ms] 在开始动画之前等待的时间delay毫秒*/
lv_anim_set_delay(&a, delay);
/*Set path (curve). Default is linear  设置路径(曲线)。默认是线性的*/
lv_anim_set_path(&a, lv_anim_path_ease_in);
/*Set a callback to call when animation is ready.  设置一个回调函数，当动画准备好时调用 */
lv_anim_set_ready_cb(&a, ready_cb);
/*Set a callback to call when animation is started (after delay).  当动画启动时(延迟后)设置一个回调调用。 */
lv_anim_set_start_cb(&a, start_cb);
/*Play the animation backward too with this duration. Default is 0 (disabled) [ms] 在这个持续时间内向后播放动画。默认为0(禁用)[ms]*/
lv_anim_set_playback_time(&a, wait_time); 
/*Delay before playback. Default is 0 (disabled) [ms]  延迟在回放。默认为0(禁用)[ms]*/
lv_anim_set_playback_delay(&a, wait_time);
/*Number of repetitions. Default is 1.  LV_ANIM_REPEAT_INFINIT for infinite repetition 重复的数量。默认值为1。LV_ANIM_REPEAT_INFINIT表示无限重复*/
lv_anim_set_repeat_count(&a, wait_time);
/*Delay before repeat. Default is 0 (disabled) [ms]  重复前，先等待wait_time毫秒*/
lv_anim_set_repeat_delay(&a, wait_time);
/*true (default): apply the start vale immediately, false: apply start vale after delay when then anim. really starts.
True(默认):立即应用开始阀值，false:延迟后应用开始阀值。真正的开始。 */
lv_anim_set_early_apply(&a, true/false);

/* START THE ANIMATION
 *------------------*/
lv_anim_start(&a);                             /*Start the animation   开始动画*/

animation path

A path that can be animated. In the simplest case, it's linear, which means that the current value changes linearly between the start and the end. Paths are basically functions that calculate the next value to set based on the current state of the animation. Currently, there are the following built-in path functions (callback functions):

• lv_anim_path_linear linear animation
• lv_anim_path_step in one step
• lv_anim_path_ease_in is slow at first, with gradual effect
• lv_anim_path_ease_out The final speed is very slow, fading effect
• lv_anim_path_ease_in_out The beginning and the end are very slow, the gradual and gradual retreat effect
• lv_anim_path_overshoot exceeds final value
• lv_anim_path_bounce bounces a little from the final value (like hitting a wall)

lv_anim_path_t path;
lv_anim_path_init(&path);
lv_anim_path_set_cb(&path, lv_anim_path_overshoot);
lv_anim_path_set_user_data(&path, &foo); /* 自定义数据(可选) */

/* 在动画中设置路径 */
lv_anim_set_path(&a, &path);

speed and time

The lv_anim_speed_to_time(speed, start, end) function calculates the time required in milliseconds from the start value to the end value of the given speed.
Velocity is interpreted in units/second. For example, lv_anim_speed_to_time(20,0,100) will give 5000 milliseconds.
For example, in case of lv_obj_set_x unit is pixel, so 20 means 20 px/sec velocity, it takes 5s to go from position 0 to 100.

Refresh labels in real time

static void set_value(void * var, int32_t v)
{
    
    
    lv_label_set_text_fmt(var, "%d", v);
}

void lv_100ask_demo_course_2_1_1(void)
{
    
    
    lv_obj_t * obj = lv_obj_create(lv_scr_act());
    lv_obj_set_size(obj, LV_PCT(20), LV_PCT(20));
    lv_obj_align(obj, LV_ALIGN_CENTER, 0, 0);

    lv_obj_t * label = lv_label_create(obj);
    lv_label_set_text(label, "Hello, LVGL!");
    lv_obj_align(label, LV_ALIGN_CENTER, 0, 0);

    lv_anim_t a;
    lv_anim_init(&a);
    lv_anim_set_exec_cb(&a, set_value);
    lv_anim_set_var(&a, label);
    lv_anim_set_values(&a, 0, 100);					//设置开始和结束值
    lv_anim_set_time(&a, 2000);						
    lv_anim_set_repeat_delay(&a, 100);
    lv_anim_set_playback_time(&a, 500);
    lv_anim_set_playback_delay(&a, 100);
    lv_anim_set_repeat_count(&a, LV_ANIM_REPEAT_INFINITE);
    lv_anim_start(&a);
}

If you need to refresh a global variable in real time, you can directly replace v with the global variable gValue

static void set_value(void * var, int32_t v)
{
    
    
    lv_label_set_text_fmt(var, "%d", gValue);
}

Refresh the image in real time

static void set_value(void * img, int32_t v)
{
    
    
    lv_img_set_src(img, &image_256x80);        /*设置图片源 From variable*/
}