【Android】常见布局xml参数详解

• marginxxx 和 paddingxxx
• marginxxx
• paddingxxx
• LinearLayout
• layout_gravity
• gravity
• RelativeLayout
• gravity
• layout_centerxxx
• layout_below | layout_above | layout_toEndOf | layout_toStartOf
• layout_alignxxx

学而不思则罔，思而不学则殆
Android的布局参数实在是太多了，而且名称还都挺相近，傻傻分不清，所以就整理这篇文章来总结一下

---

marginxxx 和 paddingxxx

这两个种类的参数有什么很容易搞混，marginxxx 表示外部，paddingxxx表示内部

marginxxx

marginxxx 表示View外部边距，废话不多说，直接看效果；
layout_margin
layout_margin表示上下左右边距相同

    <LinearLayout        android:layout_width="match_parent"        android:layout_height="200dp"        android:background="@color/colorAccent">        <View            android:layout_width="match_parent"            android:layout_height="match_parent"            android:background="@color/red" />    </LinearLayout>    //添加android:layout_margin="16dp"    <LinearLayout        android:layout_width="match_parent"        android:layout_height="200dp"        android:background="@color/colorAccent">        <View            android:layout_width="match_parent"            android:layout_height="match_parent"            android:layout_margin="16dp"            android:background="@color/red" />    </LinearLayout>

layout_marginLeft
左边距

    <LinearLayout        android:layout_width="match_parent"        android:layout_height="200dp"        android:background="@color/colorAccent">        <View            android:layout_width="match_parent"            android:layout_height="match_parent"            android:layout_marginLeft="16dp"            android:background="@color/red" />    </LinearLayout>

layout_marginStart

    <LinearLayout        android:layout_width="match_parent"        android:layout_height="200dp"        android:background="@color/colorAccent">        <View            android:layout_width="match_parent"            android:layout_height="match_parent"            android:layout_marginStart="16dp"            android:background="@color/red" />    </LinearLayout>

layout_marginRight

    <LinearLayout        android:layout_width="match_parent"        android:layout_height="200dp"        android:background="@color/colorAccent">        <View            android:layout_width="match_parent"            android:layout_height="match_parent"            android:layout_marginRight="16dp"            android:background="@color/red" />    </LinearLayout>

layout_marginEnd

    <LinearLayout        android:layout_width="match_parent"        android:layout_height="200dp"        android:background="@color/colorAccent">        <View            android:layout_width="match_parent"            android:layout_height="match_parent"            android:layout_marginEnd="16dp"            android:background="@color/red" />    </LinearLayout>

其实layout_marginLeft和layout_marginRight在实际中会有如下提示，建议我们使用layout_marginStart和layout_marginEnd，为了能更好的兼容支持RTL布局，这种是一些特别的国家的布局，比如阿拉伯语就是这种布局。

layout_marginTop

    <LinearLayout        android:layout_width="match_parent"        android:layout_height="200dp"        android:background="@color/colorAccent">        <View            android:layout_width="match_parent"            android:layout_height="match_parent"            android:layout_marginTop="16dp"            android:background="@color/red" />    </LinearLayout>

layout_marginBottom

    <LinearLayout        android:layout_width="match_parent"        android:layout_height="200dp"        android:background="@color/colorAccent">        <View            android:layout_width="match_parent"            android:layout_height="match_parent"            android:layout_marginBottom="16dp"            android:background="@color/red" />    </LinearLayout>

layout_marginHorizontal

    <LinearLayout        android:layout_width="match_parent"        android:layout_height="200dp"        android:background="@color/colorAccent">        <View            android:layout_width="match_parent"            android:layout_height="match_parent"            android:layout_marginHorizontal="16dp"            android:background="@color/red" />    </LinearLayout>

layout_marginVertical

    <LinearLayout        android:layout_width="match_parent"        android:layout_height="200dp"        android:background="@color/colorAccent">        <View            android:layout_width="match_parent"            android:layout_height="match_parent"            android:layout_marginVertical="16dp"            android:background="@color/red" />    </LinearLayout>

paddingxxx

paddingxxx表示View的内边距

---

padding

    <LinearLayout        android:layout_width="match_parent"        android:layout_height="200dp"        android:background="@color/colorAccent"        android:orientation="vertical"        android:padding="16dp">        <View            android:layout_width="match_parent"            android:layout_height="match_parent"            android:background="@color/red" />    </LinearLayout>

paddingLeft

    <LinearLayout        android:layout_width="match_parent"        android:layout_height="200dp"        android:background="@color/colorAccent"        android:orientation="vertical"        android:paddingLeft="16dp">        <View            android:layout_width="match_parent"            android:layout_height="match_parent"            android:background="@color/red" />    </LinearLayout>

