底部导航视图设计与 XML *没有编程方式



美好的一天。如何使用 XML 更改图标和文本颜色(活动和非活动(?

<android.support.design.widget.BottomNavigationView
            android:id="@+id/nav_view"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:background="@color/colorPrimaryDark"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            app:menu="@menu/bottom_nav_menu"
    />

试试这个:

<com.google.android.material.bottomnavigation.BottomNavigationView
    android:id="@+id/bottom_navigation"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom"
    android:background="@color/colorPrimary"
    app:itemIconTint="@color/nav_state_list"
    app:itemTextColor="@color/nav_state_list"
    app:layout_behavior="@string/hide_bottom_view_on_scroll_behavior"
    app:menu="@menu/menu_category" />

在您的drawable中创建color文件夹,并放置nav_state_list文件:

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

对于文本,请将以下 2 行添加到您的底部导航视图中:

app:itemTextAppearanceActive="@style/tabbar_text_active"
app:itemTextAppearanceInactive="@style/tabbar_text_inactive"

并在您的style.xml中为他们创建样式

<style name="tabbar_text_active" parent="TextAppearance.AppCompat.Small">
    <item name="android:textSize">12sp</item>
    <item name="android:textColor">@color/primaryLight</item>
</style>
<style name="tabbar_text_inactive" parent="TextAppearance.AppCompat.Small">
    <item name="android:textSize">12sp</item>
    <item name="android:textColor">@color/textLight</item>
</style>

对于图标

app:itemIconTint="@drawable/bottom_nav_colors"

使用可绘制对象:

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

最新更新