ページ

2013/07/02

[Android]View に border-bottom をつける

Android で作る View が HTML/CSS で書けたら楽なのにと思う @wada811 です。
今回は border-bottom を付けたいと思って適当に View で border と打つも
何も補完されなかった悲しみについて説明したいと思います。
まさかの Android には border をつける方法がないという現実がそこにはありました。

だからと言って画像を用意するのは面倒だし、何か方法はないかと探してみたところ
drawable を XML で定義する方法で border-bottom をつける方法がありました。
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <item>
        <shape android:shape="rectangle" >
            <solid android:color="@color/borderColor" />
        </shape>
    </item>
    <item android:bottom="@dimen/borderWidth">
        <shape android:shape="rectangle" >
            <padding android:bottom="@dimen/borderPadding" />
            <solid android:color="@color/bgColor" />
        </shape>
    </item>
</layer-list>
<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="borderColor">#0099CC</color>
    <color name="bgColor">#E8E8E8</color>
</resources>
<?xml version="1.0" encoding="utf-8"?>
<resources>
    <dimen name="borderWidth">1dp</dimen>
    <dimen name="borderPadding">4dp</dimen>
</resources>
イメージ的には青い背景の上に borderWidth 分だけ上にずらした灰色の背景を重ねて表示するような感じ。
borderPadding で TextView とかに border-bottom を適用する際に文字とボーダーの間を調節できる。