2011年4月19日火曜日

draw9patchで作ったButtonを使ってみる

draw9patchを使って作ったボタンをAndroidで使用してみる。使わないボタンと使ったボタンでの比較をする。

draw9patchで編集すると~.9.pngという拡張子のファイルができる。これをdrawableに移してやれば良いだけ。一応on用、off用作ったので、mybutton.xml書いてみるが、特に意味はない。
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_focused="true" android:drawable="@drawable/button_on" />
    <item android:drawable="@drawable/button_off" />
</selector>

で、wrap_contetやfill_parent、改行ありなどにして大きさの違ういくつかのタイプのボタンを配置する。
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="fill_parent"
    android:layout_height="fill_parent" android:background="#fff">
    <Button android:background="@drawable/mybutton"
        android:layout_margin="5dip" android:text="ボタン1"
        android:layout_width="wrap_content" android:layout_height="wrap_content" />
    <Button android:background="@drawable/mybutton"
        android:layout_margin="5dip" android:text="ボタン2"
        android:layout_width="fill_parent" android:layout_height="wrap_content" />
    <Button android:background="@drawable/mybutton"
        android:layout_margin="5dip" android:text="ボタン3は\n改行してみる"
        android:layout_width="fill_parent" android:layout_height="wrap_content" />
</LinearLayout>

左側がdraw9patchを使ってない画像で、右側はdraw9patchを使った画像。
draw9patchの方は文字が綺麗に収まっていて、長さが伸びる場合でも綺麗に拡張され表示される。
それに比べて使わない方の画像は文字が枠内に収まっていないし、そのまま拡大されて汚いしホビロン。