paddingStart

    <LinearLayout        android:layout_width="match_parent"        android:layout_height="200dp"        android:background="@color/colorAccent"        android:orientation="vertical"        android:paddingStart="16dp">        <View            android:layout_width="match_parent"            android:layout_height="match_parent"            android:background="@color/red" />    </LinearLayout>

paddingRight

    <LinearLayout        android:layout_width="match_parent"        android:layout_height="200dp"        android:background="@color/colorAccent"        android:orientation="vertical"        android:paddingRight="16dp">        <View            android:layout_width="match_parent"            android:layout_height="match_parent"            android:background="@color/red" />    </LinearLayout>

paddingEnd

    <LinearLayout        android:layout_width="match_parent"        android:layout_height="200dp"        android:background="@color/colorAccent"        android:orientation="vertical"        android:paddingEnd="16dp">        <View            android:layout_width="match_parent"            android:layout_height="match_parent"            android:background="@color/red" />    </LinearLayout>

其中如果使用paddingLeft或者paddingRight的时候会提示你建议使用：paddingStart或者paddingEnd为了更好地兼容RTL布局

paddingTop

    <LinearLayout        android:layout_width="match_parent"        android:layout_height="200dp"        android:background="@color/colorAccent"        android:orientation="vertical"        android:paddingTop="16dp">        <View            android:layout_width="match_parent"            android:layout_height="match_parent"            android:background="@color/red" />    </LinearLayout>

paddingBottom

    <LinearLayout        android:layout_width="match_parent"        android:layout_height="200dp"        android:background="@color/colorAccent"        android:orientation="vertical"        android:paddingBottom="16dp">        <View            android:layout_width="match_parent"            android:layout_height="match_parent"            android:background="@color/red" />    </LinearLayout>

paddingHorizontal
这个是：paddingStart和paddingEnd结合

    <LinearLayout        android:layout_width="match_parent"        android:layout_height="200dp"        android:background="@color/colorAccent"        android:orientation="vertical"        android:paddingHorizontal="16dp">        <View            android:layout_width="match_parent"            android:layout_height="match_parent"            android:background="@color/red" />    </LinearLayout>

paddingVertical
是paddingTop和paddingBottom的结合

    <LinearLayout        android:layout_width="match_parent"        android:layout_height="200dp"        android:background="@color/colorAccent"        android:orientation="vertical"        android:paddingVertical="16dp">        <View            android:layout_width="match_parent"            android:layout_height="match_parent"            android:background="@color/red" />    </LinearLayout>

---

LinearLayout

layout_gravity

表示位于父View的什么位置，要求我要位于父布局的什么位置
拥有的参数列表：

先看看啥都不设置的时候是什么样子

    <LinearLayout        android:layout_width="300dp"        android:layout_height="200dp"        android:background="@color/colorAccent"        android:orientation="vertical">        <View            android:layout_width="100dp"            android:layout_height="50dp"            android:background="@color/red" />    </LinearLayout>

end

    <LinearLayout        android:layout_width="300dp"        android:layout_height="200dp"        android:background="@color/colorAccent"        android:orientation="vertical">        <View            android:layout_width="100dp"            android:layout_height="50dp"            android:layout_gravity="end"            android:background="@color/red" />    </LinearLayout>

right

    <LinearLayout        android:layout_width="300dp"        android:layout_height="200dp"        android:background="@color/colorAccent"        android:orientation="vertical">        <View            android:layout_width="100dp"            android:layout_height="50dp"            android:layout_gravity="right"            android:background="@color/red" />    </LinearLayout>

center

    <LinearLayout        android:layout_width="300dp"        android:layout_height="200dp"        android:background="@color/colorAccent"        android:orientation="vertical">        <View            android:layout_width="100dp"            android:layout_height="50dp"            android:layout_gravity="center"            android:background="@color/red" />    </LinearLayout>

位于服务布局水平居中

center_horizontal

    <LinearLayout        android:layout_width="300dp"        android:layout_height="200dp"        android:background="@color/colorAccent"        android:orientation="vertical">        <View            android:layout_width="100dp"            android:layout_height="50dp"            android:layout_gravity="center_horizontal"            android:background="@color/red" />    </LinearLayout>

改变布局为水平布局
水平bottom

    <LinearLayout        android:layout_width="300dp"        android:layout_height="200dp"        android:background="@color/colorAccent"        android:orientation="horizontal">        <View            android:layout_width="100dp"            android:layout_height="50dp"            android:layout_gravity="bottom"            android:background="@color/red" />    </LinearLayout>

