Android布局控件（包含线性布局，框架布局，表格布局，相对布局，约束布局）

Android提供了许多布局空间，对于不同的格式需求选择不同的布局控件，可以大大简化代码操作。下面为大家介绍一下以下经常用到的五种布局。

对了，补充一下，往常Android只有约束布局可以直接在Design页面拖动，现在都可以了。不过不推荐。

1.linear_layout（线性布局）

线性布局正如其名，他是呈线性分布的布局。只能控制水平或者垂直方向排布控件。可以用于设置登陆界面等简单排布的界面，下面有颜色填充一个线性布局，大家可以参考一下：

重点在于这句：android:orientation=“vertical” 在这个布局中控件垂直分布

android:orientation=“horizontal” 在这个布局中控件水平分布

如果复杂一些，大家灵活运用，各种嵌套肯定没问题。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:orientation="vertical"
        android:paddingLeft="10dp">              //设置左内边距

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="第一行"
            android:textColor="#ffffff"
            android:background="#550000"
            android:layout_weight="1"
            android:gravity="center_vertical"     //设置控件位置
            android:paddingLeft="20dp" />
        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="第二行"
            android:textColor="#ffffff"
            android:background="#005500"
            android:layout_weight="1"
            android:gravity="center_horizontal|center_vertical"/>
        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="第三行"
            android:textColor="#ffffff"
            android:background="#000055"
            android:layout_weight="1"
            android:gravity="right|center_vertical"
            android:layout_marginRight="10dp"/>     //设置右外边距

    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:orientation="horizontal">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:text="第一列"
            android:textColor="#ffffff"
            android:background="#550000"
            android:layout_weight="1"
            android:gravity="top|left"/>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:text="第二列"
            android:textColor="#ffffff"
            android:background="#005500"
            android:layout_weight="1"
            android:gravity="center_vertical|center_horizontal"/>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:text="第三列"
            android:textColor="#ffffff"
            android:background="#005555"
            android:layout_weight="1"
            android:gravity="right|bottom"/>
    </LinearLayout>

</LinearLayout>

运行结果如下：

2.frame_layout布局（框架布局）

框架布局很奇怪，因为他的所用控件是可以重叠的，控件直接没有约束，只能自己定义位置。不过肯定有它大展拳脚的地方，下面看个简单示例：

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

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="TestTestTest"
        android:textColor="#ff0000"/>

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button"
        android:textColor="#0000ff"/>

</FrameLayout>

运行结果如下：

当然也可以通过设置margin，padding，还有gravity设置位置，大家自己尝试。

3.TableLayout（表格布局）

表格布局也是常用的布局之一，把父控件划分成一个个表格，在表格栏中加入控件。

每一列的宽度取决于那一列最宽的那个，而每一行的高度不受其他行影响，列数取决于所有行中列最多的那个。在TableLayout中加入行需要添加<TableRow />。如果不在<TableRow />中加入控件，而直接在外面，会默认这个控件占一行。同时可以通过设置android：stretchColumns=“x”来控制第x+1列自动补齐剩余空间。代码如下：

<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:stretchColumns="1">     //设置第二列自动补满空间

    <TableRow>
        <TextView
            android:text="张三"
            android:background="#550000"
            android:textColor="#ffffff"
            android:padding="5dp"/>
        <TextView
            android:text="计算机"
            android:textColor="#ffffff"
            android:gravity="center_horizontal"   //设置内容显示位置
            android:background="#005500"/>
        <TextView
            android:text="85"
            android:textColor="#ffffff"
            android:background="#000055"/>
    </TableRow>

    <TableRow>
        <TextView
            android:text="李四"
            android:textColor="#000000"
            android:layout_width="100dp"/>
        <TextView
            android:text="数学"
            android:textColor="#ffffff"
            android:gravity="center_horizontal"
            android:background="#550000"/>
    </TableRow>

    <TableRow>
        <TextView
            android:text="王五"
            android:textColor="#ffffff"
            android:layout_width="50dp"
            android:layout_height="50dp"
            android:background="#555555"
            android:gravity="center_vertical"/>
        <TextView
            android:text="统计"
            android:textColor="#ffffff"
            android:gravity="center_horizontal"
            android:background="#000055"/>
        <TextView
            android:text="18000"
            android:textColor="#000000"/>
    </TableRow>

    <TextView
        android:text="赵六"
        android:textColor="#ffffff"
        android:layout_width="wrap_content"
        android:layout_height="50dp"
        android:background="#550000"
        android:gravity="center_horizontal|center_vertical"/>

</TableLayout>

运行结果如下：

4.RativeLayout（相对布局）相对布局也火过很长时间，因为只需要找到相对物就能把别的控件好好的安排了。其实大家看名字就能懂，下面给大家展示一下代码：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="20dp">

    <TextView
        android:id="@+id/label"
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:text="用户名："/>

    <EditText
        android:id="@+id/entry"
        android:layout_height="wrap_content"
        android:layout_width="match_parent"
        android:layout_below="@id/label"/>

    <Button
        android:id="@+id/cancel"
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_marginLeft="20px"
        android:layout_below="@id/entry"
        android:text="取消" />

    <Button
        android:id="@+id/ok"
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:layout_toLeftOf="@id/cancel"
        android:layout_alignTop="@id/cancel"
        android:text="确定"/>

</RelativeLayout>

是不是有几行代码看不太懂，下面给大家介绍几个关于这个控件的关键属性：

    a）、第一类:属性值为true或false
　　android:layout_centerHrizontal 水平居中
　　android:layout_centerVertical 垂直居中
　　android:layout_centerInparent 相对于父元素完全居中
　　android:layout_alignParentBottom 贴紧父元素的下边缘
　　android:layout_alignParentLeft 贴紧父元素的左边缘
　　android:layout_alignParentRight 贴紧父元素的右边缘
　　android:layout_alignParentTop 贴紧父元素的上边缘　　

　　b）、第二类：属性值必须为id的引用名“@id/id-name”
　　android:layout_below 在某元素的下方
　　android:layout_above 在某元素的的上方
　　android:layout_toLeftOf 在某元素的左边
　　android:layout_toRightOf 在某元素的右边
　　android:layout_alignTop 本元素的上边缘和某元素的的上边缘对齐
　　android:layout_alignLeft 本元素的左边缘和某元素的的左边缘对齐
　　android:layout_alignBottom 本元素的下边缘和某元素的的下边缘对齐
　　android:layout_alignRight 本元素的右边缘和某元素的的右边缘对齐



　　c）、第三类：属性值为具体的像素值，如30dip，40px
　　android:layout_marginBottom 离某元素底边缘的距离
　　android:layout_marginLeft 离某元素左边缘的距离
　　android:layout_marginRight 离某元素右边缘的距离
　　android:layout_marginTop 离某元素上边缘的距离

运行结果如下：