為了更好的管理Android應用的用戶界面裡的個組件,Android提供了佈局管理器,通過佈局管理器,Android應用的圖形用戶界面具有良好的平台無關性。這裡什麼叫平台的無關性呢?就是說不同手機。我們知道不同手機它們的屏幕的分辨率、尺寸並不完全相同,而Android的佈局管理器可以根據運行平台來調整組件的大小,而我們所需要做的就是選擇合適的佈局管理器。

 與Swing編程不同的是,Android的佈局管理器本身就是一個UI組件,所有的佈局管理器都是ViewGroup的子類:

 

 

 

 

我們從上圖也可以發現,所有佈局都可作為容器類使用,因此可以調用多個重載的addView() 向佈局管理器中添加組件,當然我們也可以用一個佈局管理器嵌套其他佈局管理器。

 

一、線性佈局

       線性佈局是由LinearLayout 類來代表的,線性佈局有點像AWT 編程裡的FlowLayout ,它們都會將容器裡的組件一個挨著一個排列起來,LinearLayout 不僅可以控制各組件橫向排列,也可以控制縱向排列(android:orientation="vertical" 控制);

       線性佈局與AWT 中FlowLayout 的組大區別在於:Android 的線性佈局不會換行,當組件一個挨著一個排到頭了,剩下的組件將不會被顯示出來。在Awt 中FlowLayout 則會另起一行排列多出來的組件。

LinearLayout 的常用XML 屬性及相關方法

XML 屬性

相關方法

說明

Android:gravity

setGravity(int)

設置佈局管理器內組件對齊方式,該屬性支持top、buttom 、left 、center_vertical 、等等,可以同時指定多種對齊方式,多個屬性值用豎線隔開,豎線前後不能有空格

android:orientation

setOrientation(int)

設置佈局管理器內組件的排列方式,vertical: 垂直,默認horizontal: 水平

 

通過Activity代碼的形式完成佈局,此時就不需要xml配置文件了 

Java代碼  
  1. package com.iflytek.activity;  
  2.   
  3. import android.app.Activity;  
  4. import android.os.Bundle;  
  5. import android.view.ViewGroup;  
  6. import android.widget.LinearLayout;  
  7. import android.widget.TextView;  
  8.   
  9. public class LayoutProjectActivity extends Activity {  
  10.     /** Called when the activity is first created. */  
  11.     @Override  
  12.     public void onCreate(Bundle savedInstanceState) {  
  13.         super.onCreate(savedInstanceState);  
  14.         // setContentView(R.layout.main);  
  15.         // setContentView(R.layout.linearlayout);  
  16.   
  17.         LinearLayout linearLayout = new LinearLayout(this);  
  18.         LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(  
  19.                 ViewGroup.LayoutParams.FILL_PARENT,  
  20.                 ViewGroup.LayoutParams.FILL_PARENT);  
  21.         linearLayout.setOrientation(LinearLayout.VERTICAL);  
  22.         LinearLayout.LayoutParams txtParams = new LinearLayout.LayoutParams(  
  23.                 ViewGroup.LayoutParams.FILL_PARENT,  
  24.                 ViewGroup.LayoutParams.WRAP_CONTENT);  
  25.         TextView textView = new TextView(this);  
  26.         textView.setLayoutParams(txtParams);  
  27.         textView.setText("xdwang");  
  28.         textView.setTextSize(20);  
  29.         linearLayout.addView(textView);  
  30.         super.setContentView(linearLayout, layoutParams);  
  31.   
  32.     }  
  33. }  

 

 

二、表格佈局

       表格佈局由TableLayout 所代表,表格佈局採用行列的形式管理UI 組件,TableLayout 並不需要明確的聲明包含多少行、多少列,而是通過添加TableRow 、其他組件來控制表格的行數和列數。

       每次向TableLayout 中添加一個TableRow ,該TableRow 就是一個表格行,TableRow 也是容器,因此它也可以不斷地添加其他組件,每添加一個子組件該表格就增加一列。

如果直接向TableLayout 中添加組件,那麼這個組件將直接佔用一行。