center

    <LinearLayout        android:layout_width="300dp"        android:layout_height="200dp"        android:background="@color/colorAccent"        android:orientation="horizontal">        <View            android:layout_width="100dp"            android:layout_height="50dp"            android:layout_gravity="center"            android:background="@color/red" />    </LinearLayout>

center_vertical

    <LinearLayout        android:layout_width="300dp"        android:layout_height="200dp"        android:background="@color/colorAccent"        android:orientation="horizontal">        <View            android:layout_width="100dp"            android:layout_height="50dp"            android:layout_gravity="center_vertical"            android:background="@color/red" />    </LinearLayout>

gravity

我要子View位于什么位置
默认

    <LinearLayout        android:layout_width="300dp"        android:layout_height="200dp"        android:background="@color/colorAccent"        android:orientation="vertical">        <View            android:layout_width="100dp"            android:layout_height="50dp"            android:background="@color/red" />    </LinearLayout>

right和end

    //right    <LinearLayout        android:layout_width="300dp"        android:layout_height="200dp"        android:background="@color/colorAccent"        android:gravity="right"        android:orientation="vertical">        ...    </LinearLayout>    //end    <LinearLayout        android:layout_width="300dp"        android:layout_height="200dp"        android:background="@color/colorAccent"        android:gravity="end"        android:orientation="vertical">        ...    </LinearLayout>

同样系统会提示我们建议使用end替代right,兼容rtl布局
left和start

    //start    <LinearLayout        android:layout_width="300dp"        android:layout_height="200dp"        android:background="@color/colorAccent"        android:gravity="start"        android:orientation="vertical">        ...    </LinearLayout>    //left    <LinearLayout        android:layout_width="300dp"        android:layout_height="200dp"        android:background="@color/colorAccent"        android:gravity="left"        android:orientation="vertical">        ...    </LinearLayout>

同样系统会提示我们建议使用start替代left,兼容rtl布局
bottom

    <LinearLayout        android:layout_width="300dp"        android:layout_height="200dp"        android:background="@color/colorAccent"        android:gravity="bottom"        android:orientation="vertical">        ...    </LinearLayout>

centerxxx
center

    <LinearLayout        android:layout_width="300dp"        android:layout_height="200dp"        android:background="@color/colorAccent"        android:gravity="center"        android:orientation="vertical">        <View            android:layout_width="100dp"            android:layout_height="50dp"            android:background="@color/red" />        <View            android:layout_width="100dp"            android:layout_height="50dp"            android:background="@color/red" />    </LinearLayout>

center_horizontal

    <LinearLayout        android:layout_width="300dp"        android:layout_height="200dp"        android:background="@color/colorAccent"        android:gravity="center_horizontal"        android:orientation="vertical">        <View            android:layout_width="100dp"            android:layout_height="50dp"            android:background="@color/red" />        <View            android:layout_width="100dp"            android:layout_height="50dp"            android:background="@color/red" />    </LinearLayout>

center_vertical

    <LinearLayout        android:layout_width="300dp"        android:layout_height="200dp"        android:background="@color/colorAccent"        android:gravity="center_vertical"        android:orientation="vertical">        <View            android:layout_width="100dp"            android:layout_height="50dp"            android:background="@color/red" />        <View            android:layout_width="100dp"            android:layout_height="50dp"            android:background="@color/red" />    </LinearLayout>

会把所有的子View作为一个整理居中展示

bottom|right
组合使用

    <LinearLayout        android:layout_width="300dp"        android:layout_height="200dp"        android:background="@color/colorAccent"        android:gravity="bottom|right"        android:orientation="vertical">        <View            android:layout_width="100dp"            android:layout_height="50dp"            android:background="@color/red" />        <View            android:layout_width="100dp"            android:layout_height="50dp"            android:background="@color/red" />    </LinearLayout>

---

RelativeLayout

相对布局是开发中也常会用到的一个布局

gravity

先来看看相对布局中的gravity属性的作用

默认展示样式

    <RelativeLayout        android:layout_width="300dp"        android:layout_height="200dp"        android:background="@color/colorAccent">        <View            android:id="@+id/test1"            android:layout_width="100dp"            android:layout_height="50dp"            android:background="@color/red" />    </RelativeLayout>

right|end

    //right    <RelativeLayout        android:layout_width="300dp"        android:layout_height="200dp"        android:gravity="right"        android:background="@color/colorAccent">        ...    </RelativeLayout>    //end    <RelativeLayout        android:layout_width="300dp"        android:layout_height="200dp"        android:gravity="end"        android:background="@color/colorAccent">        ...    </RelativeLayout>

