BottomNavigationView与Navigation使用

目录

1 as自动生

2 xml代码

如果要修改底部的图标和文字需要去bottom_nav_menu修改

 如果你要修改默认点击颜色需要去主题颜色修改

如果你要修改底部背景颜色可以在BottomNavigationView 的背景颜色修改

如果你要 自定义 点击 图标和文字 颜色可以自定义一个选择器修改

 3 MainActivity 代码

如果不想想使用ActionBar 可以把注释掉这句代码

1 as自动生

2 xml代码

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
   >
<!--    android:background="?android:attr/windowBackground"?-->
    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/nav_view"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="0dp"
        android:layout_marginEnd="0dp"
        android:background="@color/white_1"

        app:itemIconTint="@drawable/bottom_navigation_item_selector"
        app:itemTextColor="@drawable/bottom_navigation_item_selector"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:menu="@menu/bottom_nav_menu" />

<!--    bottom_navigation_item_selector 修改按钮颜色-->

    <fragment
        android:id="@+id/nav_host_fragment_activity_main"
        android:name="androidx.navigation.fragment.NavHostFragment"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginBottom="56dp"
        app:defaultNavHost="true"
        app:layout_constraintBottom_toTopOf="@id/nav_view"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:navGraph="@navigation/mobile_navigation" />
    <!-- 上面那个一定要写  android:layout_marginBottom="56dp"，否则会出现底部看不到的情况-->
</androidx.constraintlayout.widget.ConstraintLayout>

这个有一个bug是，界面的底部是看不到的，需要增加marginbuttom 处理

 android:layout_marginBottom="56dp"

为什么是56dp？

我去查看了BottomNavigationView源码看到高度为56dp，所以距离底部56dp可以保证显示的完整性

文件列表里面有个新的东西

这些就是 Navigation 对应的三个fragment，点击底部按钮可以切换。

如果要修改底部的图标和文字需要去bottom_nav_menu修改

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

    <item
        android:id="@+id/navigation_fast"
        android:icon="@drawable/ic_home_black_24dp"
        android:title="@string/title_fast" />

    <item
        android:id="@+id/navigation_all"
        android:icon="@drawable/ic_dashboard_black_24dp"
        android:title="@string/title_all" />

    <item
        android:id="@+id/navigation_my"
        android:icon="@drawable/ic_my_black_24dp"
        android:title="@string/title_my" />

</menu>

 如果你要修改默认点击颜色需要去主题颜色修改

<resources xmlns:tools="http://schemas.android.com/tools">
    <!-- Base application theme. -->
    <style name="Theme.MyApplication" parent="Theme.AppCompat.NoActionBar">
        <!-- Primary brand color. -->
        <item name="colorPrimary">@color/blue</item>
        <item name="colorPrimaryVariant">@color/blue</item>
        <item name="colorOnPrimary">@color/blue</item>
        <!-- Secondary brand color. -->
        <item name="colorSecondary">@color/teal_200</item>
        <item name="colorSecondaryVariant">@color/teal_700</item>
        <item name="colorOnSecondary">@color/black</item>
        <!-- Status bar color. -->
        <item name="android:statusBarColor" tools:targetApi="l">?attr/colorPrimaryVariant</item>
        <!-- Customize your theme here. -->
    </style>
</resources>

如果你要修改底部背景颜色可以在BottomNavigationView 的背景颜色修改

android:background="@color/white_1"

如果你要 自定义 点击 图标和文字 颜色可以自定义一个选择器修改

bottom_navigation_item_selector

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

    <item android:color="@color/color_focused" android:state_checked="true" />
    <item android:color="@color/color_un_focused" android:state_checked="false" />
</selector>

  <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/nav_view"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="0dp"
        android:layout_marginEnd="0dp"
        android:background="@color/white_1"

        app:itemIconTint="@drawable/bottom_navigation_item_selector"
        app:itemTextColor="@drawable/bottom_navigation_item_selector"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:menu="@menu/bottom_nav_menu" />

 app:itemIconTint="@drawable/bottom_navigation_item_selector"
 app:itemTextColor="@drawable/bottom_navigation_item_selector"

这两句代码就是对应的修改代码

 3 MainActivity 代码

public class MainActivity extends AppCompatActivity {

    private ActivityMainBinding binding;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        binding = ActivityMainBinding.inflate(getLayoutInflater());
        setContentView(binding.getRoot());

        BottomNavigationView navView = findViewById(R.id.nav_view);
        //将每个菜单ID作为一组ID传递，因为每个菜单应该被视为顶级目的地。
        //自己在menu里修改文字和图片
//        AppBarConfiguration appBarConfiguration = new AppBarConfiguration.Builder(
//                R.id.navigation_fast, R.id.navigation_all, R.id.navigation_my)
//                .build();
        NavController navController = Navigation.findNavController(this, R.id.nav_host_fragment_activity_main);
//        NavigationUI.setupActionBarWithNavController(this, navController, appBarConfiguration);//不要actionbar
        NavigationUI.setupWithNavController(binding.navView, navController);


    }

}

如果不想想使用ActionBar 可以把注释掉这句代码

 NavigationUI.setupActionBarWithNavController(
   this, 
   navController, 
   appBarConfiguration);

我这是项目不需要actionbar，自己做了个title

这样就做好了框架，其它要修改的代码在fragment里面写就可以了