前言
我们常常遇到这样的任务场景,需要动手制作一个导航栏,要求在点击时图标颜色和文字发生改变,那么这样的场景应该如何实现呢?
一、图标的动态更改
图标的动态更改我们通过自定义Layout和BottomNavigationView中的属性进行更改
新建Menu等步骤就不进行赘述了,这一部分还不了解的朋友可以先看一下BottomNavigationView的使用
这里直接放出代码供大家进行阅读
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="@+id/mainBottomNavigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#161817"
app:itemIconTint="@drawable/bottom_btn_selected_color"
app:labelVisibilityMode="labeled"
android:elevation="1dp"
app:menu="@menu/menu"/>
重点关注itemIconTint属性,它是实现BottomNavigationView的实现按钮动态颜色转变的关键
bottom_btn_selected_color.xml属性如下
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:color="@color/bottom_btn_selected" android:state_checked="true" />
<item android:color="@color/bottom_btn_unselected" android:state_checked="false"/>
</selector>
最终实现效果
曾经笔者尝试过在menu中设置对每个Item设置drawable的形式进行区分点击和未点击的状态,但是事实上点击的事件是在BottomNavigationView这一层就进行了消费,并不会向下传递,所以该种做法并不行得通,有相同想法的uu可以看看
二、文字的动态更改
文字的动态更改需要通过Java代码进行实现,具体的代码如下
Resources resource = getResources();
@SuppressLint("ResourceType")
ColorStateList csl = resource.getColorStateList(R.drawable.bottom_btn_selected_color);
bottomNav.setItemTextColor(csl);
这里的drawable文件主要是用于实现颜色切换,上面第一个问题中的drawable文件类似
最终实现效果如上图所示
|