同样建议使用end替换right
left|start

    //right    <RelativeLayout        android:layout_width="300dp"        android:layout_height="200dp"        android:gravity="left"        android:background="@color/colorAccent">        ...    </RelativeLayout>    //end    <RelativeLayout        android:layout_width="300dp"        android:layout_height="200dp"        android:gravity="start"        android:background="@color/colorAccent">        ...    </RelativeLayout>

bottom

    <RelativeLayout        android:layout_width="300dp"        android:layout_height="200dp"        android:gravity="bottom"        android:background="@color/colorAccent">        ...    </RelativeLayout>

center

    <RelativeLayout        android:layout_width="300dp"        android:layout_height="200dp"        android:background="@color/colorAccent"        android:gravity="center">        <View            android:id="@+id/test1"            android:layout_width="100dp"            android:layout_height="50dp"            android:background="@color/red" />        <View            android:id="@+id/test2"            android:layout_width="100dp"            android:layout_height="50dp"            android:layout_below="@id/test1"            android:background="@color/red" />    </RelativeLayout>

把两个子View做为一个整体居中展示
center_horizontal
水平居中

    <RelativeLayout        android:layout_width="300dp"        android:layout_height="200dp"        android:background="@color/colorAccent"        android:gravity="center_horizontal">        ...    </RelativeLayout>

center_vertical
竖直居中

    <RelativeLayout        android:layout_width="300dp"        android:layout_height="200dp"        android:background="@color/colorAccent"        android:gravity="center_vertical">        ...    </RelativeLayout>

组合使用


上面的这个参数都是父布局会要求所有的子View满足某种规则，加入不是所有的子View都想要居中，那么需要每个子View自己设置自己的参数

layout_centerxxx

layout_centerInParent
位于父布局正中

    <RelativeLayout        android:layout_width="300dp"        android:layout_height="200dp"        android:background="@color/colorAccent">        <View            android:id="@+id/test1"            android:layout_width="100dp"            android:layout_height="50dp"            android:layout_centerInParent="true"            android:background="@color/red" />            </RelativeLayout>

layout_centerHorizontal

    <RelativeLayout        android:layout_width="300dp"        android:layout_height="200dp"        android:background="@color/colorAccent">        <View            android:id="@+id/test1"            android:layout_width="100dp"            android:layout_height="50dp"            android:layout_centerHorizontal="true"            android:background="@color/red" />    </RelativeLayout>

layout_centerVertical

    <RelativeLayout        android:layout_width="300dp"        android:layout_height="200dp"        android:background="@color/colorAccent">        <View            android:id="@+id/test1"            android:layout_width="100dp"            android:layout_height="50dp"            android:layout_centerVertical="true"            android:background="@color/red" />    </RelativeLayout>

---

接下来看看RelativeLayout的一些特有布局参数

layout_below | layout_above | layout_toEndOf | layout_toStartOf

对齐方式
**layout_below **
位于某个布局的下方

    <RelativeLayout        android:layout_width="300dp"        android:layout_height="200dp"        android:background="@color/colorAccent">        <View            android:id="@+id/test1"            android:layout_width="100dp"            android:layout_height="50dp"            android:layout_centerInParent="true"            android:background="@color/red" />        <View            android:id="@+id/test2"            android:layout_width="50dp"            android:layout_height="25dp"            android:layout_below="@id/test1"            android:background="@color/yellow" />    </RelativeLayout>

layout_above
位于某个View的上方

    <RelativeLayout        android:layout_width="300dp"        android:layout_height="200dp"        android:background="@color/colorAccent">        <View            android:id="@+id/test1"            android:layout_width="100dp"            android:layout_height="50dp"            android:layout_centerInParent="true"            android:background="@color/red" />        <View            android:id="@+id/test2"            android:layout_width="50dp"            android:layout_height="25dp"            android:layout_above="@id/test1"            android:background="@color/yellow" />    </RelativeLayout>