在表格佈局中,列的寬度由該列中最寬的那個單元格決定,整個表格佈局的寬度則取決與父容器的寬度(默認總是佔滿父容器本身)

       在表格佈局管理器中,可以為單元格設置如下三種行為方式:

              Shrinkable :如果某個列被設為Shrinkable ,那麼該列的所有單元格的寬度可以被收縮,以保證表格能適應父容器的寬度。

              Stretchable :如果某個列被設為Stretchable ,那麼該列的所有單元格的寬度可以被拉伸,以保證組件能完全填滿表格空餘空間。

              Collapsed :如果某個列被設為Collapsed ,那麼該列的所有單元格會被隱藏;

    TableLayout 繼承了LinearLaout ,因此它完全可以支持LinearLayout 所支持的全部XML 屬性,除此之外,TableLayout 還支持如下表所示的XML 屬性。

Tab1eLayout 的常用XML 屬性及相關方法:

XML 屬性

相關方法

說明

android:collapseColumns

setColumnCollapsed(int,boolean)

設置需要被隱藏的列的列序號,多個列序號之間用逗號隔開

android:shrinkColumns

setShrinkAllColumns(boolean)

設置允許被收縮的列的列序號,多個列序號之間用逗號隔開

android:stretchColumns

setStretchAllColumns(boolean)

設置允許被拉伸的列的列序號,多個列序號之間用逗號隔開

 

tablelayout.xml(佈局排列):

Xml代碼  
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <TableLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:layout_width="fill_parent"  
  4.     android:layout_height="fill_parent"  
  5.     android:orientation="vertical" >  
  6.   
  7.     <TableRow >  
  8.         <EditText  
  9.             android:layout_width="wrap_content"  
  10.             android:layout_height="wrap_content"  
  11.             android:text="請輸入內容" />  
  12.           
  13.         <Button  
  14.             android:layout_width="wrap_content"  
  15.             android:layout_height="wrap_content"  
  16.             android:text="查詢" />  
  17.       
  18.     </TableRow>  
  19.      
  20.     <View   
  21.         android:layout_height="2px"  
  22.         android:background="#ccc"/>  
  23.     <!-- 分割線 -->  
  24.       
  25.     <TableRow >  
  26.         <TextView  
  27.             android:layout_width="wrap_content"  
  28.             android:layout_height="wrap_content"  
  29.             android:textSize="20px"  
  30.             android:text="請選擇語言" />  
  31.           
  32.         <RadioGroup  
  33.             android:layout_width="wrap_content"  
  34.             android:layout_height="wrap_content"  
  35.             android:checkedButton="@+id/rb1"  
  36.             android:orientation="vertical">  
  37.             <RadioButton   
  38.                 android:id="@+id/rb1"  
  39.                 android:text="java"/>  
  40.             <RadioButton   
  41.                 android:id="@+id/rb2"  
  42.                 android:text="C#"/>  
  43.         </RadioGroup>  
  44.       
  45.     </TableRow>  
  46.       
  47. </TableLayout>  

 

Tablelayout2.xml(數據顯示):

