底部导航栏BottomNavigationView的使用

Author Avatar
Zhu Yuexin Aug 11, 2017

准备工作

在build.gradle文件中添加依赖

compile 'com.android.support:design:25.3.1'

添加布局文件



  

  

在res目录下新建menu文件夹,新建navigation_item.xml文件



    

    

    

这个文件对应于BottomNavigationView的”app:menu”属性,指定了导航栏的菜单图标与标题

在drawable文件夹下新建navigation_selector.xml文件



    
    

这个文件可用于BottomNavigationView的背景、字体、图标颜色等的显示。

与ViewPager交互使用

新建MyFragmentPagerAdapter继承自FragmentPagerAdapter

public class MyFragmentPagerAdapter extends FragmentPagerAdapter {
    private List fragmentList;

    public MyFragmentPagerAdapter(FragmentManager fm, List fragmentList) {
        super(fm);
        this.fragmentList = fragmentList;
    }

    @Override
    public int getCount() {
        return fragmentList.size();
    }

    @Override
    public Fragment getItem(int position) {
        return fragmentList.get(position);
    }

    @Override
    public long getItemId(int position) {
        return position;
    }
}

在Activity中引用

public class MainActivity extends AppCompatActivity {
    private List fragmentList = new ArrayList<>();
    private FragmentPagerAdapter fragmentPagerAdapter;
    private MenuItem menuItem;

    //三个Fragment
    private CommunityFragment communityFragment;
    private HomeFragment homeFragment;
    private ScheduleFragment scheduleFragment;

    @BindView(R.id.view_pager)
    ViewPager viewPager;
    @BindView(R.id.bottom_navigation)
    BottomNavigationView bottomNavigationView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        ButterKnife.bind(this);

        communityFragment = new CommunityFragment();
        homeFragment = new HomeFragment();
        scheduleFragment = new ScheduleFragment();
        fragmentList.add(communityFragment);
        fragmentList.add(homeFragment);
        fragmentList.add(scheduleFragment);

        fragmentPagerAdapter = new MyFragmentPagerAdapter(getSupportFragmentManager(), fragmentList);
        viewPager.setAdapter(fragmentPagerAdapter);

        bottomNavigationView.setOnNavigationItemSelectedListener(new BottomNavigationView.OnNavigationItemSelectedListener() {
            @Override
            public boolean onNavigationItemSelected(@NonNull MenuItem item) {
                switch (item.getItemId()){
                    case R.id.community:
                        viewPager.setCurrentItem(0);
                        break;
                    case R.id.schedule:
                        viewPager.setCurrentItem(1);
                        break;
                    case R.id.me:
                        viewPager.setCurrentItem(2);
                        break;
                }
                return false;
            }
        });

        viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

            }

            @Override
            public void onPageSelected(int position) {
                if (menuItem != null){
                    menuItem.setChecked(false);
                }else {
                    menuItem = bottomNavigationView.getMenu().getItem(0).setChecked(false);
                }
                menuItem = bottomNavigationView.getMenu().getItem(position).setChecked(true);
            }

            @Override
            public void onPageScrollStateChanged(int state) {

            }
        });
    }
}

效果如下