Android 布局详解 -一线性布局以及重要属性

Android 布局详解

Android 布局是开发中非常重要的一个知识部分，它的布局分为以下几种：

Linear Layout：线性布局 
Relative Layout：相对布局 
Table Layout：表格布局 
Grid View：网格布局 
Tab Layout：选项卡布局 
List View：列表布局

        如下图：

一、Linear Layout

简单来说，直着排，横着排都可以，还可以嵌套，此布局运用的非常多。

• android:orientation      定义布局内的方向水平或垂直（horizontal/vertical ） 
• android:layout_weight  子元素对未占用空间【水平或垂直】分配权重值，其值越小，权重越大。 
• android:layout_width -  宽（1.fill_parent: 父元素决定，2.wrap_content: 本身的内容决定）
• android:layout_height - 高（3.高直接指定一个 px 值）；
• android:gravity -          内容的排列形式（常用 top, bottom, left, right, center，Left|center_) 

下面直接上示例代码及截图： 

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

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

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:background="#aa0000"
            android:gravity="center_horizontal"
            android:text="red" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:background="#00aa00"
            android:gravity="center_horizontal"
            android:text="green" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:background="#0000aa"
            android:gravity="center_horizontal"
            android:text="blue" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:background="#aaaa00"
            android:gravity="center_horizontal"
            android:text="yellow" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:orientation="vertical" >

        <TextView
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="row one"
            android:textSize="15pt" />

        <TextView
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="row two"
            android:textSize="15pt" />

        <TextView
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="row three"
            android:textSize="15pt" />

        <TextView
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="row four"
            android:textSize="15pt" />
    </LinearLayout>

</LinearLayout>

下面详细详解这些配置的含义：

LinearLayout 标签的常用属性 
android:orientation="horizontal"：定义方向水平或垂直（horizontal/vertical ） 
android:layout_width="fill_parent" ：宽度填充满父控件的宽度 
android:layout_height="fill_parent"：宽度填充满父控件的高度 
android:layout_weight="1"：重量?可解释为权重，这是个什么意思呢，请看下图

我将这里的配置变了一下，

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

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:background="#aa0000"
        android:gravity="center_horizontal"
        android:text="red" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:layout_weight="2"
        android:background="#00aa00"
        android:gravity="center_horizontal"
        android:text="green" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:layout_weight="3"
        android:background="#0000aa"
        android:gravity="center_horizontal"
        android:text="blue" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:layout_weight="4"
        android:background="#aaaa00"
        android:gravity="center_horizontal"
        android:text="yellow" />

</LinearLayout>

可以看到我设置成了 1， 2， 3， 4，这四 TextView显示的宽度不一样了，具体是怎么算的，这个我们就不追究了，意思清楚就行，都设置为 1则平分，否则数给的越大，占的位置就越多。

再看一下TextView的解释

<TextView
    android:layout_width="wrap_content"
    android:layout_height="fill_parent"
    android:layout_weight="1"
    android:background="#aa0000"
    android:gravity="center_horizontal"
    android:text="red" />

android:text="red"：要显示的内容 
android:gravity="center_horizontal"：显示内容的对齐方式 
android:background="#aa0000" ：背景色 
android:layout_width="wrap_content"：宽度，包括自己的内容的宽度 
android:layout_height="fill_parent"：高度，填充父控件的高度 
android:layout_weight="1"：权重

其实含义如果懂些CSS属性的话，还是蛮好懂的，布局跟Div有点类似 
//类似一个外层DIV，里面的内容垂直布局android:orientation="vertical" 

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >
    
    //类似第一个子DIV，内容水平布局android:orientation="horizontal" 
    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:orientation="horizontal" >
    </LinearLayout>
    
     //类似第二个子DIV，内容垂直布局android:orientation="vertical" 
    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:orientation="vertical" >
    </LinearLayout>
    
</LinearLayout>