android 五大布局文件

浏览数：33 / 时间：2015年06月11日

android中为了适应各种布局的格式，提供了5种布局格式：

LinearLayout（线性布局）FrameLayout（帧布局）RelativeLayout（相对布局）TableLayout（表格布局）AbsoluteLayout(绝对布局)。

在android的项目中，我们要设计出让人耳目一新的界面，无时无刻都要用到这些布局格式。这些布局文件主要是以xml文件的格式存在，并且保存在/res/layout目录下。此文件夹下存着我们写的各种布局文件。例如：/res/layout/activity_main.xml.

下面我们详细介绍一下5种布局文件：

FrameLayout(帧布局)

此布局是最简单的布局形式，所添加的组件都是层叠的方式显示，第一个控件在最底层，最后添加的控件在视图显示的最上层，有点类似堆栈的形式。下面给出自己的一个实例：

 <?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:background="@drawable/background"
    android:orientation="vertical" >
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="300dip"
        android:orientation="vertical" >
        <Button
            android:id="@+id/start"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="startAnimation"
            />
        <Button
            android:id="@+id/stop"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="reversestartAnimation"
            />
        
    </LinearLayout>
    <!-- windmill layout -->
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent" >
        <FrameLayout
            android:id="@+id/windmill_layout"
            android:layout_width="match_parent"
            android:layout_height="80dip" >
            <ImageView
                android:id="@+id/im_roof"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:src="@drawable/windmill_roof" />
            <ImageView
                android:id="@+id/im_fan"
                android:layout_width="104dp"
                android:layout_height="106dp"
                android:layout_gravity="center"
                android:src="@drawable/windmill_fan" />
        </FrameLayout>
        <ImageView
            android:id="@+id/im_window"
            android:layout_width="80dip"
            android:layout_height="80dip"
            android:layout_alignParentBottom="true"
            android:layout_centerHorizontal="true"
            android:layout_marginBottom="20dp"
            android:src="@drawable/windmill_window" />
    </RelativeLayout>
</LinearLayout>

这是在RelativeLayout中嵌套一个FrameLayout布局。并且FrameLayout布局中有两个互相重叠的imageView对象。

2. AbsoluteLayout（绝对布局）

此布局中的子控件需要指定其坐标的相对位置的横纵坐标，否则此布局会像FrameLayout布局一样被排在左上角。此布局不能自动适应屏幕尺寸，所以少用，这里简单介绍一下定义。

3.TableLayout（表格布局）

定义：把子控件元素放置在行和列中，并且不显示行列和单元格边界线。每一行就是一个TableRow，也可以是一个View对象。在TableRow里面每天加一个控件，代表一列。

属性参数说明：

android：layout_colum :设置控件在TableRow中所处的列。

android: layout_span:设置此控件所跨越的列数。

android：collapseColumns:TableLayout指定的列隐藏，多列隐藏，逗号将隐藏类隔开。

android:StretchColumns:指定的列为可以伸展的列，多列伸展，用逗号隔开。

android：shrinkColmns：设置指定的列为可收缩的列。

4.LinearLayout（线性布局）

定义：在一个方向上（垂直或者水平）对齐所有子元素，一个垂直列表中每一行都只有一个子元素，一个水平列表只是一列高度。

<?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="wrap_content"
    android:gravity="center_vertical"
    android:orientation="vertical" >
    <TextView
        android:id="@+id/catalog"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:background="#E0E0E0"
        android:textColor="#454545"
        android:layout_weight="1.0"
        android:paddingLeft="5dip"
        android:paddingTop="5dip"
        android:paddingBottom="5dip"
        android:text="A"/>
    <TextView
        android:id="@+id/title"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_gravity="center_vertical"
        android:gravity="center_vertical"
        android:layout_weight="1.0"
        android:textColor="#336598"
        android:layout_marginLeft="5dip"
        android:paddingTop="10dip"
        android:paddingBottom="10dip"
        android:text="hhhh"/>
</LinearLayout>

5.RelativeLayout（相对布局）

定义：根据布局中子控件会根据他们设置的参照控件和参数进行相对布局。参照控件可以是父控件，也可以是其他的子控件，但是被参照的空间必须在参照它的控件之前定义。

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/umeng_socialize_comment_item"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:background="#ffffff"
    android:padding="5dp" >
    <!-- 头像 -->
    <RelativeLayout
        android:id="@+id/umeng_socialize_comment_item_profile_gp"
        android:layout_width="50dp"
        android:layout_height="130dp"
        android:layout_marginLeft="8dp"
        android:gravity="center" >
        <ImageView
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:background="@null" />
        <ImageView
            android:id="@+id/umeng_socialize_comment_avatar"
            android:layout_width="48dp"
            android:layout_height="48dp"
            android:layout_marginTop="8dp"
            android:layout_centerVertical="true"
            android:src="@drawable/umeng_socialize_default_avatar"
            android:scaleType="fitXY" />
    </RelativeLayout>
    <TextView
        android:id="@+id/umeng_socialize_comment_item_name"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="5dp"
        android:layout_toRightOf="@id/umeng_socialize_comment_item_profile_gp"
        android:ellipsize="end"
        android:ems="10"
        android:maxLines="1"
        android:textColor="@color/umeng_socialize_list_item_textcolor"
        android:textSize="14sp"
         />
    <!-- A123456789B123456789C123456789D123456789E123456789F123456789G123456789H123456789 -->
    <TextView
        android:id="@+id/umeng_socialize_comment_item_content"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="0dp"
        android:layout_toRightOf="@id/umeng_socialize_comment_item_profile_gp"
        android:layout_below="@id/umeng_socialize_comment_item_name"
        android:maxLength="35"
        android:layout_marginRight="18dp"
        android:scrollHorizontally="false"
        android:ellipsize="end"
        android:textColor="#646464"
        android:textSize="12sp" />
    <TextView
        android:id="@+id/umeng_socialize_comment_item_time"
        android:layout_marginTop="0dp"
        android:layout_marginLeft="8dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/umeng_socialize_comment_item_content"
        android:layout_toRightOf="@id/umeng_socialize_comment_item_profile_gp"
        android:textColor="@color/umeng_socialize_text_time"
        android:textSize="10sp" />
    <ImageView 
       android:id="@+id/umeng_socialize_comment_item_has_location"
       android:layout_marginTop="0dp"
        android:layout_alignParentRight="true"
        android:layout_centerVertical="true"
        android:layout_height="18dp"
        android:layout_width="18dp"
        android:scaleType="fitXY"
        android:visibility="invisible"
        android:src="@drawable/umeng_socialize_location_ic"/>
    
</RelativeLayout>

相对布局中的属性参数比较多，也比较重要的布局格式。介绍一下relativeLayout布局的属性参数：

android:layout_centerHorizontal 水平居中

android：layout_centervertical 垂直居中

android:layout_centerInParent 相对于父元素完全居中

android: layout_alignparentBottom 贴近父元素的下边缘

android:layout_alignparentLeft

android:layout_alignParentRight

android:layout_alignparentTop

android:layout_alignwithparentifmissing 如果对应的兄弟元素找不到，就以父元素作为参照物

android：layout_below="id/id-name" 在某元素下面

android:layot_top

android:layout_toLeftof