Xml代碼  
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <TableLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:layout_width="fill_parent"  
  4.     android:layout_height="fill_parent"  
  5.     android:orientation="vertical"  
  6.     android:shrinkColumns="2"   
  7.     android:collapseColumns="0,1"  
  8.     android:background="@drawable/james">  
  9.     <!--android:shrinkColumns="2",表示第3列為伸縮列 (因為下面的郵箱太長了,會將地址撐開,看不見的)-->  
  10.     <!--android:collapseColumns="0,1"設置不顯示列,如果有更多的列,則使用,分割 -->  
  11.       
  12.     <TableRow >  
  13.         <TextView  
  14.             android:layout_column="0"  
  15.             android:gravity="center_horizontal"  
  16.             android:padding="8px"             
  17.             android:text="ID" />  
  18.         <!-- android:layout_column,這個沒有提示,規定出了表格的列的編號 -->  
  19.         <!-- android:gravity="center_horizontal"表示居中顯示 -->  
  20.           
  21.         <TextView  
  22.             android:layout_column="1"  
  23.             android:gravity="center_horizontal"  
  24.             android:padding="8px"             
  25.             android:text="姓名" />  
  26.           
  27.         <TextView  
  28.             android:layout_column="2"  
  29.             android:gravity="center_horizontal"  
  30.             android:padding="8px"             
  31.             android:text="郵箱" />    
  32.               
  33.         <TextView  
  34.             android:layout_column="3"  
  35.             android:gravity="center_horizontal"  
  36.             android:padding="8px"             
  37.             android:text="地址" />  
  38.       
  39.     </TableRow>  
  40.      
  41.     <View   
  42.         android:layout_height="2px"  
  43.         android:background="#ccc"/>  
  44.     <!-- 分割線 -->  
  45.       
  46.     <TableRow >  
  47.         <TextView  
  48.             android:layout_column="0"  
  49.             android:gravity="center_horizontal"  
  50.             android:padding="8px"             
  51.             android:text="xdwang" />  
  52.           
  53.         <TextView  
  54.             android:layout_column="1"  
  55.             android:gravity="center_horizontal"  
  56.             android:padding="8px"             
  57.             android:text="王旭東" />  
  58.           
  59.         <TextView  
  60.             android:layout_column="2"  
  61.             android:gravity="center_horizontal"  
  62.             android:padding="8px"             
  63.             android:text="xdwangiflytek@gmail.com" />    
  64.               
  65.         <TextView  
  66.             android:layout_column="3"  
  67.             android:gravity="center_horizontal"  
  68.             android:padding="8px"             
  69.             android:text="安徽合肥" />  
  70.       
  71.     </TableRow>  
  72.       
  73. </TableLayout>  

 

Activity動態生成

Java代碼  
  1. package com.iflytek.activity;  
  2.   
  3. import android.app.Activity;  
  4. import android.os.Bundle;  
  5. import android.view.ViewGroup;  
  6. import android.widget.TableLayout;  
  7. import android.widget.TableRow;  
  8. import android.widget.TextView;  
  9.   
  10. public class LayoutProjectActivity extends Activity {  
  11.   
  12.     private String titleData[][] = new String[][] { { "ID""姓名""郵箱""地址" },  
  13.             { "xdwang""王旭東""xdwangiflytek@gmail.com""安徽合肥" },  
  14.             { "xdwang2""王旭東2""xdwangiflytek2@gmail.com""安徽合肥" } };  
  15.   
  16.     /** Called when the activity is first created. */  
  17.     @Override  
  18.     public void onCreate(Bundle savedInstanceState) {  
  19.         super.onCreate(savedInstanceState);  
  20.                   
  21.         TableLayout tableLayout = new TableLayout(this);  
  22.         TableLayout.LayoutParams tableParams= new TableLayout.LayoutParams(ViewGroup.LayoutParams.FILL_PARENT, ViewGroup.LayoutParams.FILL_PARENT);  
  23.           
  24.         tableLayout.setBackgroundResource(R.drawable.james);  
  25.           
  26.         //設置表格行  
  27.         for (int i = 0; i < this.titleData.length; i++) {  
  28.             TableRow tableRow = new TableRow(this);  
  29.             for (int j = 0; j <this.titleData[i].length; j++) {  
  30.                  TextView textView = new TextView(this);  
  31.                  textView.setText(this.titleData[i][j]);  
  32.                  tableRow.addView(textView, j);//加入一個編號  
  33.             }  
  34.             tableLayout.addView(tableRow);//向表格中增加若干表格行  
  35.         }  
  36.         super.setContentView(tableLayout, tableParams);           
  37.   
  38.     }  
  39. }  

 

 通過程序代碼實現的表格佈局本身比較麻煩的,一般更多的情況下是使用配置文件的形式完成。

 

 

 

三、幀佈局 (框架佈局)

幀佈局由FrameLayout 所代表,FrameLayout 直接繼承了ViewCroup 組件。

幀佈局容器為每個加入其中的組件創建一個空白的區域〔稱為一幀) ,所有每個子組件佔據一幀,這些幀都會根據gravity 屬性執行自動對齊。也就是說,幀佈局的效果有點類似於AWT 編程的CardLayout ,都是把組件一個一個地疊加在一起。與CardLayout 的區別在於,CardLayout 可以將下面的Card 移上來,但FrameLayout 則沒有提供相應的方法.

FrameLayout 的常用XML 屬性及相關方法

XML 屬性

相關方法

