底部导航栏android的png图标

时间:2020-03-02 10:39:44

标签: android kotlin material-design bottomnavigationview

在“我的底部”导航栏中,我在菜单XML中使用一个图标,选中该图标后,其颜色会随着主题颜色而改变。

在选项卡上单击图标后,图标完全改变了,我完全陷入了为什么png图片会发生这种情况。

底部导航

<com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/navigation"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        android:background="@color/white"
        app:labelVisibilityMode="labeled"
        app:itemBackground="@color/transparent"
        app:itemTextColor="@color/black"
        app:layout_constraintBottom_toBottomOf="parent"
        app:menu="@menu/bottom_navigation_main" />

选择器

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

Bottom_nav_menu

 <?xml version="1.0" encoding="utf-8"?>
    <menu xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto">
        <item
            android:id="@+id/chatMenuFragment"
            android:enabled="true"enter code here
            android:icon="@drawable/chat_selector"
            android:title="Chat"
            app:showAsAction="always" />
        <item
            android:id="@+id/contactsFragment"
            android:enabled="true"
            android:icon="@drawable/people_selector"
            android:title="People"
            app:showAsAction="always" />
        <item
            android:id="@+id/discoverFragment"
            android:enabled="true"
            android:icon="@drawable/discover_selector"
            android:title="Discovery"
            android:backgroundTint="@color/white"
            app:showAsAction="always|withText" />
        <item
            android:id="@+id/myProfileFragment"
            android:enabled="true"
            android:icon="@drawable/user_selector"
            android:title="My"
            app:showAsAction="always|withText" />
    </menu>

屏幕截图

选择之前:

enter image description here

选择后:

enter image description here

5 个答案:

答案 0 :(得分:1)

我遇到了类似的问题,问题是默认情况下底部导航视图会为可绘制对象添加色调并填充所有不透明的内容(例如您的资产)。

尝试添加这一行 bottomNavigationView.itemIconTintList = null

答案 1 :(得分:0)

“ @ drawable / discover_green”检查此抽奖活动,是按指南针后得到的东西吗?

您使用的是可绘制的状态列表,因此当您按下指南针时,图标更改为discover_green,与您定义的相同。 解决方案是完全删除状态列表drawble,仅使用图标或将绿点图标更改为您要使用的图标。

答案 2 :(得分:0)

问题是选定状态对图标的整个不透明部分应用了滤色器。要修复所选图标,您必须使绿色圆圈上的箭头透明而不是白色。要求设计师进行更改,或由您自己在某些编辑器中进行更改。

答案 3 :(得分:0)

您的问题是由于discover_green.png文件没有透明区域这一事实引起的。因此,当菜单项被选择的绿色色调被施加到整个图像,因此你看到绿色圆圈。

但是在ic_compas.png中,除compas以外的所有内容都是透明的,这意味着如果将其用作icon,则选中的图像中compas将变为绿色。为此,您必须将Discovery menu item修改为

       <item
        android:id="@+id/discoverFragment"
        android:enabled="true"
        android:icon="@drawable/ic_compas"
        android:title="Discovery"
        app:showAsAction="always|withText" />

如果未选择项目,这将为您提供灰色Compas,而当您选择项目时,将为绿色Compas。

答案 4 :(得分:0)

您必须同时创建颜色图标和简单图标,并且在选择时必须将图标形式从纯色更改为彩色,而在不选择时间,则必须将颜色图标更改为纯色图标,这是最简单的方法。 / p>