Androidstudio使用BottomNavigationView 实现底部导航栏
文章目录
- 1. BottomNavigationView介绍
- 2. 实现步骤
- 创建菜单资源文件
- 在布局文件中添加 BottomNavigationView
- 在 Activity 中设置 BottomNavigationView
- 创建 Fragment
- 运行应用
- 3. 关于作者其它项目视频教程介绍
1. BottomNavigationView介绍
在 Android 开发中，BottomNavigationView 是一个常用的组件，用于实现底部导航栏。它通常与 Fragment 结合使用，以便在用户点击不同的导航项时切换不同的界面
2. 实现步骤
在 res/menu 目录下创建一个 XML 文件，用于定义底部导航栏的菜单项。例如，创建一个名为 user_navigation.xml 的文件：
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:id="@+id/home"
android:icon="@drawable/ic_baseline_home_24"
android:title="首页" />
<item
android:id="@+id/dynamic"
android:icon="@drawable/img_dynamic"
android:title="信息社" />
<item
android:id="@+id/found"
android:icon="@drawable/baseline_view_sidebar_24"
android:title="失物招领" />
<item
android:id="@+id/notify"
android:icon="@drawable/ic_baseline_notifications_none_24"
android:title="公告" />
<item
android:id="@+id/mine"
android:icon="@drawable/ic_baseline_manage_accounts_24"
android:title="我的" />
</menu>
注意事项： res下如果没有menu ，则先新建menu 文件夹
在你的主布局文件（例如 activity_main.xml）中添加 BottomNavigationView，并引用刚才创建的菜单资源文件：
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<FrameLayout
android:id="@+id/content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="@id/rel" />
<RelativeLayout
android:id="@+id/rel"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true">
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="@+id/bottomNavigationView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:labelVisibilityMode="labeled"
app:menu="@menu/user_navigation" />
</RelativeLayout>
</RelativeLayout>
在你的 MainActivity 中，设置 BottomNavigationView 的点击事件，并在用户点击不同的导航项时切换 Fragment
public class UserMainActivity extends MainActivity {
//创建4个 Fragment
private HomeFragment mHomeFragment;
private PostFragment mPostFragment;
private FoundFragment mFoundFragment;
private NotifyFragment mNotifyFragment;
private MineFragment mMineFragment;
private BottomNavigationView bottomNavigationView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//初始化控件
bottomNavigationView = findViewById(R.id.bottomNavigationView)
//bottomNavigationView tab点击切换
main_bottom_nv.setOnNavigationItemSelectedListener(new BottomNavigationView.OnNavigationItemSelectedListener() {
@Override
public boolean onNavigationItemSelected(@NonNull MenuItem item) {
if (item.getItemId() == R.id.home) {
selectedFragment(0);
} else if (item.getItemId() == R.id.dynamic) {
selectedFragment(1);
} else if (item.getItemId() == R.id.found) {
selectedFragment(2);
} else if (item.getItemId() == R.id.notify) {
selectedFragment(3);
} else {
selectedFragment(4);
}
return true;
}
});
//默认首页选中
selectedFragment(0);
}
private void selectedFragment(int position) {
FragmentTransaction fragmentTransaction = getSupportFragmentManager().beginTransaction();
hideFragment(fragmentTransaction);
if (position == 0) {
if (mHomeFragment == null) {
mHomeFragment = new HomeFragment();
fragmentTransaction.add(R.id.content, mHomeFragment);
} else {
fragmentTransaction.show(mHomeFragment);
}
} else if (position == 1) {
if (mPostFragment == null) {
mPostFragment = new PostFragment();
fragmentTransaction.add(R.id.content, mPostFragment);
} else {
fragmentTransaction.show(mPostFragment);
}
} else if (position == 2) {
if (mFoundFragment == null) {
mFoundFragment = new FoundFragment();
fragmentTransaction.add(R.id.content, mFoundFragment);
} else {
fragmentTransaction.show(mFoundFragment);
}
} else if (position == 3) {
if (mNotifyFragment == null) {
mNotifyFragment = new NotifyFragment();
fragmentTransaction.add(R.id.content, mNotifyFragment);
} else {
fragmentTransaction.show(mNotifyFragment);
}
} else {
if (mMineFragment == null) {
mMineFragment = new MineFragment();
fragmentTransaction.add(R.id.content, mMineFragment);
} else {
fragmentTransaction.show(mMineFragment);
}
}
//提交
fragmentTransaction.commit();
}
private void hideFragment(FragmentTransaction fragmentTransaction) {
if (mHomeFragment != null) {
fragmentTransaction.hide(mHomeFragment);
}
if (mNotifyFragment != null) {
fragmentTransaction.hide(mNotifyFragment);
}
if (mPostFragment != null) {
fragmentTransaction.hide(mPostFragment);
}
if (mFoundFragment != null) {
fragmentTransaction.hide(mFoundFragment);
}
if (mMineFragment != null) {
fragmentTransaction.hide(mMineFragment);
}
}
}
创建对应的 Fragment 类，例如 HomeFragment、PostFragment、NotifyFragment 和 MineFragment 。每个 Fragment 对应一个导航项。
public class HomeFragment extends Fragment {
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
// Inflate the layout for this fragment
return inflater.inflate(R.layout.fragment_home, container, false);
}
}
温馨提示： 这里就创建了一个HomeFragment页面，其它页面依次创建即可
现在，你可以运行应用并查看底部导航栏的效果。点击不同的导航项时，Fragment 会相应地切换。
3. 关于作者其它项目视频教程介绍
- Android新闻资讯app实战：https://www.bilibili.com/video/BV1CA1vYoEad/?vd_source=984bb03f768809c7d33f20179343d8c8
- Androidstudio开发购物商城实战：https://www.bilibili.com/video/BV1PjHfeXE8U/?vd_source=984bb03f768809c7d33f20179343d8c8
- Android开发备忘录记事本实战：https://www.bilibili.com/video/BV1FJ4m1u76G?vd_source=984bb03f768809c7d33f20179343d8c8&spm_id_from=333.788.videopod.sections
- Androidstudio底部导航栏实现：https://www.bilibili.com/video/BV1XB4y1d7et/?spm_id_from=333.337.search-card.all.click&vd_source=984bb03f768809c7d33f20179343d8c8
- Android使用TabLayout+ViewPager2实现左右滑动切换：https://www.bilibili.com/video/BV1Mz4y1c7eX/?spm_id_from=333.337.search-card.all.click&vd_source=984bb03f768809c7d33f20179343d8c8