17 lvgll 按键按下扩散高亮特效

按下显示红色 浮动放大阴影效果，松开回复
#if  1
void lv_100ask_demo_course_2_1_1(void)
{
    /*Init the style for the default state*/
    static lv_style_t style;
    lv_style_init(&style);

    lv_style_set_radius(&style, 3);

    lv_style_set_bg_opa(&style, LV_OPA_100);
    lv_style_set_bg_color(&style, lv_palette_main(LV_PALETTE_BLUE));
    lv_style_set_bg_grad_color(&style, lv_palette_darken(LV_PALETTE_BLUE, 2));
    lv_style_set_bg_grad_dir(&style, LV_GRAD_DIR_VER);

    lv_style_set_border_opa(&style, LV_OPA_40);
    lv_style_set_border_width(&style, 2);
    lv_style_set_border_color(&style, lv_palette_main(LV_PALETTE_GREY));

    lv_style_set_shadow_width(&style,2); 
    lv_style_set_shadow_color(&style, lv_palette_main(LV_PALETTE_GREY));
    lv_style_set_shadow_ofs_y(&style, 2);

    lv_style_set_outline_opa(&style, LV_OPA_COVER);  //透明度 
    lv_style_set_outline_color(&style, lv_palette_main(LV_PALETTE_BLUE));

    lv_style_set_text_color(&style, lv_color_white());  
    lv_style_set_pad_all(&style, 10);//四边 边距

    /*Init the pressed style*/
    static lv_style_t style_pr;
    lv_style_init(&style_pr);

    /*Add a large outline when pressed*/
    lv_style_set_outline_width(&style_pr, 30);
    lv_style_set_outline_opa(&style_pr, LV_OPA_TRANSP);

      lv_style_set_translate_y(&style_pr, 5); //y 偏移过渡
        lv_style_set_shadow_ofs_y(&style_pr, 3); //阴影y偏移 3
    // lv_style_set_bg_color(&style_pr, lv_palette_darken(LV_PALETTE_BLUE, 2));
    lv_style_set_bg_color(&style_pr, lv_palette_main(LV_PALETTE_RED));
    lv_style_set_bg_grad_color(&style_pr, lv_palette_darken(LV_PALETTE_BLUE, 4)); //渐变色

    /*Add a transition to the outline*/
    static lv_style_transition_dsc_t trans;
    static lv_style_prop_t props[] = {LV_STYLE_OUTLINE_WIDTH, LV_STYLE_OUTLINE_OPA, 0};
    lv_style_transition_dsc_init(&trans, props, lv_anim_path_linear, 300, 0, NULL); // 线性过渡动画初始化
/*
void lv_style_transition_dsc_init(
									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					//过渡动画用户变量
									)
 */
    lv_style_set_transition(&style_pr, &trans);  //设置过渡动画 

    lv_obj_t * btn1 = lv_btn_create(lv_scr_act());
    lv_obj_remove_style_all(btn1);                          /*Remove the style coming from the theme*/
    lv_obj_add_style(btn1, &style, 0);
    lv_obj_add_style(btn1, &style_pr, LV_STATE_PRESSED); //按下状态设置 样式 
    lv_obj_set_size(btn1, LV_SIZE_CONTENT, LV_SIZE_CONTENT);
    // lv_style_set_bg_color(btn1, lv_palette_main(LV_PALETTE_RED));
    lv_obj_center(btn1);

    lv_obj_t * label = lv_label_create(btn1);
    lv_label_set_text(label, "Button");
    lv_obj_center(label);
}

#endif