Android Studio3.5快速实现BottomNavigationView底部导航

0、项目效果

 

1、使用AS3.5 创建 Bottom Navigation Activity

 

2、修改项目的res-->menu-->bottom_nav_menu.xml(设置底部item)

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">

    <item
        android:id="@+id/navigation_home"
        android:icon="@drawable/ic_home"
        android:title="@string/title_home" />

    <item
        android:id="@+id/navigation_integral"
        android:icon="@drawable/ic_integral"
        android:title="@string/title_integral" />

    <item
        android:id="@+id/navigation_deal"
        android:icon="@drawable/ic_deal"
        android:title="@string/title_deal" />

    <item
        android:id="@+id/navigation_mine"
        android:icon="@drawable/ic_mine"
        android:title="@string/title_mine" />

</menu>

    2.1、item的icon使用<selector>实现点击切换图标

ic.home.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- true 选中 false 未选中-->
    <item android:drawable="@drawable/ic_home_selected" android:state_checked="true" />
    <item android:drawable="@drawable/ic_home_unselected" android:state_checked="false" />

</selector>


ic_home_selected和ic_home_unselected使用SVG图片生成xml文件,因为是svg矢量图,就不用准备很多套图片了

    2.2、

3、修改项目的res-->navigation-->mobile_navigation.xml

<?xml version="1.0" encoding="utf-8"?>
<navigation xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/mobile_navigation"
    app:startDestination="@+id/navigation_home">

    <fragment
        android:id="@+id/navigation_home"
        android:name="com.example.demo.ui.home.HomeFragment"
        android:label="@string/title_home"
        tools:layout="@layout/fragment_home" />

    <fragment
        android:id="@+id/navigation_integral"
        android:name="com.example.demo.ui.integral.IntegralFragment"
        android:label="@string/title_integral"
        tools:layout="@layout/fragment_integral" />

    <fragment
        android:id="@+id/navigation_deal"
        android:name="com.example.demo.ui.deal.DealFragment"
        android:label="@string/title_deal"
        tools:layout="@layout/fragment_deal" />

    <fragment
        android:id="@+id/navigation_mine"
        android:name="com.example.demo.ui.mine.MineFragment"
        android:label="@string/title_mine"
        tools:layout="@layout/fragment_mine" />
</navigation>

4、修改java-->xxx-->ui下各item的Fragment和ViewModel

5、细节设置

在BottomNavigationView的xml直接配置

app:itemBackground="@null"

去除水波纹动画

在res-->values-->dimens.xml里

<!--  重写这两个属性, item切换的缩放就没了  -->
<dimen name="design_bottom_navigation_active_text_size" tools:override="true">12sp</dimen>
<dimen name="design_bottom_navigation_text_size" tools:override="true">12sp</dimen>
©️2020 CSDN 皮肤主题: 大白 设计师:CSDN官方博客 返回首页