Styling the scrollbars

/**
* Styling the scrollbars
*/
static void lv_example_scroll_4(void)
{lv_obj_t* obj = lv_obj_create(lv_scr_act()); // 创建obj对象lv_obj_set_size(obj, 200, 100);   // 设置大小lv_obj_center(obj);        // 居中显示lv_obj_t* label = lv_label_create(obj);  // 在obj对象上创建label对象lv_label_set_text(label,"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\n""Etiam dictum, tortor vestibulum lacinia laoreet, mi neque consectetur neque, vel mattis odio dolor egestas ligula. \n""Sed vestibulum sapien nulla, id convallis ex porttitor nec. \n""Duis et massa eu libero accumsan faucibus a in arcu. \n""Ut pulvinar odio lorem, vel tempus turpis condimentum quis. Nam consectetur condimentum sem in auctor. \n""Sed nisl augue, venenatis in blandit et, gravida ac tortor. \n""Etiam dapibus elementum suscipit. \n""Proin mollis sollicitudin convallis. \n""Integer dapibus tempus arcu nec viverra. \n""Donec molestie nulla enim, eu interdum velit placerat quis. \n""Donec id efficitur risus, at molestie turpis. \n""Suspendisse vestibulum consectetur nunc ut commodo. \n""Fusce molestie rhoncus nisi sit amet tincidunt. \n""Suspendisse a nunc ut magna ornare volutpat."); // 设置文字内容/*Remove the style of scrollbar to have clean start*/lv_obj_remove_style(obj, NULL, LV_PART_SCROLLBAR | LV_STATE_ANY); /*Create a transition the animate the some properties on state change*/static const lv_style_prop_t props[] = { LV_STYLE_BG_OPA, LV_STYLE_WIDTH, 0 };static lv_style_transition_dsc_t trans;lv_style_transition_dsc_init(&trans, props, lv_anim_path_linear, 200, 0, NULL);  // transition描述初时化/*Create a style for the scrollbars*/static lv_style_t style;  // 定义style静态变量lv_style_init(&style);  // style初时化lv_style_set_width(&style, 4); /*Width of the scrollbar*/lv_style_set_pad_right(&style, 5); /*Space from the parallel side*/lv_style_set_pad_top(&style, 5); /*Space from the perpendicular side*/lv_style_set_radius(&style, 2);   //设置倒角大小lv_style_set_bg_opa(&style, LV_OPA_70); //设置背景透明度lv_style_set_bg_color(&style, lv_palette_main(LV_PALETTE_BLUE)); //设置背景颜色lv_style_set_border_color(&style, lv_palette_darken(LV_PALETTE_BLUE, 3)); //设置边框颜色lv_style_set_border_width(&style, 2); //设置边框宽度lv_style_set_shadow_width(&style, 8); // 设置阴影宽度lv_style_set_shadow_spread(&style, 2); // 设置阴影延伸值lv_style_set_shadow_color(&style, lv_palette_darken(LV_PALETTE_BLUE, 1)); // 设置阴影颜色lv_style_set_transition(&style, &trans); //设置transition的风格/*Make the scrollbars wider and use 100% opacity when scrolled*/static lv_style_t style_scrolled; // 定义滚动静态style变量lv_style_init(&style_scrolled);  //初时化stylelv_style_set_width(&style_scrolled, 8);  //设置style宽度值lv_style_set_bg_opa(&style_scrolled, LV_OPA_COVER); // 设置背景透明度lv_obj_add_style(obj, &style, LV_PART_SCROLLBAR);  //obj对象关联LV_PART_SCROLLBAR style  lv_obj_add_style(obj, &style_scrolled, LV_PART_SCROLLBAR | LV_STATE_SCROLLED); //obj对象关联滚动LV_PART_SCROLLBAR和LV_STATE_SCROLLED style
}

运行效果图

修改滚动style_scrolled宽度值

lv_style_set_width(&style_scrolled, 28);

再次运行效果值