Android开发之layout布局

        在android应用程序开发中，经常和布局文件(xml)打交道。好的布局，可以让程序界面优美，受用户青睐。因此布局是比较重要的学习点。由于xml语言在Android开发中独立，这个也就是布局和主控程序相对独立，增强耦合性。

        本文依次讲解LinearLayout，TableLayout，RelativeLayout以及Layout嵌套调用。

       一、LinearLayout

      线性布局，控件从上到下，也可从左到右。用一个例子来说明(<!-- >是注释符号)：

     <?xml version="1.0" encoding="utf-8"?>
<!-- 这是xml文件的头 包括 版本  编码方式   一般使用utf-8，支持中文
  -->
  <!--下面是声明LinearLayout线性布局 以及其命名空间 
    android:layout_width="fill_parent"//控件的宽度  包括填满父控件，填充其内容
    android:layout_height="fill_parent"//控件的高度
    android:orientation="vertical" //控件布局的方向 (包括垂直，水平排列)
    这三项控制这个线性布局本身的一些属性
    查看手册，其次利用ADT的助手按下alt+/
  -->
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
   
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical">"
    <!--
     android:id  —— 为控件指定相应的ID
     android:text —— 指定控件当中显示的文字，需要注意的是，这里尽量使用strings.xml文件当中的字符串
     android:gravity —— 指定控件内容的基本位置，比如说居中，居右等位置
     android:textSize —— 指定控件当中字体的大小
     android:background —— 指定该控件所使用的背景色,RGB命名法
     android:width —— 指定控件的宽度
     android:height —— 指定控件的高度
     android:padding* —— 指定控件的内边距，也就是说控件当中的内容
     android:sigleLine —— 如果设置为真的话，则将控件的内容在同一行当中进行显示  否则换行显示
     android:layout_weight 与其他子控件一起占整个控件布局的比例
     -->
     <!-- 下面是TextView 是 LinearLayout的子标签  在LinearLayout内部-->
    <TextView
        android:id="@+id/firstTextView"
        android:text="第一行"
        android:gravity="center_vertical"
        android:textSize="35pt"
        android:background="#aa0000"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:paddingLeft="10dip"
        android:paddingTop="20dip"
        android:paddingRight="30dip"
        android:paddingBottom="40dip"
        android:layout_weight="1"
        android:singleLine="true"
     />
    <TextView
     android:id="@+id/secondTextView"   
     android:text="第二行"
        android:gravity="center_vertical"
        android:textSize="15pt"
        android:background="#0000aa"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"
    />
<!-- 注： 两个TextView的android:layout_weight="1" 表示各自占整个屏的二分之一-->
</LinearLayout>

二、TableLayout

  表格方式进行布局管理，有行有列。这里有一例：

<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:stretchColumns="1" >
<!--android:stretchColumns="1"  第一列作为拉伸 即row1_column2拉伸  把父控件填满  Java计数从0开始-->
    <TableRow>
       <TextView
        android:text="@string/row1_column1"
        android:background="#aa0000"
        android:padding="3dip"
        />
        <TextView
        android:text="@string/row1_column2"
        android:gravity="center_horizontal"
         android:background="#00aa00"
        android:padding="3dip"
        />
        <TextView
        android:text="@string/row1_column3"
        android:gravity="right"
        android:background="#0000aa"
        android:padding="3dip"
        />
        <!--android:padding="3dip" 四边的内边距都是3dip  -->
    </TableRow>
   
     <TableRow>
       <TextView
        android:text="@string/row2_column1"
        android:padding="3dip"
        />
        <TextView
        android:text="@string/row2_column2"
        android:gravity="right"
        android:padding="3dip"
        />
    </TableRow>

</TableLayout>

   运行界面如下：                           

                                                                  

                

三、RelativeLayout

     相对布局，及可以对控件与控件之间的相对位置进行调整控制。同样一例：

   

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:padding="10px" >

    <TextView
        android:id="@+id/label"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="Type here:" />
    <EditText
        android:id="@+id/entry"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:background="@android:drawable/editbox_background"
        android:layout_below="@id/label"
        />
    <Button
        android:id="@+id/ok"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/entry"
        android:layout_alignParentRight="true"
        android:layout_marginLeft="10px"
        android:text="OK"
        />
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_toLeftOf="@+id/ok"
        android:layout_alignTop="@+id/ok"
        android:text="Cancel"
        />
