web-dev-qa-db-ja.com

ナビゲーションドロワーでチェックされているメニュー項目の色を変更する

新しいAndroid Design Supportライブラリを使用して、アプリケーションにナビゲーションドロワーを実装しています。

選択したアイテムの色を変更する方法がわかりません!

メニューのxmlは次のとおりです。

<menu xmlns:Android="http://schemas.Android.com/apk/res/Android">
<group Android:checkableBehavior="single">
    <item
        Android:id="@+id/navigation_item_1"
        Android:icon="@drawable/ic_1"
        Android:title="@string/navigation_item_1"/>

    <item
        Android:id="@+id/navigation_item_2"
        Android:icon="@drawable/ic_2"
        Android:title="@string/navigation_item_2"/>
</group>

そして、これはAndroid.support.v4.widget.DrawerLayout内に配置されたnavigationview xmlです:

<Android.support.design.widget.NavigationView
    Android:id="@+id/activity_main_navigationview"
    Android:layout_width="wrap_content"
    Android:layout_height="match_parent"
    Android:layout_gravity="start"
    app:headerLayout="@layout/drawer_header"
    app:itemIconTint="@color/black"
    app:itemTextColor="@color/primary_text"
    app:menu="@menu/menu_drawer">

    <TextView
        Android:id="@+id/main_activity_version"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:layout_gravity="bottom"
        Android:layout_marginBottom="@dimen/activity_vertical_margin"
        Android:layout_marginLeft="@dimen/activity_horizontal_margin"
        Android:textColor="@color/primary_text" />

</Android.support.design.widget.NavigationView>

ご協力ありがとうございました !

[編集]私はすでにこのようなソリューションを見ました: Androidメニューの背景色を変更する

それはかなりハックのようであり、新しいデザインサポートライブラリでは、よりクリーンなものが導入されると思いましたか?

88
Greg

Color State Resource を使用してこれを実現できます。使用しているNavigationViewの内部に気付いた場合

app:itemIconTint="@color/black"
app:itemTextColor="@color/primary_text"

ここでは、@color/blackまたは@color/primary_testを使用する代わりに、Color State List Resourceを使用します。そのためには、最初にxmlディレクトリ(colorディレクトリ内にある必要があります)内に新しいres(たとえば、drawer_item.xml)を作成します。colorという名前のディレクトリがまだない場合は、作成します。

これでdrawer_item.xmlの内部で次のようになります

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:Android="http://schemas.Android.com/apk/res/Android">
    <item Android:color="checked state color" Android:state_checked="true" />
    <item Android:color="your default color" />
</selector>

最後のステップは、NavigationViewを変更することです

<Android.support.design.widget.NavigationView
    Android:id="@+id/activity_main_navigationview"
    Android:layout_width="wrap_content"
    Android:layout_height="match_parent"
    Android:layout_gravity="start"
    app:headerLayout="@layout/drawer_header"
    app:itemIconTint="@color/drawer_item"  // notice here
    app:itemTextColor="@color/drawer_item" // and here
    app:itemBackground="@Android:color/transparent"// and here for setting the background color to tranparent
    app:menu="@menu/menu_drawer">

このように、IconTintItemTextColorItemBackgroundに対して個別のカラー状態リストリソースを使用できます。

これで、アイテムをチェック済みとして設定すると(xmlで、またはプログラムで)、特定のアイテムの色はチェックされていないものと異なります。

223
Sash_KP

app:itemBackgroundはドロアブルを期待していると思います。以下の手順に従ってください:

次の内容で描画可能なファイルhighlight_color.xmlを作成します。

<shape xmlns:Android="http://schemas.Android.com/apk/res/Android" Android:shape="rectangle">
     <solid Android:color="YOUR HIGHLIGHT COLOR"/>
</shape>

次の内容の別のドローアブルファイルnav_item_drawable.xmlを作成します。

<selector xmlns:Android="http://schemas.Android.com/apk/res/Android">
        <item Android:drawable="@drawable/highlight_color" Android:state_checked="true"/>
