完善资料让更多小伙伴认识你,还能领取20积分哦, 立即完善>
PingFang SC", Helvetica, Tahoma, Arial, "Hiragino Sans GB", "Microsoft YaHei", 微软雅黑, SimSun, 宋体, Heiti, 黑体, sans-serif;'>文章,将以下Demo代码复制到Demo工程test.c文件空白处.然后在test.c文件的create_test()函数中增加sw_test()函数测试。static void sw_event_handler(lv_obj_t * obj, lv_event_t event){ if(event == LV_EVENT_VALUE_CHANGED) { printf("State: %sn", lv_sw_get_state(obj) ? "On" : "Off"); }}void sw_test(void){ /*Create styles for the switch*/ static lv_style_t bg_style; static lv_style_t indic_style; static lv_style_t knob_on_style; static lv_style_t knob_off_style; lv_style_copy(&bg_style, &lv_style_pretty); bg_style.body.radius = LV_RADIUS_CIRCLE; bg_style.body.padding.top = 6; bg_style.body.padding.bottom = 6; lv_style_copy(&indic_style, &lv_style_pretty_color); indic_style.body.radius = LV_RADIUS_CIRCLE; indic_style.body.main_color = lv_color_hex(0x9fc8ef); indic_style.body.grad_color = lv_color_hex(0x9fc8ef); indic_style.body.padding.left = 0; indic_style.body.padding.right = 0; indic_style.body.padding.top = 0; indic_style.body.padding.bottom = 0; lv_style_copy(&knob_off_style, &lv_style_pretty); knob_off_style.body.radius = LV_RADIUS_CIRCLE; knob_off_style.body.shadow.width = 4; knob_off_style.body.shadow.type = LV_SHADOW_BOTTOM; lv_style_copy(&knob_on_style, &lv_style_pretty_color); knob_on_style.body.radius = LV_RADIUS_CIRCLE; knob_on_style.body.shadow.width = 4; knob_on_style.body.shadow.type = LV_SHADOW_BOTTOM; /*Create a switch and apply the styles*/ lv_obj_t *sw1 = lv_sw_create(lv_scr_act(), NULL); lv_sw_set_style(sw1, LV_SW_STYLE_BG, &bg_style); lv_sw_set_style(sw1, LV_SW_STYLE_INDIC, &indic_style); lv_sw_set_style(sw1, LV_SW_STYLE_KNOB_ON, &knob_on_style); lv_sw_set_style(sw1, LV_SW_STYLE_KNOB_OFF, &knob_off_style); lv_obj_align(sw1, NULL, LV_ALIGN_CENTER, 0, -50); lv_obj_set_event_cb(sw1, sw_event_handler); /*Copy the first switch and turn it ON*/ lv_obj_t *sw2 = lv_sw_create(lv_scr_act(), sw1); lv_sw_on(sw2, LV_ANIM_ON); lv_obj_align(sw2, NULL, LV_ALIGN_CENTER, 0, 50);}
可以看到这里的代码更多了,没错,相比之前的控件这里的代码显的更加多了,但是其实滑动按钮是一个非常简单的控件,而我们只是为了描述滑动按钮的样式,而这里我们需要设置这个滑动按钮控件里四个元素的样式,所以就显的有点复杂了,我们先来了解一下都有哪四个元素的样式: /** * Switch styles. */enum { LV_SW_STYLE_BG, /**< Switch background. */ LV_SW_STYLE_INDIC, /**< Switch fill area. */ LV_SW_STYLE_KNOB_OFF, /**< Switch knob (when off). */ LV_SW_STYLE_KNOB_ON, /**< Switch knob (when on). */};typedef uint8_t lv_sw_style_t; 准确的说也不完全是四个元素,那么第一个就是我们的背景样式也就是后面椭圆的样式,然后第二个是填充区域样式,这个填充区域实际上就是椭圆内部颜色的区域,当然这个颜色只有当你向右拨动滑块的时候才会显示出来。 然后第三个跟第四个就是我们那个滑块的样式了,这里我们只设置成了圆形。 这就是四个样式的设置,大家可以对比上面的代码仔细去阅读并理解一下。 lv_sw_set_style(sw1, LV_SW_STYLE_BG, &bg_style); lv_sw_set_style(sw1, LV_SW_STYLE_INDIC, &indic_style); lv_sw_set_style(sw1, LV_SW_STYLE_KNOB_ON, &knob_on_style); lv_sw_set_style(sw1, LV_SW_STYLE_KNOB_OFF, &knob_off_style); 然后接下来就是创建第一个滑动按钮,并分别设置我们的样式,然后我们设置回调函数为: lv_obj_set_event_cb(sw1, sw_event_handler); 我们可以在回调函数里处理滑动按钮的事件。 然后我们又创建了一个滑动按钮对象,这个对象的父对象是第一个滑动按钮,所以第一个所具有的样式和回调函数都继承来了,然后我们设置第二个默认为打开的状态: lv_sw_on(sw2, LV_ANIM_ON); OK,本节课就到这里,这个按钮的样式有点复杂,大家可以通过修改代码去尝试了解哪一个参数对应哪一个效果,我们下节课学习表格控件(lv_table),我们下节课再见! |
|
相关推荐 |
|
只有小组成员才能发言,加入小组>>
798 浏览 0 评论
1155 浏览 1 评论
2531 浏览 5 评论
2863 浏览 9 评论
移植了freeRTOS到STMf103之后显示没有定义的原因?
2713 浏览 6 评论
keil5中manage run-time environment怎么是灰色,不可以操作吗?
1086浏览 3评论
195浏览 2评论
461浏览 2评论
374浏览 2评论
M0518 PWM的电压输出只有2V左右,没有3.3V是怎么回事?
455浏览 1评论
小黑屋| 手机版| Archiver| 电子发烧友 ( 湘ICP备2023018690号 )
GMT+8, 2024-12-24 04:29 , Processed in 0.887127 second(s), Total 75, Slave 56 queries .
Powered by 电子发烧友网
© 2015 bbs.elecfans.com
关注我们的微信
下载发烧友APP
电子发烧友观察
版权所有 © 湖南华秋数字科技有限公司
电子发烧友 (电路图) 湘公网安备 43011202000918 号 电信与信息服务业务经营许可证:合字B2-20210191 工商网监 湘ICP备2023018690号