TableLayout表格佈局UI

新建一個android項目時,UI的默認佈局是LinearLayout(線性排版),如果要要實現並排顯示TextView,我們可以使用TableLayout(表格排版)。

android.widget.TableLayout 是一個“排版類別”,它可以將畫面切割成一個表格,下面在上個工程中添加一個兩列表格的例子。

編輯main.XML文件:
[html] view plaincopyprint?<?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:orientation="vertical" > 
 
    <TextView 
        android:layout_width="fill_parent" 
        android:layout_height="wrap_content" 
        android:text="@string/hello" /> 
    <WebView  
    android:layout_width="fill_parent"  
    android:layout_height="wrap_content"  
    android:id="@+id/wv"  
    /> 
    <TableRow> 
        <TextView   
            android:layout_width="fill_parent"  
            android:layout_height="wrap_content"  
            android:text="www.aiwalls.com" 
            android:padding="5dip" 
            android:autoLink="web" /> 
        <TextView   
            android:layout_width="fill_parent"  
            android:layout_height="wrap_content"  
            android:text="www.aiwalls.com" 
            android:autoLink="web" /> 
    </TableRow> 
     
 
</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:orientation="vertical" >

    <TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="@string/hello" />
    <WebView
 android:layout_width="fill_parent"
 android:layout_height="wrap_content"
 android:id="@+id/wv"
 />
    <TableRow>
  <TextView 
      android:layout_width="fill_parent"
      android:layout_height="wrap_content"
      android:text="www.aiwalls.com"
      android:padding="5dip"
      android:autoLink="web" />
  <TextView 
      android:layout_width="fill_parent"
      android:layout_height="wrap_content"
      android:text="www.aiwalls.com"
      android:autoLink="web" />
 </TableRow>
   

</TableLayout>

android.widget.TableRow配合TableRow使用的一個類,當在TableLayout添加一個TableRow時,在TableRow裡面所有的View都會在同一個列(row)中顯示。

為瞭避免同一行所有的文字都擠在一起,因此在TextView中加上padding的屬性:

[html] view plaincopyprint?android:padding="5dip" 
 android:padding="5dip"
表示第一個TextView的padding(間格)為5dip,表示與旁邊的View有5個空格,這樣就解決瞭兩個TextView不會擠在一起。
效果如圖:

 

摘自 Young的專欄

發佈留言