layout_toStartOf|layout_toLeftOf

    <RelativeLayout        android:layout_width="300dp"        android:layout_height="200dp"        android:background="@color/colorAccent">        <TextView            android:id="@+id/test1"            android:layout_width="100dp"            android:layout_height="50dp"            android:layout_centerInParent="true"            android:background="@color/red"            android:text="你好" />        <TextView            android:id="@+id/test2"            android:layout_width="50dp"            android:layout_height="25dp"            android:background="@color/yellow"            android:layout_toLeftOf="@id/test1"            android:text="你好吗" />    </RelativeLayout>

    <RelativeLayout        android:layout_width="300dp"        android:layout_height="200dp"        android:background="@color/colorAccent">        <TextView            android:id="@+id/test1"            android:layout_width="100dp"            android:layout_height="50dp"            android:layout_centerInParent="true"            android:background="@color/red"            android:text="你好" />        <TextView            android:id="@+id/test2"            android:layout_width="50dp"            android:layout_height="25dp"            android:background="@color/yellow"            android:layout_toEndOf="@id/test1"            android:text="你好吗" />    </RelativeLayout>

---

layout_alignxxx

表示对齐方式

layout_alignLeft|layout_alignstart
左对齐也叫start对齐

    <RelativeLayout        android:layout_width="300dp"        android:layout_height="200dp"        android:background="@color/colorAccent">        <View            android:id="@+id/test1"            android:layout_width="100dp"            android:layout_height="50dp"            android:layout_centerInParent="true"            android:background="@color/red" />        <View            android:id="@+id/test2"            android:layout_width="50dp"            android:layout_height="25dp"            android:layout_alignLeft="@id/test1"            android:background="@color/yellow" />    </RelativeLayout>

layout_alignEnd|layout_alignright
右对齐或者end对齐

    <RelativeLayout        android:layout_width="300dp"        android:layout_height="200dp"        android:background="@color/colorAccent">        <View            android:id="@+id/test1"            android:layout_width="100dp"            android:layout_height="50dp"            android:layout_centerInParent="true"            android:background="@color/red" />        <View            android:id="@+id/test2"            android:layout_width="50dp"            android:layout_height="25dp"            android:layout_alignEnd="@id/test1"            android:background="@color/yellow" />    </RelativeLayout>

layout_alignTop
上对齐

    <RelativeLayout        android:layout_width="300dp"        android:layout_height="200dp"        android:background="@color/colorAccent">        <View            android:id="@+id/test1"            android:layout_width="100dp"            android:layout_height="50dp"            android:layout_centerInParent="true"            android:background="@color/red" />        <View            android:id="@+id/test2"            android:layout_width="50dp"            android:layout_height="25dp"            android:layout_alignTop="@id/test1"            android:background="@color/yellow" />    </RelativeLayout>

layout_alignBottom
下对齐

    <RelativeLayout        android:layout_width="300dp"        android:layout_height="200dp"        android:background="@color/colorAccent">        <View            android:id="@+id/test1"            android:layout_width="100dp"            android:layout_height="50dp"            android:layout_centerInParent="true"            android:background="@color/red" />        <View            android:id="@+id/test2"            android:layout_width="50dp"            android:layout_height="25dp"            android:layout_alignBottom="@id/test1"            android:background="@color/yellow" />    </RelativeLayout>

layout_alignParentBottom|layout_alignParentTop|layout_alignParentStart|layout_alignParentEnd
还是layout_alignParentStart和layout_alignParentright
这六种对齐方式是一样的，只是对齐的View是父View



layout_alignBaseline
两个TextView的文字下对齐

    <RelativeLayout        android:layout_width="300dp"        android:layout_height="200dp"        android:background="@color/colorAccent">        <TextView            android:id="@+id/test1"            android:text="你好"            android:textSize="24sp"            android:layout_width="100dp"            android:layout_height="50dp"            android:layout_centerInParent="true"            android:background="@color/red" />        <TextView            android:id="@+id/test2"            android:text="你好吗"            android:layout_width="50dp"            android:layout_height="25dp"            android:layout_alignBaseline="@id/test1"            android:background="@color/yellow" />    </RelativeLayout>

未完待续…

更多相关文章

1. 【Android】利用Android的网格布局写一个简单的计算器
2. Android布局管理器总结
3. 相对布局属性
4. Android xml manifest属性详解
5. Android Studio之安卓学习布局管理器
6. Android 9.0 Launcher源码分析（三）——Launcher的布局与多设备适配
7. Android相对布局属性全集
8. Android 入门前言之 --布局
9. 老罗Android开发视频教程 （android常用布局介绍）5集集合

随机推荐

1. android 无线连接eclipse
2. Android工程打包
3. Android(安卓)通过adb shell am broadcas
4. Android 百度地图笔记
5. [Android Studio导入第三方类库方法] Err
6. Android(安卓)Studio 中build.gradle文件
7. Android Studio开发（二）使用RecyclerView实
8. Android 静默更新apk
9. android 让5556和5554发发sms
10. （一百八十九）Android Jetpack 学习（三）—— A