Android drawableは画像を入れておくだけじゃない

**この記事は[モバイルファクトリー Advent Calendar](http://qiita.com/advent-calendar/2015/mobilefactory) 17日目の記事です。**
昨日はmattakさんの[Kotlinをプロジェクトに導入してわかったこと](http://qiita.com/mattak@github/items/f2fbcacb5885ee6f8e60)でした。
今日は@yashims85がお送りします。

# drawableは画像を入れておくだけじゃない

drawableは画像だけではなく様々な描画用リソースを定義出来ます。

* Bitmap File
  * 画像ファイル
* Nine-Patch File
  * 9パッチ
* Layer List
  * 他のDrawableを重ねて一つのDrawableにする
* State List
  * 状態によって描画するDrawableを変えれる
* Level List
  * レベルによって描画するDrawableを変える
* Transition Drawable
  * 複数のDrawable間でクロスフェードを行える
* Inset Drawable
  * 他のDrawableを内包する
* Clip Drawable
  * レベルによって描画する幅を変える
* Scale Drawable
  * DrawableをScaleする
* Shape Drawable
  * 単純なDrawableを作る

詳しくは[公式](http://developer.android.com/intl/ja/guide/topics/resources/drawable-resource.html)をみてもらうとして、ここでは、ShapeとStateListを使って、ボタン用のリソースを作る過程を例示したいと思います。

# Shape

Shapeは四角、角丸、円、楕円、リングの簡単な図形やグラデーションをもつDrawableを作成できます。

## 80x40dpに内接するグラデーションのかかった楕円を作る

プロジェクトツリーのdrawableのコンテキストメニューから`Drawable resource file`を選択し、Root elementには`shape`を指定してxmlファイルを作成して下さい。

```drawable_default_shape.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <gradient
        android:angle="90"
        android:endColor="#ffaaaa"
        android:startColor="#ff0000"
        android:type="linear" />
    <size
        android:width="80dp"
        android:height="40dp" />
</shape>
```

```drawable_pressed_shapre.xml
drawable_default_shape.xmlのstartColorとendColorを入れ替えただけなので省略
```

# StateListでボタン用Drawableを作る

StateListはViewの状態に応じて、描画するDrawableを切り替えることができるDrawableです。
今回はShapeで作成したDrawableを使用しますが、Bitmap fileも当然のように使えるので、普段はそちらのほうが使用頻度は高いでしょう。

## ボタン用のDrawableを作る
Shapeと同じく`Drawable resource file`を選択したら、Root elementには`selector`を指定します。

xmlはstate_pressed="true"の時だけ、pressedのdrawableを表示するように指定します。

```xml:drawable_example_selector.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/drawable_default_shape" android:state_pressed="false" android:state_selected="false" android:state_enabled="true" />
    <item android:drawable="@drawable/drawable_pressed_shape" android:state_pressed="true" android:state_selected="false" android:state_enabled="true" />
    <item android:drawable="@drawable/drawable_default_shape" android:state_pressed="false" android:state_selected="true" android:state_enabled="true" />
</selector>
```

## ラジオボタン用のDrawableを作る
ラジオボタン、チェックボックス、トグル、スイッチなどは、state_checkedで判断します。

```xml:drawable_example_radio
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/drawable_default_shape" android:state_checked="false" android:state_enabled="true" />
    <item android:drawable="@drawable/drawable_pressed_shape" android:state_checked="true" android:state_enabled="true" />
</selector>
```

# DrawableをViewに当てる

StateListで作ったものを、通常の画像と同じようにImageButtonやRadioButtonに当てはめていけば良いだけです。同じインターフェースで扱えるのはとてもうれしいですね。

# まとめ

というわけ、ノーコードでボタンを作ることが出来てしまいました。Drawableには他にも便利な機能があるので、APIガイドを読んでみるととても楽しいです。

明日はmasasuzuさんのどげんかしたい話です。はたしてどげんかなったのでしょうか？とても楽しみです。