LVGL V8之transition

创建style

• 定义style属性

static const lv_style_prop_t props[] = { LV_STYLE_BG_COLOR, LV_STYLE_BORDER_COLOR,LV_STYLE_BORDER_WIDTH, 0 }; 

• 初时化style transition，线性动画lv_anim_path_linear播放， 延迟200ms后播放持续时间100ms

static lv_style_transition_dsc_t trans_def; lv_style_transition_dsc_init(&trans_def, props, lv_anim_path_linear, 100, 200,NULL); 

• 初时化按键按下的style transition,线性动画lv_anim_path_linear播放， 没有延迟，播放持续时间500ms

static lv_style_transition_dsc_t trans_pr; lv_style_transition_dsc_init(&trans_pr, props, lv_anim_path_linear, 500, 0, NULL); 

• 设置transition style

static lv_style_t style_def; lv_style_init(&style_def); lv_style_set_transition(&style_def, &trans_def); 

• 设置按键按下时的transition style

static lv_style_t style_pr; lv_style_init(&style_pr); lv_style_set_bg_color(&style_pr, lv_palette_main(LV_PALETTE_RED)); lv_style_set_border_width(&style_pr, 6); lv_style_set_border_color(&style_pr, lv_palette_darken(LV_PALETTE_RED, 3)); lv_style_set_transition(&style_pr, &trans_pr); 

• 创建obj对象，添加style,居中显示

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); 

完整代码，仅供参考

static void lv_example_style_10(void) { static const lv_style_prop_t props[] = { LV_STYLE_BG_COLOR, LV_STYLE_BORDER_COLOR,LV_STYLE_BORDER_WIDTH, 0 }; /* A default transition
    * Make it fast (100ms) and start with some delay (200 ms)*/ static lv_style_transition_dsc_t trans_def; lv_style_transition_dsc_init(&trans_def, props, lv_anim_path_linear, 100, 200,NULL); /* A special transition when going to pressed state
    * Make it slow (500 ms) but start without delay*/ 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_main(LV_PALETTE_RED)); lv_style_set_border_width(&style_pr, 6); lv_style_set_border_color(&style_pr, lv_palette_darken(LV_PALETTE_RED, 3)); lv_style_set_transition(&style_pr, &trans_pr); /*Create an object with the new style_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); } 

调用lv_example_style_10运行效果