<!--
 android:layout_above  将该控件的底部至于给定ID的控件之上
 android:layout_below  将该控件的顶部至于给定ID的控件之下
 android:layout_toLeftOf 将该控件的右边至于给定ID的控件的左边对齐
 android:layout_toRightOf 将该控件的左边至于给定ID的控件的右边对齐
 
 android:layout_alignBaseLine 该控件的baseline和给定ID的控件的baseline对齐
 android:layout_alignBottom   将该控件的底部与给定ID控件的底部对齐
 android:layout_alignLeft   将该控件的左边与给定ID控件的左边对齐
 android:layout_alignRight  将该控件的右边与给定ID控件的右边对齐
 android:layout_alignTop  将该控件的顶部与给定ID控件的顶部对齐
 
 android:alignParentBottom 如果该值为真，将控件的底部与父控件的底部对齐
 android:alignParentLeft 如果该值为真，将控件的左边与父控件的左边对齐
 android:alignParentRight 如果该值为真，将控件的右边与父控件的右边对齐
 android:alignParentTop  如果该值为真，将控件的顶部与父控件的顶部对齐
 
 android:layout_centerHorizontal 如果该值为真,该控件将被至于水平方向的中央
 android:layout_centerInParent 如果该值为真,该控件将被至于父控件水平方向和垂直方向的中央
 android:layout_centerVertical 如果该值为真,该控件将被至于垂直方向的中央
 -->
</RelativeLayout>

运行界面如下：         

                                            

 

  四、Layout嵌套

         多个Layout嵌套，实现更复杂的界面。有一例：

       

<?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:orientation="horizontal"
     android:layout_weight="1"
     >
    <TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="red"
        android:textSize="10pt"
        android:background="#aa0000"
        android:gravity="center_horizontal"
        android:padding="5dip"
        android:layout_weight="1"
        />
     <TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="green"
        android:textSize="10pt"
        android:background="#00aa00"
        android:gravity="center_horizontal"
        android:padding="5dip"
        android:layout_weight="1"
        />
        <TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="blue"
        android:textSize="10pt"
        android:background="#0000aa"
        android:gravity="center_horizontal"
        android:padding="5dip"
        android:layout_weight="1"
        />
    
 </LinearLayout>
   
 <LinearLayout
     android:layout_width="fill_parent"
     android:layout_height="fill_parent"
     android:orientation="horizontal"
     android:layout_weight="1"
     
     >
    <TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
     android:layout_width="fill_parent"
     android:layout_height="fill_parent"
     android:stretchColumns="0" >
 <TableRow>
       <TextView
        android:text="@string/row1_column1"
        android:background="#aa0000"
        android:padding="3dip"
        />
        <TextView
        android:text="@string/row1_column2"
        android:gravity="center_horizontal"
        android:background="#00aa00"
        android:padding="3dip"
        />
        <TextView
        android:text="@string/row1_column3"
        android:gravity="right"
        android:background="#0000aa"
        android:padding="3dip"
        />
        <!--android:padding="3dip" 四边的内边距都是3dip  -->
    </TableRow>
   
     <TableRow>
       <TextView
        android:text="@string/row2_column1"
        android:padding="3dip"
        />
        <TextView
        android:text="@string/row2_column2"
        android:gravity="right"
        android:padding="3dip"
        />
    </TableRow>
    </TableLayout>    
 </LinearLayout>
  
</LinearLayout>
   
<!--三个LinearLayout,一个父类，垂直排列；接着是一个子 LinearLayout,水平排列；
在接着是下一个子LinearLayout，垂直排列，这个 子LinearLayout内部再嵌套一个TableLayout
 -->

      效果如下：

                                      

 

  总结：LinearLayout，TableLayout比较基础，RelativeLayout比较灵活，嵌套需要组合，写程序时多修修改改，调整属性和参数，这样更易掌握。