web-dev-qa-db-ja.com

BottomNavigationViewの背景色の変更

新しいサポートライブラリ25.0.0から利用可能なBottomNavigationViewを実装しました。ここに私のコードがあります

<Android.support.design.widget.BottomNavigationView
    Android:id="@+id/bottom_navigation"
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content"
    Android:layout_alignParentBottom="true"
    app:itemBackground="@color/colorPrimary"
    app:itemIconTint="@drawable/text"
    app:itemTextColor="@drawable/text"
    app:menu="@menu/bottom_navigation_main" />

そして、text.xml描画可能

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:Android="http://schemas.Android.com/apk/res/Android">
    <item Android:color="@Android:color/white" Android:state_enabled="true" />
    <item Android:color="@color/colorPrimaryDark" Android:state_enabled="false" />
</selector>

このコードを使用すると、メニュー項目をクリックしたときにテキストの色を変更できますが、app:itemBackgroundエラーが表示されています<item> tag requires a 'drawable' attribute or child tag defining a drawable。

これは私がapp:itemBackground

app:itemBackground="@drawable/text"

だから私の質問は、選択したメニュー項目の背景色をどのように変更できますか？

androidbottomnavigationview
25
Ravi Rupareliya

これから答えを見つけました 中程度の投稿

  1. Android:state_checkedの代わりにAndroid:state_enabledを使用する必要があります
  2. onNavigationItemSelected内では、return trueの代わりにreturn falseを使用する必要があります。

背景を設定するには、Android:colorで<item>を使用できません。Android:drawableを使用する必要があります

app:itemTextColorおよびapp:itemIconTintに設定しているときのXMLファイルの外観

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:Android="http://schemas.Android.com/apk/res/Android">
    <item Android:color="@color/colorPrimaryDark" Android:state_checked="true" />
    <item Android:color="@Android:color/white" Android:state_checked="false" />
</selector>

app:itemBackgroundセレクターを設定する

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:Android="http://schemas.Android.com/apk/res/Android">
    <item Android:drawable="@drawable/banner_white" Android:state_checked="true"/>
    <item Android:drawable="@drawable/banner_green" Android:state_checked="false"/>
</selector>

ここでbanner_whiteとbanner_greenはpngです。

35
Ravi Rupareliya

OPと同様の問題が発生しましたが、少し異なります。 sth like@color/color_selectorをBottomNavigationViewのapp:itemBackground="___"に配置した場合。これにより、ビューがデザインパネルで非表示になり、起動時にアプリがクラッシュします。ただし、@color/blackのような一定の色に設定するだけで問題ありません。

より詳細な説明については、Android api reference。を参照しました。この問題を合理的に解決できる答えを見つけたと思います。（正確ではないかもしれません。）

問題は、あなたが提供したものが彼らが求めたものと正確に一致しないことです。

app:itemIconTintおよびapp:itemTextColorは16進数の色を要求し、app:itemBackgroundは文字通り Drawable を要求します。 <color>に記述するcolors.xml要素は、 ColorDrawable です。 Drawableから派生しているため、3つの属性すべてにフィードできます。

ただし、セレクタを使用するように変更すると、状況は異なります。 16進数の色とドロアブルの両方に対応するセレクターがあります。セレクターは、ユーザーが投入したリソースのように機能しますが、結果は元のものではありません。これは、単一目的のラッパーに似ています。 Drawableを必要とする属性に16進数の色を与えることはできません。

カラーセレクターは実際には ColorStateList であり、16進数の色を提供し、res/colorにあります。このファイルでは属性Android:colorのみを使用できます。 Android:drawableと記述するとエラーが表示されます。
描画可能セレクターは StateListDrawable で、Drawableを提供し、res/drawableにあります。ここにAndroid:drawableと書く必要がありますが、Android:colorと書いてもエラーはありません。

ただし、Android:colorはDrawableとして認識できない16進色のみを提供し、app:itemBackgroundはDrawableを必要とします、アプリは運命づけられています。 （直接の原因）

両方の属性（Android:colorおよびAndroid:drawable）はColorDrawableを受け入れます。ここでは、一定の色を設定する場合と同じように機能します。

解決策（および実践）は次のとおりです。

  • Android:drawableでres/drawable/drawable_selector.xmlを使用します（のみ）。例：

    <?xml version="1.0" encoding="utf-8"?>
<selector xmlns:Android="http://schemas.Android.com/apk/res/Android">
    <item Android:drawable="@color/colorAccent" Android:state_checked="true" />
    <item Android:drawable="@color/colorAccentDark" />
</selector>

  • （混乱を避けるため）16進数の色が必要な場合はres/color/color_selector.xmlを使用します。例：

    <?xml version="1.0" encoding="utf-8"?>
<selector xmlns:Android="http://schemas.Android.com/apk/res/Android">
    <item Android:color="@Android:color/white" Android:state_checked="true"/>
    <item Android:color="@color/colorPrimary" />
</selector>

  • app:itemBackgroundにドロアブルを提供します。例：

    <Android.support.design.widget.BottomNavigationView
    ...
    app:itemBackground="@drawable/drawable_selector"
    app:itemIconTint="@color/color_selector"
    app:itemTextColor="@color/color_selector"
    ... />

（Android Studioを使用している場合、その自動補完機能はどの属性が有効で利用可能かを教えてくれます。セレクターでAndroid:colorを推奨しません。 res/drawable！の下）

14
UnluckyNinja

これを試してみてください、これはナビゲーション項目選択リスナーのサンプルコードです。お役に立てば幸いです。

 @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;
  }

代替ソリューション：

次の内容の描画可能なファイル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>

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

<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セレクターに割り当てられます。

これを試してください。

2
Apoorv Mehrotra

最初にxml bottom_navigation_itemsを作成します。

`<ripple xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:color="?android:colorControlHighlight">
    <item>
        <selector>
            <item
                Android:drawable="@color/primary_bottom_select"
                Android:state_checked="true" />
            <item
                Android:drawable="@color/bottom_navigation"
                Android:state_checked="false" />
        </selector>
    </item>
</ripple>`

2番目：app:itemBackground="@drawable/bottom_navigation_items"を追加します

1
Yakov Weber