Fragment实例精讲——底部导航栏的实现步骤

底部导航栏的实现步骤

底部导航栏的实现需要使用Fragment和ViewPager来实现，需要在布局文件中添加ViewPager，在Activity中实例化ViewPager，并创建Fragment实例，并将Fragment实例添加到ViewPager中，实例化底部导航栏，添加监听器，并将ViewPager和底部导航栏绑定，以实现导航栏和ViewPager联动。

具体实现步骤

• 1. 布局文件中添加ViewPager

  在布局文件中添加ViewPager，用于显示Fragment，代码如下：

• 2. 在Activity中实例化ViewPager

  在Activity中实例化ViewPager，并创建Fragment实例，并将Fragment实例添加到ViewPager中，代码如下：

  ViewPager viewPager = findViewById(R.id.viewpager);
  FragmentManager fm = getSupportFragmentManager();
  List fragments = new ArrayList<>();
  fragments.add(new HomeFragment());
  fragments.add(new CategoryFragment());
  fragments.add(new CartFragment());
  fragments.add(new MineFragment());
  FragmentPagerAdapter adapter = new FragmentPagerAdapter(fm, fragments);
  viewPager.setAdapter(adapter);
      

• 3. 实例化底部导航栏

  实例化底部导航栏，添加监听器，代码如下：

  BottomNavigationView bottomNavigationView = findViewById(R.id.bottom_navigation_view);
  bottomNavigationView.setOnNavigationItemSelectedListener(new BottomNavigationView.OnNavigationItemSelectedListener() {
      @Override
      public boolean onNavigationItemSelected(@NonNull MenuItem item) {
          switch (item.getItemId()) {
              case R.id.home:
                  viewPager.setCurrentItem(0);
                  break;
              case R.id.category:
                  viewPager.setCurrentItem(1);
                  break;
              case R.id.cart:
                  viewPager.setCurrentItem(2);
                  break;
              case R.id.mine:
                  viewPager.setCurrentItem(3);
                  break;
          }
          return true;
      }
  });
      

• 4. 绑定ViewPager和底部导航栏

  将ViewPager和底部导航栏绑定，以实现导航栏和ViewPager联动，代码如下：

  viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
      @Override
      public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
      }
  
      @Override
      public void onPageSelected(int position) {
          bottomNavigationView.getMenu().getItem(position).setChecked(true);
      }
  
      @Override
      public void onPageScrollStateChanged(int state) {
      }
  });