目标
我们常见的app,都有底部导航栏,今天我们采用fragement+navition来实现,当然换有其他的方案来也能实现,看自己的爱好。
步骤
1. Activity的布局文件(activity_main.xml)
<androidx.coordinatorlayout.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent"> <com.google.android.material.bottomnavigation.BottomNavigationView android:id="@+id/bottom_navigation" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@color/colorPrimaryDark" app:itemTextColor="@color/white" app:menu="@menu/bottom_navigation_menu" /> <fragment android:id="@+id/fragmentContainer" android:name="androidx.navigation.fragment.NavHostFragment" android:layout_width="match_parent" android:layout_height="match_parent" app:defaultNavHost="true" app:navGraph="@navigation/nav_graph" /> </androidx.coordinatorlayout.widget.CoordinatorLayout>
2. 底部导航菜单(bottom_navigation_menu.xml)
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"> <item android:id="@+id/nav_home" android:title="Home"></item> <item android:id="@+id/nav_profile" android:title="Profile"></item> <item android:id="@+id/nav_settings" android:title="Settings"></item> <item android:id="@+id/nav_logout" android:title="Logout"></item>
</menu>
3. NavGraph文件(nav_graph.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"> <fragment android:id="@+id/nav_home" android:name="com.example.myapp.HomeFragment" /> <fragment android:id="@+id/nav_profile" android:name="com.example.myapp.ProfileFragment" /> <fragment android:id="@+id/nav_settings" android:name="com.example.myapp.SettingsFragment" /> <fragment android:id="@+id/nav_logout" android:name="com.example.myapp.LogoutFragment" />
</navigation>
4. 在Activity中获取BottomNavigationView的实例,并为其添加监听器。核心部分功能
BottomNavigationView bottomNavigationView = findViewById(R.id.bottom_navigation);
bottomNavigationView.setOnNavigationItemSelectedListener(new BottomNavigationView.OnNavigationItemSelectedListener() { @Override public boolean onNavigationItemSelected(@NonNull MenuItem menuItem) { switch (menuItem.getItemId()) { case R.id.nav_home: // 跳转到HomeFragment break; case R.id.nav_profile: // 跳转到ProfileFragment break; case R.id.nav_settings: // 跳转到SettingsFragment break; case R.id.nav_logout: // 跳转到LogoutFragment break; } return true; // 表示该事件已被处理,不再传递给其他监听器。如果返回false,则该事件将传递给其他监听器。 }
});