填充bottomNavigation中的图标

Posted 2023-02-22

【中文标题】填充bottomNavigation中的图标

【英文标题】：Fill the icons in bottomNavigation

【发布时间】：2020-10-20 10:34:52

【问题描述】：

我使用bottomNavigation。

我想在选中时用“不是图标外部”的颜色填充图标。 我该怎么做？

<com.google.android.material.bottomnavigation.BottomNavigationView
    android:id="@+id/bottom_navigation"
    android:layout_
    android:layout_
    android:paddingTop="2dp"
    android:background="#FFFFFF"
    android:theme="@style/BottomNavigationTextStyle"
    app:labelVisibilityMode="labeled"
    app:itemIconSize="24dp"
    android:layout_alignParentBottom="true"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:menu="@menu/buttom_navigation_menu">

</com.google.android.material.bottomnavigation.BottomNavigationView>

【参考方案1】：

使用itemIconTint 属性：

<com.google.android.material.bottomnavigation.BottomNavigationView
   app:itemIconTint="@color/my_selector"
   ..>

并定义一个选择器，如：

<selector xmlns:android="http://schemas.android.com/apk/res/android">
  <item android:alpha="1.0" android:color="..." android:state_checked="true"/>
  <item android:alpha="0.6" android:color="..."/>
</selector>

【讨论】：

感谢您的回答，不幸的是，它没有按要求工作，我希望它像 Instagram 上的图标，所以当用户选择图标时它会填充。

【参考方案2】：

根据您的要求使用定制图像。您需要为 active 状态和 deactive 状态添加 2 张图像。

为您的图标创建一个选择器home_icon_selector.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/your_active_icon_here" android:state_selected="true" />
    <item android:drawable="@drawable/your_active_icon_here" android:state_pressed="true" />
    <item android:drawable="@drawable/your_active_icon_here" android:state_checked="true" />
    <item android:drawable="@drawable/your_deactive_icon_here" />
</selector>

更新您的菜单 buttom_navigation_menu 以使用上面的选择器

<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">
    <item
        android:id="@+id/menu_home"
        android:enabled="true"
        android:icon="@drawable/home_icon_selector"
        android:title="@string/tab_title_home"/>
</menu>