持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第10天，点击查看活动详情
上一篇中我们介绍了Android六大布局中的第一个线性布局，线性布局也是我们经常需要用到的一种布局方式，我们经常用到它的weight，按照比例进行划分屏幕的时候，那么在对于一些需要多层嵌套的场景的时候，线性布局方式就显的有些不能应对，这时候就需要用到我们今天要介绍的这种布局方式，相对布局RelativeLayout。
相对布局的常用属性
相对布局分为两种，一种是相对于父组件，一种是相对于兄弟组件。
根据父组件定位
- centerVertial 相对于父组件垂直居中
- centerInParent 相对于父组件中央位置
- centerHorizontal 相对于父组件水平居中
根据兄弟组件定位
- layout_toLeftOf 相对于组件的左面
- layout_toRightOf 相对于件组件的右面
- layout_above 相对于组件的上面
- layout_below 相对于组件的下面
让我们写个android经典的梅花布局，来实际使用以下这些属性，以便于更好的理解这些属性真正的用法。
梅花布局
根据图片效果我们可以看的出来，这是由五个TextView组成，一个白色背景居中显示，四个黑色背景上下左右围绕它组成的布局结构。
- 首先创建一个RelativeLayout标签，在其中创建五个TextView。
- 其中一个给的id 为 text1，设置 layout_centerInParent 为 true，使其显示在中央位置。
- 剩余四个，给的背景为黑色，字体颜色为白色。
- 左右两侧设置layout_centerVertical 为 true 使其垂直居中。
- 上下两侧设置layout_Horizontal 为 true 使其水平居中。
- 左侧位置：设置layout_toLeftOf 为 @id/text1,使其位于 text1 的左边
- 右侧位置：设置layout_toRightOf 为 @id/text1,使其位于 text1 的右边
- 上侧位置：设置layout_above 为 @id/text1,使其位于 text1 的上边
- 下侧位置：设置layout_below 为 @id/text1,使其位于 text1 的下边
完成效果如下图：
再有就是对于组件偏移属性margin和填充属性padding，那么这两块的内容在我看来与css中的margin和padding使用方法是一样的。这里罗列一下相关属性的名称与css中的做一下对比，具体使用方法就不做演示了。
margin
| Android | css | 说明 |
|---|---|---|
| layout_ margin | margin | 组件上下左右的偏移量 |
| layout_ marginLeft | margin-left | 组件左边的偏移量 |
| layout_ marginRight | margin-right | 组件右边的偏移量 |
| layout_ marginTop | margin-top | 组件上边的偏移量 |
| layout_ marginBottom | margin-bottom | 组件下边的偏移量 |
pdding
| Android | css | 说明 |
|---|---|---|
| layout_ padding | padding | 组件内部上下左右的填充距离 |
| layout_ paddingLeft | padding-left | 组件内部左边填充距离 |
| layout_ paddingRight | padding-right | 组件内部右边的填充距离 |
| layout_ paddingTop | padding-top | 组件内部上边的填充距离 |
| layout_ paddingBottom | padding-bottom | 组件内部下边的填充距离 |
对于相对布局RelativeLayout 的介绍就先到这里，其实最重要的是我们得对于RelativeLayout 和 LinearLayout 相互结合的搭配使用。