</selector>

最後に、app:itemBackgroundタグをNavViewに追加します。

<Android.support.design.widget.NavigationView
Android:id="@+id/activity_main_navigationview"
Android:layout_width="wrap_content"
Android:layout_height="match_parent"
Android:layout_gravity="start"
app:headerLayout="@layout/drawer_header"
app:itemIconTint="@color/black"
app:itemTextColor="@color/primary_text"
app:itemBackground="@drawable/nav_item_drawable"
app:menu="@menu/menu_drawer">

ここで、highlight_color.xmlファイルは、背景に描画可能な単色を定義します。後で、この色のドロアブルはnav_item_drawable.xmlセレクターに割り当てられます。

これは私のために働いた。これが役立つことを願っています。

********************************************** 更新 *********************************************** **

上記の答えはいくつかのプロパティを細かく制御することができますが、私が説明しようとしている方法はもっと感じますSOLIDそして少しCOOLERです。

そのため、次のようにNavigationViewのstyles.xmlThemeOverlayを定義できます。

    <style name="ThemeOverlay.AppCompat.navTheme">

        <!-- Color of text and icon when SELECTED -->
        <item name="colorPrimary">@color/color_of_your_choice</item> 

        <!-- Background color when SELECTED -->
        <item name="colorControlHighlight">@color/color_of_your_choice</item> 

    </style>

次のように、このThemeOverlayをNavigationViewのapp:theme属性に適用します。

<Android.support.design.widget.NavigationView
Android:id="@+id/activity_main_navigationview"
Android:layout_width="wrap_content"
Android:layout_height="match_parent"
Android:layout_gravity="start"
app:theme="@style/ThemeOverlay.AppCompat.navTheme"
app:headerLayout="@layout/drawer_header"
app:menu="@menu/menu_drawer">

これが役立つことを願っています。

54
Ankush

NavigateItemのアイテムがクリックされるたびにNavigateViewをtrueに設定する必要があります

//listen for navigation events
NavigationView navigationView = (NavigationView)findViewById(R.id.navigation);
navigationView.setNavigationItemSelectedListener(this);
// select the correct nav menu item
navigationView.getMenu().findItem(mNavItemId).setChecked(true);

NavigationItemSelectedListenerNavigationViewを追加します

  @Override
  public boolean onNavigationItemSelected(final MenuItem menuItem) {
    // update highlighted item in the navigation menu
    menuItem.setChecked(true);
    mNavItemId = menuItem.getItemId();

    // allow some time after closing the drawer before performing real navigation
    // so the user can see what is happening
    mDrawerLayout.closeDrawer(GravityCompat.START);
    mDrawerActionHandler.postDelayed(new Runnable() {
      @Override
      public void run() {
        navigate(menuItem.getItemId());
      }
    }, DRAWER_CLOSE_DELAY_MS);
    return true;
  }
3
Vikalp Patel

これを実現する別の方法を次に示します。

public boolean onOptionsItemSelected(MenuItem item) {

    int id = item.getItemId();

    item.setOnMenuItemClickListener(new MenuItem.OnMenuItemClickListener() {
        @Override
        public boolean onMenuItemClick(MenuItem item) {
            item.setEnabled(true);
            item.setTitle(Html.fromHtml("<font color='#ff3824'>Settings</font>"));
            return false;
            }
        });


    //noinspection SimplifiableIfStatement
    if (id == R.id.action_settings) {
        return true;
    }

    return super.onOptionsItemSelected(item);
}

}

2
abhishek pant

アクティビティのonCreateメソッドでこれを行う方法は次のとおりです。

NavigationView navigationView = findViewById(R.id.nav_view);
ColorStateList csl = new ColorStateList(
    new int[][] {
        new int[] {-Android.R.attr.state_checked}, // unchecked
        new int[] { Android.R.attr.state_checked}  // checked
    },
    new int[] {
        Color.BLACK,
        Color.RED
    }
);
navigationView.setItemTextColor(csl);
navigationView.setItemIconTintList(csl);
0
tguen