【Androidアプリ作成】TableLayoutでborder(罫線)をつける方法

昨日はTableLayoutの使い方という基本的なところを書きましたが、
今回は罫線について書きます。

Tableといえば、やはりborderがつけて表みたいに見せるのが本来の使い方なので
borderをつけいたいという需要は多いのではないでしょうか。

私も調べてみましたが、
なんとTableLayoutでは罫線をつけるためのborder関係のプロパティがありません!

でも、borderをなんとかしてつけたいと思い、下記のようなサンプルコードを用意しました。
昨日のフルーツテーブルに罫線がつけてみました。

概念としては、罫線をつけたい<TableRow>にbackground要素につけたい罫線の色を設定します。
その中身の要素(この場合<TextView>)にmarginを指定します。
指定したmarginの値が大きければ大きいほど、罫線が太くなるという寸法です。

フルーツテーブル改)
<TableLayout

android:layout_width="fill_parent"

android:layout_height="fill_parent">

<TableRow

android:layout_width="fill_parent"
android:layout_height="fill_parent">

<TextView

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:text="1"

android:textColor="#FFFFFF"

android:background="#003366"

android:layout_weight="1"

android:gravity="center">

</TextView>

<TextView

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:text="2"

android:textColor="#FFFFFF"

android:background="#003366"

android:layout_weight="1"

android:gravity="center">

</TextView>

<TextView

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:text="3"

android:textColor="#FFFFFF"

android:background="#003366"

android:layout_weight="1"

android:gravity="center">

</TextView>

</TableRow>

<TableRow

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:background="#000000"

android:stretchColumns="*">

<TextView

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:text="みかん"

android:textColor="#000000"

android:background="#FFFFFF"

android:layout_weight="1"

android:gravity="center"

android:layout_marginLeft="1dip"

android:layout_marginBottom="1dip">

</TextView>

<TextView

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:text="りんご"

android:textColor="#000000"

android:background="#FFFFFF"

android:layout_weight="1"

android:gravity="center"

android:layout_marginLeft="1dip"

android:layout_marginRight="1dip"

android:layout_marginBottom="1dip">

</TextView>

<TextView

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:text="メロン"

android:textColor="#000000"

android:background="#FFFFFF"

android:layout_weight="1"

android:gravity="center"

android:layout_marginRight="1dip"

android:layout_marginBottom="1dip">

</TextView>

</TableRow>
</TableLayout>

2011.7.20
神森 真昼

コメントを残す

メールアドレスが公開されることはありません。

CAPTCHA

*