Значок в png для нижней панели навигации android

Question

На панели навигации «Мой низ» я использую значок в меню 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>

скриншоты

Перед выбором:

После выбора:

Answer 1

Вы должны создать цветную иконку и простой значок одновременно, и во время выбора вы должны изменить форму значка простым цветом, а в нерабочее время вы должны изменить цвет значка на простой значок, это самый простой способ сделать это.

Answer 2

Проблема в том, что в выбранном состоянии применяется цветной фильтр для всей непрозрачной части значка. Чтобы исправить выбранный значок, вы должны сделать стрелки на зеленом круге прозрачными, а не белыми. Попросите дизайнера изменить его или сделайте это в каком-нибудь редакторе самостоятельно.

Answer 3

Ваша проблема возникает из-за того, что файл discover_green.png не имеет прозрачной области. Таким образом, при выборе пункта меню зеленый оттенок применяется ко всему изображению, поэтому вы видите зеленый круг.

Однако в ic_compas.png все, кроме compas, прозрачно, что означает, если вы используете его как icon Компас на изображении станет зеленым, когда выбран. Для этого вам придется изменить Discovery menu item как

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

. Это даст вам серый компас, если элемент не выбран, и зеленый компас, когда выбран.

Answer 4

"@ drawable / Discover_green" отметьте этот лоток, это то, что вы получаете после нажатия на компас?

вы используете список состояний, который можно рисовать, поэтому при нажатии на компас значок меняется на Discover_green , это так же, как вы определили. Решение состоит в том, чтобы полностью удалить блок списка состояний и использовать только значок или изменить значок зеленой точки на то, что вы хотите использовать.