1.相对布局应用
首先我们需要新建一个文件,具体的创建方法可以参考上一节课的方法,但是本次的文件的类型为RelativeLayout;利用上节课所讲的添加照片的方法,把素材中的 abc.jpg 复制到 drawable 目录下,插入目标图片 abc,并将其设置为中央。
找到左侧的palette,选择imageView,并将imageView拖拽到画布上,此时会跳出一个面板,选择 abc 然后在点击OK 即可(如图1.1)
图1.1
选中插入的图片后,在右侧输入 cen 找到 layout_centerHorizontal 和 layout_centerVertical 并将其勾选为true,图片就可以自行调整到画布中间位置。
图1.2
如图1.3,利用相同的添加组件的方式,在左侧的palette列表中找到common列表,向画布添加button组件;在插入组件后,我们可以看到在画布上的组件的上、下、左、右四个方向上都有一个空心小圆,以在图片上方添加按钮为例,我们需要找到按钮下方的空心小圆,单击左键并拖拽到图片上方的空心小圆处(如图1.4)然后在右侧的design列表中,输入cen 找 layout_centerHorizontal 和 layout_centerVertical并勾选为图1.5,在勾选之前,我们可以先将button这个组件向下拉拽到与图片上方目标位置平行处在勾选 layout_centerHorizontal 和 layout_centerVertical。
在图片周围插入button组件的方式于此类似,只不过将空心小圆点的连接方向和拉拽方向不同,例如想要插入到图片左边,就将button组件上的右侧空心小圆点拉拽到图片左侧,然后调整位置并勾选 layout_centerHorizontal 和 layout_centerVertical即可。
PS: layout_centerHorizontal 和 layout_centerVertical 就是调整选中对象是否居中和调整选中对象是否可视
图1.3
图1.4
图1.5
最后找到MainActivity文件,找到红框所选区域把名称更换成你新建的文件名并点击右上方的运行按钮(此过程和新建文件的过程在后续教程中就不过多赘述)
图1.6
2.网格布局应用
新建一个文件类型为GridLayout的新文件,在design中找到 count,找到 columnCount 和 rowCount 并各自输入6和8,,即将网格布局设置为6行5列,在设置之前我们需要点击画布,选择画布为调整对象。(图2.1的行数有误)
图2.1
在左侧的palette列表中找到common列表,向画布先添加TextView组件然后再加入button组件如图2.2所示,修改button组件的text,如图2.3,一共插入17个button组件,将第一个“0”的layout_columnSpan组件占据的列数设置为3,并拉伸第一个“0”的大小,如图2.4;拉伸、调整textview的大小,如图2.5所示,具体大小根据个人调整
图2.2
图2.3
图2.4
图2.5
最后运行即可。