Android UI控制元件系列：TableLayout（表格佈局）

apkbus發表於2014-11-29
AndroidUI控制元件

TableLayout是一個以行、列顯示檢視View的檢視組

1、開始一個新的工程，名字叫做HelloTableLayout

2、開啟res/layout/main.xml檔案並且插入如下內容

<?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">
        <TableRow>
                <TextView
                        android:layout_column="1"
                        android:text="Open..."
                        android:padding="3dip"
                />
                <TextView
                        android:text="Ctrl-O"
                        android:gravity="right"
                        android:padding="3dip"
                />
        </TableRow>
        <TableRow>
                <TextView
                        android:layout_column="1"
                        android:text="Save..."
                        android:padding="3dip"
                />
                <TextView
                        android:text="Ctrl-S"
                        android:gravity="right"
                        android:padding="3dip"
                />
        </TableRow>
        <TableRow>
                <TextView
                        android:layout_column="1"
                        android:text="Save as..."
                        android:padding="3dip"
                />
                <TextView
                        android:text="Ctrl-Shift-S"
                        android:gravity="right"
                        android:padding="3dip"
                />
        </TableRow>
        <View
                android:layout_height="2dip"
                android:background="#FF909090"
        />
        <TableRow>
                <TextView
                        android:text="X"
                        android:padding="3dip"
                />
                <TextView
                        android:text="Import..."
                        android:padding="3dip"
                />
        </TableRow>
        <TableRow>
                <TextView
                        android:text="X"
                        android:padding="3dip"
                />
                <TextView
                        android:text="Export..."
                        android:padding="3dip"
                />
                <TextView
                        android:text="Ctrl-E"
                        android:gravity="right"
                        android:padding="3dip"
                />
        </TableRow>
        <View
                android:layout_height="2dip"
                android:background="#FF909090"
        />
        <TableRow>
                <TextView
                        android:layout_column="1"
                        android:text="Quit"
                        android:padding="3dip"
                />
        </TableRow>
</TableLayout>

注意到這個檔案類似於HTML的table的結構，TableLayout元素就像是HTML中的<table>元素；TableRow就像是一一個<tr>元素；但是對於每一個單元格，你可以用各種檢視元素，在這裡例子裡，每個單元格用TextView，在這些行之間，還有一個基本View，用來畫水平線

TextView中的一些屬性

android:layout_column=”1″：表示控制元件放在標號為1的列上，標號是從0開始的
android:gravity=”right”：定義字型在父控制元件中顯示在右邊
android:stretchColumns=”1″：設定自動拉伸哪些列，列ID從0開始，多個列的話用”,”分隔。這裡的作用是讓第2列可以擴充套件到所有可用空間
android:shrinkColumns:設定自動收縮哪些列，列ID從0開始，多個列的話用”,”分隔
android:collapseColumns：設定自動隱藏哪些列，列ID從0開始，多個列的話用”,”分隔
順便：android:layout_span表示一個控制元件佔幾列空間
下面的是基本的View，是在螢幕上畫一條2dip高的一條橫線
<View
android:layout_height=”2dip”
android:background=”#FF909090″
/>

3、執行結果如下：

相關文章