読者です 読者をやめる 読者になる 読者になる

It’s now or never

IT系の技術ブログです。気になったこと、勉強したことを備忘録的にまとめて行きます。

【Android】selecterを使ってみる

selecterとは

Androiddrawableリソースの一つで、 状態によって、画像や色を差し替えることができる仕組みです。 (StateListDrawableに分類される)

どうやって定義する?

xmlで作成します。 ファイルの置き場所は、res/drawable配下になります。

selecterで表現できるの主な状態には、下記5パターンが存在します。

1.フォーカス時
2.無効状態かつフォーカス時
3.押下状態
4.無効状態
5.通常状態

(ファイル例)

<?xml version="1.0" encoding="UTF-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
  <!-- フォーカス時 -->
  <item
    android:state_focused="true"
    android:state_enabled="true"
    android:state_pressed="false"
    android:drawable="@drawable/focused" />
  <!-- 無効状態 かつ フォーカス時 -->
  <item
    android:state_focused="true"
    android:state_enabled="false"
    android:state_pressed="false"
    android:drawable="@drawable/disabled_and_focused" />
  <!-- 押下状態 -->
  <item
    android:state_focused="true"
    android:state_enabled="true"
    android:state_pressed="true"
    android:drawable="@drawable/pressed" />
  <!-- 無効状態 -->
  <item
    android:state_enabled="false"
    android:drawable="@drawable/disabled" />
  <!-- 通常状態 -->
  <item
    android:drawable="@drawable/normal" />
</selector>

selecterのxmlで指定する<Item>タグは、上から評価されるため。 上記すべての状態において別のdrawableを指定したい場合は、 順番どおり記述する必要があります。

どうやって使用する?

レイアウトxmlで指定します。

(ImageViewの画像を状態ごとに変更したいとき)

<ImageView
    android:layout_height="wrap_content"
    android:layout_width="wrap_content"
    android:src="@drawable/sample_selecter” />

(TextViewの文字色を選択状態ごとに変更したいとき)

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/hello_world"
    android:textColor="@drawable/sample_selecter"/>

@drawable/[selecterのファイル名]で指定することができます。

その他ハマりどころ

TextViewで背景色や、文字色を状態別で変更したい場合にもselecterを使用しますが、 指定する属性(用途)によって<item>タグの指定方法が異なるようです。

(異なる方法で実装すると実行時エラーが発生する)

android:textColorに指定する場合

<selector xmlns:android="http://schemas.android.com/apk/res/android">  
  <item android:state_selected="true"   
           android:color="#ff3f94be" />  
  <item android:state_selected="false"   
           android:color="#99000000" />  
</selector>  

属性値としてandroid:colorとして定義する。

android:backgroundに指定する場合

<selector xmlns:android="http://schemas.android.com/apk/res/android">  
    <item android:state_selected="true" >  
        <color android:color="#66000000" />  
    </item>  
    <item android:state_selected="false">  
        <color android:color="#33000000" />  
    </item>  
</selector> 

<color>タグとして定義する。


selecterは、drawableの一種なので、 レイアウトxml上でdrawable要素に対して指定しますが、 selecterのxml上でも各状態ごとに表示ファイルを分けたい場合などに、 ビットマップのdrawableを指定することがあります。

drawableの中で更にdrawableを指定するという点が、 まだちょっと慣れないです。。 drawableは、種別が多いため基本的な仕組みを理解していないと、 ソースを読むときに苦労しそうです。

参考

[ソフトウェア技術ドキュメントを勝手に翻訳 7.5.3 Drawable リソース] (http://www.techdoctranslator.com/android/guide/resources/available-resources/drawable-resource)