BottomNavigationView 很早之前就在 Material Design 中出现了,但是直到 Android Support Library 25 中才增加了 BottomNavigationView 控件。
添加依赖
compile 'com.android.support:design:25.3.1'
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:id="@+id/one"
android:icon="@mipmap/foot_ask_image"
android:title="call" />
<item
android:id="@+id/two"
android:icon="@mipmap/foot_ask_image_action"
android:title="message" />
<item
android:id="@+id/three"
android:icon="@mipmap/foot_look_live"
android:title="setting" />
<item
android:id="@+id/me"
android:icon="@mipmap/foot_look_live"
android:title="我的" />
</menu>
布局中
<?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:id="@+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_above="@+id/text"
android:layout_width="match_parent"
android:layout_height="match_parent"></android.support.v4.view.ViewPager>
<TextView
android:id="@+id/text"
android:layout_above="@+id/navigation"
android:layout_width="match_parent"
android:layout_height="2dp"
android:background="@android:color/darker_gray"/>
<android.support.design.widget.BottomNavigationView
android:id="@+id/navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
app:itemBackground="@android:color/white"
app:itemIconTint="@color/button_text"
app:itemTextColor="@color/button_text"
app:menu="@menu/navigation" />
</RelativeLayout>
注意
底部导航栏高度默认是 56dp。
菜单元素只能是 3~5 个。如果个数少于3个或者多于5个,则会报错。
如果大于3个则会变得很丑
public class ViewPagerAdapter extends FragmentPagerAdapter {
private final List<Fragment> mFragmentList = new ArrayList<>();
public ViewPagerAdapter(FragmentManager manager) {
super(manager);
}
@Override
public Fragment getItem(int position) {
return mFragmentList.get(position);
}
@Override
public int getCount() {
return mFragmentList.size();
}
public void addFragment(Fragment fragment) {
mFragmentList.add(fragment);
}
}
Fragment
public class LocationFragment extends Fragment {
private View mView;
@Override
public void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
}
@Nullable
@Override
public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
mView=inflater.inflate(R.layout.fragmet_one,container,false);
TextView textView= (TextView) mView.findViewById(R.id.text);
textView.setText("第一个");
return mView;
}
}
Activity
public class BottomActivitys extends AppCompatActivity{
private BottomNavigationView bottomNavigationView;
private ViewPager viewPager;
private MenuItem menuItem;
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.bottoms);
bottomNavigationView= (BottomNavigationView) findViewById(R.id.navigation);
viewPager= (ViewPager) findViewById(R.id.viewpager);
/**
* 切换
*/
bottomNavigationView.setOnNavigationItemSelectedListener(
new BottomNavigationView.OnNavigationItemSelectedListener() {
@Override
public boolean onNavigationItemSelected(@NonNull MenuItem item) {
switch (item.getItemId()){
case R.id.one:
viewPager.setCurrentItem(0);
break;
case R.id.two:
viewPager.setCurrentItem(1);
break;
case R.id.three:
viewPager.setCurrentItem(2);
break;
case R.id.me:
viewPager.setCurrentItem(3);
break;
}
return false;
}
});
/**
* viewpager滑动切换
*/
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 {
bottomNavigationView.getMenu().getItem(0).setChecked(false);
}
menuItem = bottomNavigationView.getMenu().getItem(position);
menuItem.setChecked(true);
}
@Override
public void onPageScrollStateChanged(int state) {
}
});
/**
* 禁止滑动
*/
viewPager.setOnTouchListener(new View.OnTouchListener() {
@Override
public boolean onTouch(View v, MotionEvent event) {
return true;
}
});
setupViewPager(viewPager);
}
private void setupViewPager(ViewPager viewPager) {
ViewPagerAdapter adapter = new ViewPagerAdapter(getSupportFragmentManager());
adapter.addFragment(new LocationFragment());
adapter.addFragment(new TwoFragment());
adapter.addFragment(new ThreeFragment());
adapter.addFragment(new LocationFragment());
viewPager.setAdapter(adapter);
}
}
运行如下:
![这里写图片描述](https://img-blog.csdn.net/20170531130111487?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvT3RsZGFu/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast)