Android 底部导航栏BottomNavigationView的使用

迈不过友情╰ 2022-03-18 01:11 1000阅读 0赞

1.BottomNavigationView是support desigin包下的控件,用于底部导航~

①使用之前在App的build.gradle中添加依赖

  1. com.android.support:design:27.1.1

②接下来布局文件

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3. xmlns:app="http://schemas.android.com/apk/res-auto"
  4. android:layout_width="match_parent"
  5. android:layout_height="match_parent"
  6. android:orientation="vertical">
  7. <FrameLayout
  8. android:id="@+id/framelayout"
  9. android:layout_width="match_parent"
  10. android:layout_height="0dp"
  11. android:layout_weight="1"></FrameLayout>
  12. <android.support.design.widget.BottomNavigationView
  13. android:id="@+id/bottom_nav_view"
  14. android:layout_width="match_parent"
  15. android:layout_height="wrap_content"
  16. android:layout_alignParentBottom="true"
  17. android:background="@color/bottom_nav_bg"
  18. app:itemIconTint="@drawable/bottom_nav_item_selector"
  19. app:itemTextColor="@drawable/bottom_nav_item_selector"
  20. app:menu="@menu/bottom_nav_menu"></android.support.design.widget.BottomNavigationView>
  21. </LinearLayout>

布局包含内容区域和导航栏,内容区域framelayout是用来承载不同的fragment

#FFFFFF
bottom_nav_item_selector:

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <selector xmlns:android="http://schemas.android.com/apk/res/android">
  3. <item android:state_checked="true" android:color="@color/toobar_bg"></item>
  4. <item android:state_checked="false" android:color="@color/nav_item_selected_bg"></item>
  5. </selector>

bottom_nav_menu:

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <menu xmlns:android="http://schemas.android.com/apk/res/android"
  3. xmlns:app="http://schemas.android.com/apk/res-auto">
  4. <item
  5. android:id="@+id/tab_home_page"
  6. android:icon="@mipmap/icon_home_pager_not_selected"
  7. android:title="@string/tv_tab_home"
  8. android:enabled="true"
  9. app:showAsAction="ifRoom"></item>
  10. <item
  11. android:id="@+id/tab_knowledge_hierarchy"
  12. android:icon="@mipmap/icon_knowledge_hierarchy_not_selected"
  13. android:title="@string/tv_knowledge_hierarchy"
  14. android:enabled="true"
  15. app:showAsAction="ifRoom"></item>
  16. <item
  17. android:id="@+id/tab_navigation"
  18. android:icon="@mipmap/icon_navigation_not_selected"
  19. android:title="@string/tv_navigation"
  20. android:enabled="true"
  21. app:showAsAction="ifRoom"></item>
  22. <item
  23. android:id="@+id/tab_project"
  24. android:icon="@mipmap/icon_project_not_selected"
  25. android:title="@string/tv_project"
  26. android:enabled="true"
  27. app:showAsAction="ifRoom"></item>
  28. </menu>

监听BottomNavigationView状态发生变化时,fragment的切换

  1. public class MainActivity extends AppCompatActivity {
  2. @BindView(R.id.framelayout)
  3. FrameLayout framelayout;
  4. @BindView(R.id.bottom_nav_view)
  5. BottomNavigationView bottomNavView;
  6. private List<Fragment> mFragments;
  7. HomePageFragment homePageFragment;
  8. KnowledgeFragment knowledgeFragment;
  9. NavigationFragment navigationFragment;
  10. ProjectFragment projectFragment;
  11. FragmentManager mSupportFragmentManager;
  12. UserDialogFragment userDialogFragment;
  13. SearchFragment searchFragment;
  14. FragmentTransaction mTransaction;
  15. private int mLastIndex; //记录点击上一个fragment的索引值
  16. @Override
  17. protected void onCreate(Bundle savedInstanceState) {
  18. super.onCreate(savedInstanceState);
  19. setContentView(R.layout.activity_main);
  20. ButterKnife.bind(this);
  21. initToobar();
  22. initDrawerLayout();
  23. initBottomNavigationView();
  24. initFragment();
  25. }
  26. private void initFragment() {
  27. mFragments = new ArrayList<>();
  28. homePageFragment = HomePageFragment.newInstance(null, null);
  29. knowledgeFragment = KnowledgeFragment.newInstance(null, null);
  30. navigationFragment = NavigationFragment.newInstance(null, null);
  31. projectFragment = ProjectFragment.newInstance(null, null);
  32. userDialogFragment = UserDialogFragment.newInstance(null, null);
  33. searchFragment=SearchFragment.newInstance(null,null);
  34. mFragments.add(homePageFragment);
  35. mFragments.add(knowledgeFragment);
  36. mFragments.add(navigationFragment);
  37. mFragments.add(projectFragment);
  38. mFragments.add(userDialogFragment);
  39. mFragments.add(searchFragment);
  40. //初始化展示HomePageFragment
  41. setFragmentPosition(0,getString(R.string.tv_tab_home));
  42. }
  43. private void initBottomNavigationView() {
  44. BottomNavigationViewHelper.disableShiftMode(bottomNavView);//解决当item大于三个时,非平均布局问题
  45. bottomNavView.setOnNavigationItemSelectedListener(new BottomNavigationView.OnNavigationItemSelectedListener() {
  46. @Override
  47. public boolean onNavigationItemSelected(@NonNull MenuItem item) {
  48. switch (item.getItemId()) {
  49. case R.id.tab_home_page: //首页
  50. setFragmentPosition(0,getString(R.string.tv_tab_home));
  51. break;
  52. case R.id.tab_knowledge_hierarchy: //知识体系
  53. setFragmentPosition(1,getString(R.string.tv_knowledge_hierarchy));
  54. break;
  55. case R.id.tab_navigation: //导航
  56. setFragmentPosition(2,getString(R.string.tv_navigation));
  57. break;
  58. case R.id.tab_project://项目
  59. setFragmentPosition(3,getString(R.string.tv_project));
  60. break;
  61. }
  62. return true;
  63. }
  64. });
  65. }
  66. public void setFragmentPosition(int position,String toobarTitle) {
  67. title.setText(toobarTitle);
  68. mSupportFragmentManager = this.getSupportFragmentManager();
  69. mTransaction = mSupportFragmentManager.beginTransaction();
  70. Fragment currentFragment = mFragments.get(position);
  71. Fragment lastFragement = mFragments.get(mLastIndex);
  72. mLastIndex = position;
  73. mTransaction.hide(lastFragement);
  74. if (!currentFragment.isAdded()) {
  75. //mTransaction.remove(currentFragment).commit();
  76. mTransaction.add(R.id.framelayout, currentFragment);
  77. }
  78. mTransaction.show(currentFragment);
  79. mTransaction.commitAllowingStateLoss();
  80. }
  81. }

使用到的工具类:

  1. /**
  2. * Created by ${wcystart}
  3. * date:on 2019/1/29
  4. * description:解决当导航栏按钮个数大于三个时,分布非平均布局问题
  5. */
  6. public class BottomNavigationViewHelper {
  7. @SuppressLint("RestrictedApi")
  8. public static void disableShiftMode(BottomNavigationView view) {
  9. BottomNavigationMenuView menuView = (BottomNavigationMenuView) view.getChildAt(0);
  10. try {
  11. Field shiftingMode = menuView.getClass().getDeclaredField("mShiftingMode");
  12. shiftingMode.setAccessible(true);
  13. shiftingMode.setBoolean(menuView, false);
  14. shiftingMode.setAccessible(false);
  15. for (int i = 0; i < menuView.getChildCount(); i++) {
  16. BottomNavigationItemView item = (BottomNavigationItemView) menuView.getChildAt(i);
  17. //noinspection RestrictedApi
  18. item.setShiftingMode(false);
  19. // set once again checked value, so view will be updated
  20. //noinspection RestrictedApi
  21. item.setChecked(item.getItemData().isChecked());
  22. }
  23. } catch (NoSuchFieldException e) {
  24. Log.e("BNVHelper", "Unable to get shift mode field", e);
  25. } catch (IllegalAccessException e) {
  26. Log.e("BNVHelper", "Unable to change value of shift mode", e);
  27. }
  28. }
  29. }

效果图:

watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM3OTgyODIz_size_16_color_FFFFFF_t_70 watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM3OTgyODIz_size_16_color_FFFFFF_t_70 1

watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM3OTgyODIz_size_16_color_FFFFFF_t_70 2 watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM3OTgyODIz_size_16_color_FFFFFF_t_70 3

发表评论

表情:
评论列表 (有 0 条评论,1000人围观)

还没有评论,来说两句吧...

相关阅读