【问题标题】:Fill the icons in bottomNavigation填充bottomNavigation中的图标
【发布时间】:2020-10-20 10:34:52
【问题描述】:

我使用bottomNavigation

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

<com.google.android.material.bottomnavigation.BottomNavigationView
    android:id="@+id/bottom_navigation"
    android:layout_width="match_parent"
    android:layout_height="56dp"
    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>

【问题讨论】:

    标签: java android material-components-android android-bottomnav android-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>
    

    【讨论】:

      猜你喜欢
      • 2023-02-10
      • 2014-06-17
      • 1970-01-01
      • 2016-09-23
      • 2018-11-12
      • 1970-01-01
      • 1970-01-01
      • 2017-10-21
      • 2019-02-15
      相关资源
      最近更新 更多