代码分析
先上代码:
01// demo_create();
02
03 lv_obj_t * obj1;
04 obj1 = lv_obj_create(lv_scr_act(), NULL);
05 lv_obj_set_size(obj1, 100, 50);
06 lv_obj_set_style(obj1, &lv_style_plain_color);
07 lv_obj_align(obj1, NULL, LV_ALIGN_IN_LEFT_MID, 0, 0);
08
09 lv_obj_t * obj2;
10 obj2 = lv_obj_create(lv_scr_act(), obj1);
11 lv_obj_set_style(obj2, &lv_style_pretty_color);
12 lv_obj_align(obj2, NULL, LV_ALIGN_CENTER, 0, 0);
13
14 static lv_style_t style_shadow;
15 lv_style_copy(&style_shadow, &lv_style_pretty);
16 style_shadow.body.shadow.width = 6;
17 style_shadow.body.radius = LV_RADIUS_CIRCLE;
18
19 lv_obj_t * obj3;
20 obj3 = lv_obj_create(lv_scr_act(), obj2);
21 lv_obj_set_style(obj3, &style_shadow);
22 lv_obj_set_pos(obj3,350,200);
大家可以把第二节课中的代码main.c 中的main函数修改成上面一样的,屏蔽掉 demo_create(),然后增加后面的内容。
相信大家看代码就可以很直观的看出来,这里我们创建了三个对象,分别取名为obj1、obj2、obj3,然后对三个对象做了不同的操作。
对象1(obj1):
cpp代码:
1lv_obj_t * obj1;
2obj1 = lv_obj_create(lv_scr_act(), NULL);
3lv_obj_set_size(obj1, 100, 50);
4lv_obj_set_style(obj1, &lv_style_plain_color);
5lv_obj_align(obj1, NULL, LV_ALIGN_IN_LEFT_MID, 0, 0);
我们来一行一行的分析一下,后面的教程可能就不会想这样详细的去分析代码了,刚开始是为了方便大家理解:
前两行我们声明了对象1的一个结构体,然后我们通过lv_obj_create()创建了这个对象实例,其中指定其父对象为lv_scr_act(),这个代码什么意思呢?其实就是获取默认显示的被激活的窗口作为父对象,lv_scr_act()可以理解为是lv_screen_active()的缩写,相信这样写很多人就明白了,有时候我们需要理解是什么单词的缩写,可以帮助我们更好的理解代码,当然这也是很多人的不足之处,毕竟掌握好英语要比写好代码还要难~哈哈,相信大家应该都有这种感觉吧!
然后lv_obj_set_size(obj1, 100, 50)是设置对象1的大小,这个函数同时设置了对象的宽和高,你也可以使用lv_obj_set_width()和lv_obj_set_height()去分别设置对象的大小。
然后lv_obj_set_style(obj1, &lv_style_plain_color)是设置的对象1的样式(外观),其中lv_style_plain_color是默认的样式中的一样,还有很多其它的默认样式如下:
01lv_style_t lv_style_scr;
02lv_style_t lv_style_transp;
03lv_style_t lv_style_transp_fit;
04lv_style_t lv_style_transp_tight;
05lv_style_t lv_style_plain;
06lv_style_t lv_style_plain_color;
07lv_style_t lv_style_pretty;
08lv_style_t lv_style_pretty_color;
09lv_style_t lv_style_btn_rel;
10lv_style_t lv_style_btn_pr;
11lv_style_t lv_style_btn_tgl_rel;
12lv_style_t lv_style_btn_tgl_pr;
13lv_style_t lv_style_btn_ina;
每种样式之间都会有不一样的地方,大家可以自己去体验一下,这里就不一一给大家去展示了。
然后lv_obj_align(obj1, NULL, LV_ALIGN_IN_LEFT_MID, 0, 0)是设置当前对象与父对象的对齐样式,为什么是父对象呢?因为我们把第二个参数给的是NULL,此时会默认将父对象作为对齐的对象,然后LV_ALIGN_IN_LEFT_MID是对齐样式,也就是我们在上节课中给出的图中的那几种样式,大家也可以参考下面的样式代码:
view sourceprint?01/** Object alignment. */
02enum {
03 LV_ALIGN_CENTER = 0,
04 LV_ALIGN_IN_TOP_LEFT,
05 LV_ALIGN_IN_TOP_MID,
06 LV_ALIGN_IN_TOP_RIGHT,
07 LV_ALIGN_IN_BOTTOM_LEFT,
08 LV_ALIGN_IN_BOTTOM_MID,
09 LV_ALIGN_IN_BOTTOM_RIGHT,
10 LV_ALIGN_IN_LEFT_MID,
11 LV_ALIGN_IN_RIGHT_MID,
12
13 LV_ALIGN_OUT_TOP_LEFT,
14 LV_ALIGN_OUT_TOP_MID,
15 LV_ALIGN_OUT_TOP_RIGHT,
16 LV_ALIGN_OUT_BOTTOM_LEFT,
17 LV_ALIGN_OUT_BOTTOM_MID,
18 LV_ALIGN_OUT_BOTTOM_RIGHT,
19 LV_ALIGN_OUT_LEFT_TOP,
20 LV_ALIGN_OUT_LEFT_MID,
21 LV_ALIGN_OUT_LEFT_BOTTOM,
22 LV_ALIGN_OUT_RIGHT_TOP,
23 LV_ALIGN_OUT_RIGHT_MID,
24 LV_ALIGN_OUT_RIGHT_BOTTOM,
25};
26typedef uint8_t lv_align_t;
代码分析
先上代码:
01// demo_create();
02
03 lv_obj_t * obj1;
04 obj1 = lv_obj_create(lv_scr_act(), NULL);
05 lv_obj_set_size(obj1, 100, 50);
06 lv_obj_set_style(obj1, &lv_style_plain_color);
07 lv_obj_align(obj1, NULL, LV_ALIGN_IN_LEFT_MID, 0, 0);
08
09 lv_obj_t * obj2;
10 obj2 = lv_obj_create(lv_scr_act(), obj1);
11 lv_obj_set_style(obj2, &lv_style_pretty_color);
12 lv_obj_align(obj2, NULL, LV_ALIGN_CENTER, 0, 0);
13
14 static lv_style_t style_shadow;
15 lv_style_copy(&style_shadow, &lv_style_pretty);
16 style_shadow.body.shadow.width = 6;
17 style_shadow.body.radius = LV_RADIUS_CIRCLE;
18
19 lv_obj_t * obj3;
20 obj3 = lv_obj_create(lv_scr_act(), obj2);
21 lv_obj_set_style(obj3, &style_shadow);
22 lv_obj_set_pos(obj3,350,200);
大家可以把第二节课中的代码main.c 中的main函数修改成上面一样的,屏蔽掉 demo_create(),然后增加后面的内容。
相信大家看代码就可以很直观的看出来,这里我们创建了三个对象,分别取名为obj1、obj2、obj3,然后对三个对象做了不同的操作。
对象1(obj1):
cpp代码:
1lv_obj_t * obj1;
2obj1 = lv_obj_create(lv_scr_act(), NULL);
3lv_obj_set_size(obj1, 100, 50);
4lv_obj_set_style(obj1, &lv_style_plain_color);
5lv_obj_align(obj1, NULL, LV_ALIGN_IN_LEFT_MID, 0, 0);
我们来一行一行的分析一下,后面的教程可能就不会想这样详细的去分析代码了,刚开始是为了方便大家理解:
前两行我们声明了对象1的一个结构体,然后我们通过lv_obj_create()创建了这个对象实例,其中指定其父对象为lv_scr_act(),这个代码什么意思呢?其实就是获取默认显示的被激活的窗口作为父对象,lv_scr_act()可以理解为是lv_screen_active()的缩写,相信这样写很多人就明白了,有时候我们需要理解是什么单词的缩写,可以帮助我们更好的理解代码,当然这也是很多人的不足之处,毕竟掌握好英语要比写好代码还要难~哈哈,相信大家应该都有这种感觉吧!
然后lv_obj_set_size(obj1, 100, 50)是设置对象1的大小,这个函数同时设置了对象的宽和高,你也可以使用lv_obj_set_width()和lv_obj_set_height()去分别设置对象的大小。
然后lv_obj_set_style(obj1, &lv_style_plain_color)是设置的对象1的样式(外观),其中lv_style_plain_color是默认的样式中的一样,还有很多其它的默认样式如下:
01lv_style_t lv_style_scr;
02lv_style_t lv_style_transp;
03lv_style_t lv_style_transp_fit;
04lv_style_t lv_style_transp_tight;
05lv_style_t lv_style_plain;
06lv_style_t lv_style_plain_color;
07lv_style_t lv_style_pretty;
08lv_style_t lv_style_pretty_color;
09lv_style_t lv_style_btn_rel;
10lv_style_t lv_style_btn_pr;
11lv_style_t lv_style_btn_tgl_rel;
12lv_style_t lv_style_btn_tgl_pr;
13lv_style_t lv_style_btn_ina;
每种样式之间都会有不一样的地方,大家可以自己去体验一下,这里就不一一给大家去展示了。
然后lv_obj_align(obj1, NULL, LV_ALIGN_IN_LEFT_MID, 0, 0)是设置当前对象与父对象的对齐样式,为什么是父对象呢?因为我们把第二个参数给的是NULL,此时会默认将父对象作为对齐的对象,然后LV_ALIGN_IN_LEFT_MID是对齐样式,也就是我们在上节课中给出的图中的那几种样式,大家也可以参考下面的样式代码:
view sourceprint?01/** Object alignment. */
02enum {
03 LV_ALIGN_CENTER = 0,
04 LV_ALIGN_IN_TOP_LEFT,
05 LV_ALIGN_IN_TOP_MID,
06 LV_ALIGN_IN_TOP_RIGHT,
07 LV_ALIGN_IN_BOTTOM_LEFT,
08 LV_ALIGN_IN_BOTTOM_MID,
09 LV_ALIGN_IN_BOTTOM_RIGHT,
10 LV_ALIGN_IN_LEFT_MID,
11 LV_ALIGN_IN_RIGHT_MID,
12
13 LV_ALIGN_OUT_TOP_LEFT,
14 LV_ALIGN_OUT_TOP_MID,
15 LV_ALIGN_OUT_TOP_RIGHT,
16 LV_ALIGN_OUT_BOTTOM_LEFT,
17 LV_ALIGN_OUT_BOTTOM_MID,
18 LV_ALIGN_OUT_BOTTOM_RIGHT,
19 LV_ALIGN_OUT_LEFT_TOP,
20 LV_ALIGN_OUT_LEFT_MID,
21 LV_ALIGN_OUT_LEFT_BOTTOM,
22 LV_ALIGN_OUT_RIGHT_TOP,
23 LV_ALIGN_OUT_RIGHT_MID,
24 LV_ALIGN_OUT_RIGHT_BOTTOM,
25};
26typedef uint8_t lv_align_t;
举报