說明

android:foreground

setForeground(Drawable)

設置該幀佈局容器的前景圖像

android:foregroundGravity

setForegroundGravity(int)

定義繪製前景圖像的gravity 屬性

android:measureAllChildren

setMeasureAllChildren(boolean)

Determines whether to measure all children or just those in the VISIBLE or INVISIBLE state when measuring.

 

Activity動態添加幀框架佈局 

Java代碼  
  1. package com.iflytek.activity;  
  2.   
  3. import android.app.Activity;  
  4. import android.os.Bundle;  
  5. import android.view.ViewGroup;  
  6. import android.widget.Button;  
  7. import android.widget.EditText;  
  8. import android.widget.FrameLayout;  
  9. import android.widget.ImageView;  
  10.   
  11. public class LayoutProjectActivity extends Activity {  
  12.     /** Called when the activity is first created. */  
  13.     @Override  
  14.     public void onCreate(Bundle savedInstanceState) {  
  15.         super.onCreate(savedInstanceState);  
  16.   
  17.         FrameLayout frameLayout = new FrameLayout(this);  
  18.         FrameLayout.LayoutParams frameParams = new FrameLayout.LayoutParams(  
  19.                 ViewGroup.LayoutParams.FILL_PARENT,  
  20.                 ViewGroup.LayoutParams.FILL_PARENT);  
  21.         FrameLayout.LayoutParams viewParams = new FrameLayout.LayoutParams(  
  22.                 ViewGroup.LayoutParams.WRAP_CONTENT,  
  23.                 ViewGroup.LayoutParams.WRAP_CONTENT);  
  24.   
  25.         ImageView imageView = new ImageView(this);  
  26.         imageView.setImageResource(R.drawable.james);  
  27.         EditText editText = new EditText(this);  
  28.         editText.setText("這裡是內容");  
  29.         Button button = new Button(this);  
  30.         button.setText("按鈕");  
  31.         frameLayout.addView(imageView, viewParams);  
  32.         frameLayout.addView(editText, viewParams);  
  33.         frameLayout.addView(button, viewParams);  
  34.         super.setContentView(frameLayout, frameParams);  
  35.   
  36.     }  
  37. }  

 

 

四、相對佈局

相對佈局由 RelativeLayout 代表,相對佈局容器內子組件的位置總是相對兄弟組件、父容器來決定的,因此這種佈局方式被稱為相對佈局。

    如果A 組件的位置是由B 組件的位置來決定的,Android 要求先定義B 組件,再定義A 組件。

RelativeLayout 的常用XML 屬性及相關方法

XML 屬性

相關方法

說明

android:gravity

setGravity(int)

設置該佈局棄器內部各子組件的對齊方式

android:ignoreGravity

setIgnoreGravity(int)

設置哪個組件不受gravity 組件的影響

為了控制該佈局容器中各子組件的佈局分佈,RelativeLayout 提供了一個內部類:

RelativeLayout.LayoutParams, 該類提供了大量的XML 屬性來控制RelativeLayout 佈局容器中子組件的佈局分佈。

 

relativelayout.xml:

Xml代碼  
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.    android:id="@+id/rlId"     
  4.    android:layout_width="fill_parent"  
  5.     android:layout_height="fill_parent"  
  6.     android:orientation="horizontal" >  
  7.   
  8.     <ImageView  
  9.         android:id="@+id/iv1"  
  10.         android:layout_width="wrap_content"  
  11.         android:layout_height="wrap_content"  
  12.         android:src="@drawable/james"/>  
  13.     <!-- 以組件id確定參考位置 -->  
  14.       
  15.      <ImageView  
  16.         android:id="@+id/iv2"  
  17.         android:layout_width="wrap_content"  
  18.         android:layout_height="wrap_content"  
  19.         android:src="@drawable/ic_launcher"  
  20.         android:layout_toRightOf="@id/iv1"/>  
  21.      <!-- 放在第一張圖片的右邊 -->  
  22.        
  23.      <TextView  
  24.         android:id="@+id/tv1"  
  25.         android:layout_width="fill_parent"  
  26.         android:layout_height="wrap_content"  
  27.         android:layout_below="@id/iv2"  
  28.         android:layout_toRightOf="@id/iv1"  
  29.         android:text="@string/hello" />  
  30.        
  31.   
  32. </RelativeLayout>  

 

