ぱんぶろ

パンジーの「いいね!」ブログ

【Android開発】Tablelayoutで枠線を表示させる方法

      2016/03/30  

medium_5342356950
photo credit: andreas.hopf via photopin cc

将来が不安で眠れない。
どうも。パンジー(@panzee8)です。

Androidの開発でマス目状のゲームを作にあたって、
UIとして用意されているTablelayoutを使おうと思っています。

なんでもhtmlのテーブルと同じような機能ということで
作っていってたんですけど、

・・・ない。
・・・ないぞ。

枠線を引くためのの、あの”border”がないんです。
調べたんですけど、
どうやらAndroidのTablelayoutにはborderタグのようなものはないようですね。

ということで無理やり作ってみました。
これで問題が起きないかは分かりませんが、Tablelayoutで枠線を作る方法を紹介します。

スポンサード リンク

Tablelayoutで枠線を表示させる方法

方法としては簡単です。

背景を黒にして、テーブルのセル同士の間隔を少し開けて上げれば、
線が引いてあるように見えるというだけのやり方です。

実際にソースの例を書きます。

<TableLayout
android:layout_width="match_parent"
android:layout_height="match_parent" >

<TableRow
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#000000" >

<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginBottom="1dp"
android:layout_marginLeft="1dp"
android:layout_weight="1"
android:background="#FFFFFF"
android:gravity="center"
android:text="1" >
</TextView>

<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginBottom="1dp"
android:layout_marginLeft="1dp"
android:layout_marginRight="1dp"
android:layout_weight="1"
android:background="#FFFFFF"
android:gravity="center"
android:text="2" >
</TextView>

<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginBottom="1dp"
android:layout_marginRight="1dp"
android:layout_weight="1"
android:background="#FFFFFF"
android:gravity="center"
android:text="3" >
</TextView>
</TableRow>

<TableRow
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#000000">

<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginBottom="1dp"
android:layout_marginLeft="1dp"
android:layout_weight="1"
android:background="#FFFFFF"
android:gravity="center"
android:text="4">
</TextView>

<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginBottom="1dp"
android:layout_marginLeft="1dp"
android:layout_marginRight="1dp"
android:layout_weight="1"
android:background="#FFFFFF"
android:gravity="center"
android:text="5">
</TextView>

<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginBottom="1dp"
android:layout_marginRight="1dp"
android:layout_weight="1"
android:background="#FFFFFF"
android:gravity="center"
android:text="6" >
</TextView>
</TableRow>
</TableLayout>

これで2行3列の表が黒枠で表示されるはずです。