Android布局管理器详解(源码及图例)

1.线性布局管理器(LinearLayout)

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="15dp"
    android:orientation="vertical"
    android:gravity="center"
    tools:context=".MainActivity">
    <!--线性布局关键设置:-->
    <!--android:gravity="center" 组件居中-->
    <!--android:orientation="horizontal"    线性布局横向排列-->
    <!--android:orientation="vertical"    线性布局垂直排列-->

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="按钮1"/>

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="按钮2"/>

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="按钮3"/>

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="按钮4"/>

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="按钮5"/>

</LinearLayout>

---

2.相对布局管理器(RelativeLayout)

 

...................

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <!--android:layout_width="wrap_content" 按钮宽度取决于内容,height等同-->
    <!--android:layout_centerInParent="true" 于父窗口居中-->
    <TextView
        android:id="@+id/label"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="40sp"
        android:text="标   签"
        android:layout_centerInParent="true"/>

    <!--android:layout_above="@id/label"    于"@id/hello"的上方-->
    <!--android:layout_below="@id/label"    于"@id/hello"的下方-->
    <!--android:layout_toStartOf="@id/label"    button1右边与"@id/hello"左边平齐-->
    <!--android:layout_toEndOf="@id/label"    button1左边与"@id/hello"右边平齐-->
    <!--android:layout_marginTop="15dp" 头顶距"@id/hello" 15dp-->
    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="30sp"
        android:text="按钮"
        android:layout_below="@id/label"
        android:layout_toStartOf="@id/label"/>


</RelativeLayout>

---

3.表格布局管理器(TableLayout)

<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="15dp"
    android:stretchColumns="0,1,2,3,4"
    tools:context=".MainActivity">
    <!--android:collapseColumns="1" 隐藏第二列-->
    <!--android:stretchColumns="0,1,2" 拉伸1 2 3列-->
    <!--android:shrinkColumns="0" 允许收缩-->

    <TableRow>
        <TextView android:text="  1  " android:textSize="30sp"/>
        <TextView android:text="  2  " android:textSize="30sp"/>
        <TextView android:text="  3  " android:textSize="30sp"/>
        <TextView android:text="  4  " android:textSize="30sp"/>
        <TextView android:text="  5  " android:textSize="30sp"/>
    </TableRow>

    <TableRow>
        <TextView android:text="  6  " android:textSize="30sp"/>
        <TextView android:text="  7  " android:textSize="30sp"/>
        <TextView android:text="  8  " android:textSize="30sp"/>
        <TextView android:text="  9  " android:textSize="30sp"/>
        <TextView android:text="  10  " android:textSize="30sp"/>
    </TableRow>
</TableLayout>

---

4.网格布局管理器(GridLayout)

<?xml version="1.0" encoding="utf-8"?>
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="15dp"
    android:layout_gravity="fill"
    tools:context=".MainActivity">

    <!--
        第一行第一列
        android:layout_column="0"
        android:layout_row="0"
    -->
    <Button
        android:layout_column="0"
        android:layout_row="0"
        android:text="1"/>

    <!--
        第一行第二列
        android:layout_column="1"
        android:layout_row="0"
    -->
    <Button
        android:layout_column="1"
        android:layout_row="0"
        android:text="2"/>

    <!--
        第二行第二列
        android:layout_column="1"
        android:layout_row="0"
    -->
    <Button
        android:layout_column="1"
        android:layout_row="1"
        android:text="3"/>

    <!--
        占两行:android:layout_rowSpan="2"
        按钮拉伸:android:layout_gravity="fill_vertical"
    -->
    <Button
        android:layout_column="2"
        android:layout_row="1"
        android:layout_rowSpan="2"
        android:layout_gravity="fill_vertical"
        android:text="4"/>

    <Button
        android:layout_column="0"
        android:layout_row="2"
        android:layout_columnSpan="2"
        android:layout_gravity="fill_horizontal"
        android:text="5"/>

    <Button
        android:layout_row="3"
        android:layout_column="0"
        android:layout_columnSpan="3"
        android:layout_gravity="fill_horizontal"
        android:text="6" />

</GridLayout>

---

5.帧布局管理器(FrameLayout)

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <!--
        gravity="center|top":自身内容顶部居中
        layout_gravity="center":该组件位于父窗口居中
    -->
    <TextView
        android:layout_width="250dp"
        android:layout_height="250dp"
        android:text="1111"
        android:background="#2196F3"
        android:gravity="center|top"
        android:layout_gravity="center"/>

    <TextView
        android:layout_width="200dp"
        android:layout_height="200dp"
        android:text="2222"
        android:background="#00BCD4"
        android:gravity="center|top"
        android:layout_gravity="center"/>

    <TextView
        android:layout_width="150dp"
        android:layout_height="150dp"
        android:text="3333"
        android:background="#4CAF50"
        android:gravity="center|top"
        android:layout_gravity="center"/>
</FrameLayout>

---

6.约束布局管理器(ConstraintLayout )

相信当我们进行布局的时候，使用最多的应该是LinearLayout与RelativeLayout。而对于复杂一点的布局来说，他们之间的嵌套使用就最正常不过了。所以为了减少不必要的嵌套布局，Google特意开发的ConstraintLayout。它同时支持LinearLayout与RelativeLayout的所用特性。同时它完全通过约束来减少布局的嵌套。意思就是基本上最外层只需要一个ConstraintLayout节点就可以了。--------此段关于ConstraintLayout 的介绍摘自https://segmentfault.com/a/1190000014876944

待续....

---

7.绝对布局管理器(AbsoluteLayout)

待续...