Material Design Docsに示されているようなものを達成したい。
colorControlHighlight
チェック項目の背景に使用されます。
カスタマイズする必要があります:
- バックグラウンド未チェック
- 文字色チェック済み
- テキストの色がチェックされていません
Material Design Docsに示されているようなものを達成したい。
colorControlHighlight
チェック項目の背景に使用されます。
カスタマイズする必要があります:
itemBackground
、itemIconTint
およびitemTextColor
設定可能な単純な xml 属性ですが、カスタム プレフィックスの代わりに使用する必要がありますandroid:
。
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<!-- Other layout views -->
<android.support.design.widget.NavigationView
android:id="@+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:fitsSystemWindows="true"
app:itemBackground="@drawable/my_ripple"
app:itemIconTint="#2196f3"
app:itemTextColor="#009688"
app:headerLayout="@layout/nav_header"
app:menu="@menu/drawer_view" />
</android.support.v4.widget.DrawerLayout>
注:この場合、テキストの色、アイコンの色合い、および背景は静的です。テキストの色を変更したい場合 (例えば、チェックされていないときはピンク、チェックされているときはティール) を使用する必要がありますColorStateList
。
以下の内容で新しい *.xml ファイルを作成します/res/color
- 名前をstate_list.xmlとしましょう -
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<!-- This is used when the Navigation Item is checked -->
<item android:color="#009688" android:state_checked="true" />
<!-- This is the default text color -->
<item android:color="#E91E63" />
</selector>
次に、次のように参照します。app:itemTextColor="@color/state_list"
についても同様ですitemIconTint
。itemBackground
リソース ID が必要です。ドキュメントも参照してください。
NavigationDrawer (NavigationView) には、チェック/選択されたアイテムを構成するための 3 つのオプションがあります。
app:itemIconTint="@color/menu_text_color" //icon color
app:itemTextColor="@color/menu_text_color" //text color
app:itemBackground="@drawable/menu_background_color" //background
最初の 2 つのオプション ( icon と text ) には、色の状態のリスト リソース( https://developer.android.com/guide/topics/resources/color-list-resource.html ) が必要です。
そのようなリソースはres/colormenu_text_color
で作成する必要があります。このファイルの内容は次のようになります。
<!-- res/color/menu_text_color.xml -->
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:color="@color/colorWhite" android:state_checked="true" />
<item android:color="@color/colorBlack" android:state_checked="false"/>
</selector>
@color/colorWhite
- チェックされた項目に使用される色のリソース
@color/colorBlack
- チェックされていないアイテムに使用される色のリソース
両方に対して 1 つのリソースを作成しましたが、テキスト用とアイコン用の 2 つの別々のファイルを作成することも可能です。
背景オプションには、色ではなく描画可能なリソースが必要です。色を設定しようとすると、例外によって終了します。ドローアブルリソースはres/drawableに作成する必要があり、その内容は次のようになります。
<!-- res/drawable/menu_background_color.xml -->
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@android:color/transparent" android:state_checked="false"/>
<item android:drawable="@color/colorPrimary" android:state_checked="true"/>
</selector>
色をシミュレートするドローアブルを作成する必要はありません (他のソリューションでは、そのような提案を見ました - おそらく古いバージョンの SDK の場合)。色はこのファイルで直接使用できます。このサンプル ファイルでは、チェックされていないアイテムとチェックされているアイテムに透明色を使用していますcolorPrimary
。
コード例 (動的メニュー項目の追加):
menu.add(group_id, item_id, Menu.NONE, item_name).setCheckable(true).setChecked(false);
アイテムがチェック可能に設定されていない場合、背景は機能しません (テキストとアイコンの色は期待どおりに機能します)。
このコードをプログラムで使用できます:
int[][] states = new int[][] {
new int[] { android.R.attr.state_enabled}, // enabled
new int[] {-android.R.attr.state_enabled}, // disabled
new int[] {-android.R.attr.state_checked}, // unchecked
new int[] { android.R.attr.state_pressed} // pressed
};
int[] colors = new int[] {
Color.BLACK,
Color.RED,
Color.GREEN,
Color.BLUE
};
ColorStateList myList = new ColorStateList(states, colors);
nav_view.setItemIconTintList(myList);