[Android Studio] 底部导航栏的实现

1、新建项目

新建项目，选择"Bottom Navigation Activity"后，点击"Next"。

 2、activity_main.xml

该界面布局为：BottomNavigationView+fragment。

在BottomNavigationView里，app:menu：底部导航栏按钮菜单。

在fragment里，app:navGraph：关联导航图。

    //底部的导航按钮

    //导航图

3、bottom_nav_menu.xml菜单文件

在该文件里面定义底部的导航按钮，每一个item代表一个导航按钮。最多可显示五个导航按钮，开始系统默认创建3个导航按钮，可根据自己的需要自行添加。

说明：

1. android:icon<导航按钮显示的图标>
2. android:title<导航按钮显示的文字>

4、mobile_navigation.xml

该文件的作用为：定义fragment。

说明：

1. 每一个fragment的id与相应的底部导航按钮id需一致
2. navigation里：app:startDestination<指明开始默认的fragment>
3. fragment里：android:name<和它对应的Java类>
4. fragment里：android:label<界面顶部标题栏显示的文字>
5. fragment里：tools:layout<指明布局文件>

 //开始默认显示的fragment

    

    

    

    

5、MainActivity.java

package com.example.ji_zhang_ben; 

import android.os.Bundle;

import com.google.android.material.bottomnavigation.BottomNavigationView;

import androidx.appcompat.app.AppCompatActivity;
import androidx.navigation.NavController;
import androidx.navigation.Navigation;
import androidx.navigation.ui.AppBarConfiguration;
import androidx.navigation.ui.NavigationUI;

import com.example.ji_zhang_ben.databinding.ActivityMainBinding;

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);

        AppBarConfiguration appBarConfiguration = new AppBarConfiguration.Builder(
                R.id.navigation_home, R.id.navigation_dashboard, R.id.navigation_notifications,R.id.navigation_blank)
                .build();

        NavController navController = Navigation.findNavController(this, R.id.nav_host_fragment_activity_main);
        NavigationUI.setupActionBarWithNavController(this, navController, appBarConfiguration);
        NavigationUI.setupWithNavController(binding.navView, navController);
    }

}

6、HomeFragment.java

4个Fragment相应的Java类代码同理，只举例其中一个。

package com.example.ji_zhang_ben.ui.home;

import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import androidx.annotation.NonNull;
import androidx.fragment.app.Fragment;
import com.example.ji_zhang_ben.R;


public class HomeFragment extends Fragment {

    public View onCreateView(@NonNull LayoutInflater inflater,
                             ViewGroup container, Bundle savedInstanceState) {
        View view= inflater.inflate(R.layout.fragment_home, container, false);
        return view;                   //相应的布局文件
    }

}

7、项目结构图

 8、实现效果

 9、图片素材