五、部件样式（背景颜色、边框、轮廓、事件）

• 背景颜色
  • 添加普通样式
    • static lv_style_t style; /* 样式变量必须是全局变量或者静态变量 */
    • lv_obj_t *obj1 = lv_obj_create(lv_scr_act());
    • lv_obj_set_align(obj1,LV_ALIGN_RIGHT_MID);
    • lv_style_init(&style);
    • lv_style_set_bg_color(&style,lv_color_hex(0xf4b183));
    • lv_obj_add_style(obj1,&style,LV_STATE_DEFAULT);
    • 添加本地样式
      • lv_obj_t *obj2 = lv_obj_create(lv_scr_act());
      • lv_obj_set_align(obj2,LV_ALIGN_LEFT_MID);
      • lv_obj_set_style_bg_color(obj2,lv_color_hex(0xf4b183), LV_STATE_DEFAULT);
    • tips：二者的区别就是，普通样式可以共享，本地样式只能给某个对象使用（普通样式和本地样式可以类比全局和局部变量）
    • 样式生效条件

      

      • lv_obj_t *obj1 = lv_obj_create(lv_scr_act());
      • lv_obj_set_style_bg_color(obj1,lv_color_hex(0xf4b183), LV_STATE_PRESSED);
        • 默认状态

          

        • 长按状态（取消长按后，样式消失）

          

• 边框
  • lv_obj_t *obj1 = lv_obj_create(lv_scr_act());
  • lv_obj_set_align(obj1,LV_ALIGN_CENTER);
  • lv_obj_set_style_border_color(obj1, lv_color_hex(0xf75384), LV_STATE_DEFAULT); //设置边框颜色
  • lv_obj_set_style_border_width(obj1, 10, LV_STATE_DEFAULT); //设置边框宽度
  • lv_obj_set_style_border_opa(obj1, 50, LV_STATE_DEFAULT); //设置边框透明度，有效值0~255，和透明度成正比

    

• 轮廓（边框外的一层，与边框设置方式一致）
  • lv_obj_t *obj1 = lv_obj_create(lv_scr_act());
  • lv_obj_set_align(obj1,LV_ALIGN_CENTER);
  • lv_obj_set_style_border_color(obj1, lv_color_hex(0xf75384), LV_STATE_DEFAULT); //设置边框颜色
  • lv_obj_set_style_border_width(obj1, 10, LV_STATE_DEFAULT); //设置边框宽度
  • lv_obj_set_style_border_opa(obj1, 100, LV_STATE_DEFAULT); //设置边框透明度，有效值0~255，和透明度成正比
  • lv_obj_set_style_outline_color(obj1, lv_color_hex(0x0000a0), LV_STATE_DEFAULT); //设置轮廓颜色
  • lv_obj_set_style_outline_width(obj1, 10, LV_STATE_DEFAULT); //设置轮廓宽度
  • lv_obj_set_style_outline_opa(obj1, 100, LV_STATE_DEFAULT); //设置轮廓透明度，有效值0~255，和透明度成正比

    

• 设置部件中某部分的样式

  

  • lv_obj_t *slider = lv_slider_create(lv_scr_act());
  • lv_obj_set_align(slider, LV_ALIGN_CENTER);
  • lv_obj_set_style_bg_color(slider,lv_color_hex(0xf534a0),LV_STATE_DEFAULT|LV_PART_INDICATOR); /* 设置指示器颜色 */
  • lv_obj_set_style_bg_color(slider,lv_color_hex(0xf534a0),LV_STATE_DEFAULT|LV_PART_KNOB); /* 设置手柄颜色 */

    

• 事件（重要）
  • 1、简单事件回调
    • lv_obj_t *obj1 = lv_obj_create(lv_scr_act());
    • lv_obj_add_event_cb(obj1, my_event_cb, LV_EVENT_CLICKED, NULL); /* 按下并松开就会执行事件回调函数 */
    • static void my_event_cb(lv_event_t *e)
    • {
    • printf("LV_EVENT_CLICKED!!!\r\n");
    • }
  • 2、不同事件类型调用相同的回调函数
    • lv_obj_t *obj1 = lv_obj_create(lv_scr_act());
    • lv_obj_add_event_cb(obj1, my_event_cb, LV_EVENT_CLICKED, NULL);
    • lv_obj_add_event_cb(obj1, my_event_cb, LV_EVENT_LONG_PRESSED, NULL);
    • static void my_event_cb(lv_event_t *e)
    • {
    • lv_event_code_t code = lv_event_get_code(e);
    • if(code == LV_EVENT_CLICKED)
    • {
    • printf("LV_EVENT_CLICKED!!!\r\n");
    • }
    • else if(code == LV_EVENT_LONG_PRESSED)
    • {
    • printf("long pressed !!!\r\n");
    • }
    • }
    • tips：这里值得注意的是，添加创建一个事件时，传入的参数（回调函数，事件类型，userdata）都被一个结构体进行记录了的，这里事件回调函数可以通过形参获取到创建时的参数，一定有一个传参的行为在里面，其次是第一次接触GUI，对于这里长按触发和按下松开触发的灵敏性和实时性还是比较意外
  • 3、不同的对象调用相同回调函数
    • lv_obj_t *obj1;
    • lv_obj_t *obj2;
    • static void my_event_cb(lv_event_t *e)
    • {
    • lv_obj_t *target = lv_event_get_target(e);
    • if(target == obj1)
    • {
    • printf("obj1!!!\r\n");
    • }
    • else if(target == obj2)
    • {
    • printf("obj2!!!\r\n");
    • }
    • }
    • void my_gui(void)
    • {
    • obj1 = lv_obj_create(lv_scr_act());
    • lv_obj_add_event_cb(obj1, my_event_cb, LV_EVENT_CLICKED, NULL);
    • lv_obj_set_size(obj1,300,300);
    • obj2 = lv_obj_create(lv_scr_act());
    • lv_obj_add_event_cb(obj2, my_event_cb, LV_EVENT_LONG_PRESSED, NULL);
    • }
    • tips：这里有个点刚开始没想明白，为什么上面不同的事件类型调用相同的回调函数，可以直接进行判断，但是下面不同的对象调用相同的回调函数时，判断是哪个对象触发的，这个对象就需要写在全局位置才能被识别到，这里面最大的区别就是事件类型是一个枚举类型，但是对象是一个结构体类型变量，这里的事件类型是一个枚举类型，所以定义枚举变量之后，能够在成员中找到它的对应值，但是对象不一样，他是一个结构体变量，虽然在添加事件的时候虽然有记录，但是获取到对象需要对比时，这个拿来对比的对象就得是传进去的对象，所以得在全局得位置