Activity動態生成:

Java代碼  
  1. package com.iflytek.activity;  
  2.   
  3. import android.app.Activity;  
  4. import android.os.Bundle;  
  5. import android.view.ViewGroup;  
  6. import android.widget.EditText;  
  7. import android.widget.RelativeLayout;  
  8.   
  9. public class LayoutProjectActivity extends Activity {  
  10.   
  11.     /** Called when the activity is first created. */  
  12.     @Override  
  13.     public void onCreate(Bundle savedInstanceState) {  
  14.         super.onCreate(savedInstanceState);  
  15.         super.setContentView(R.layout.relativelayout);// 要讀取已經存在的佈局管理器  
  16.   
  17.         RelativeLayout relativeLayout = (RelativeLayout) super  
  18.                 .findViewById(R.id.rlId);  
  19.         RelativeLayout.LayoutParams relativeParams = new RelativeLayout.LayoutParams(  
  20.                 ViewGroup.LayoutParams.FILL_PARENT,  
  21.                 ViewGroup.LayoutParams.FILL_PARENT);  
  22.         relativeParams.addRule(RelativeLayout.LEFT_OF, R.id.tv1);  
  23.         relativeParams.addRule(RelativeLayout.BELOW, R.id.iv1);  
  24.         EditText editText = new EditText(this);  
  25.         relativeLayout.addView(editText, relativeParams);  
  26.   
  27.     }  
  28. }  

 

 

 

五、絕對佈局

       絕對佈局由AbsoluteLayout 代表。是Android2.3.3版本之前的佈局管理器,已廢棄了。絕對佈局就像Java AWT 編程中的空佈局,就是Android 不提供任何佈局控制,而是由開發人員自己通過X 坐標、Y 坐標來控制組件的位置。當使用AbsoluteLayout 作為佈局容器時,佈局容器不再管理子組件的位置、大小—這些都需要開發人員自己控制。

使用絕對佈局時,每個子組件都可指定如下兩個XML 屬性。

              layout_x :指定該子組件的X 坐標。

              layout_y :指定該子組件的Y 坐標  

 

 

佈局管理器的嵌套

Xml代碼  
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:layout_width="fill_parent"  
  4.     android:layout_height="fill_parent"  
  5.     android:orientation="vertical" >  
  6.     <!-- 首先外面定義一個總的佈局管理器,一般來說用的最多的還是線性和表格兩種佈局 -->  
  7.   
  8.     <Button  
  9.         android:layout_width="fill_parent"  
  10.         android:layout_height="wrap_content"  
  11.         android:text="查詢" />  
  12.       
  13.     <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  14.         android:layout_width="fill_parent"  
  15.         android:layout_height="wrap_content"  
  16.         android:orientation="horizontal" >  
  17.         <!-- 注意這裡的高度不能再全部鋪滿了,否則下面的佈局都沒空間了 -->  
  18.         <ImageView   
  19.             android:layout_width="wrap_content"  
  20.             android:layout_height="wrap_content"  
  21.             android:src="@drawable/james"/>  
  22.           
  23.          <ImageView   
  24.             android:layout_width="wrap_content"  
  25.             android:layout_height="wrap_content"  
  26.             android:src="@drawable/ic_launcher"/>  
  27.           
  28.     </LinearLayout>  
  29.       
  30.     <TableLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  31.         android:layout_width="fill_parent"  
  32.         android:layout_height="wrap_content"  
  33.         android:orientation="horizontal">  
  34.           
  35.         <TableRow>  
  36.           
  37.             <EditText  
  38.                 android:layout_width="wrap_content"  
  39.                 android:layout_height="wrap_content"  
  40.                 android:text="這是什麼呢" />  
  41.               
  42.             <Button  
  43.                 android:layout_width="wrap_content"  
  44.                 android:layout_height="wrap_content"  
  45.                 android:text="這是什麼呢" />  
  46.           
  47.         </TableRow>  
  48.     </TableLayout>  
  49.   
  50. </LinearLayout>  

Felix 發表在 痞客邦 PIXNET 留言(0) 人氣()