在很多应用中可以同过滑动屏幕来切换页面,在Android开发中咱们可以通过ViewPager和Fragment来实现这一功能,本教程通过 ViewPager+Fragment+BottomNavigationView 来实现底部栏与页面切换
没图说个锤子,咱来看看效果图
activity_main.xml 布局代码
<?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"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_above="@id/navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
<android.support.design.widget.BottomNavigationView
android:id="@+id/navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
app:menu="@menu/navigation" />
</RelativeLayout>
fragment.xml 布局代码
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:gravity="center">
<TextView
android:textSize="15sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/tv"/>
</LinearLayout>
navigation.xml 代码
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:id="@+id/navigation_home"
android:icon="@drawable/ic_home_black_24dp"
android:title="@string/title_home" />
<item
android:id="@+id/navigation_dashboard"
android:icon="@drawable/ic_dashboard_black_24dp"
android:title="@string/title_dashboard" />
<item
android:id="@+id/navigation_notifications"
android:icon="@drawable/ic_notifications_black_24dp"
android:title="@string/title_notifications" />
</menu>
ViewPagerAdapter 继承自FragmentPagerAdapter
class ViewPagerAdapter extends FragmentPagerAdapter{
public ViewPagerAdapter(FragmentManager fm) {
super(fm);
}
@Override
public Fragment getItem(int i) {
return fragmentList.get(i);
}
@Override
public int getCount() {
return fragmentList.size();
}
}
MainActivity.java 完整代码
public class MainActivity extends AppCompatActivity {
private ViewPager viewpager;
private BottomNavigationView navigation;
private List<Fragment> fragmentList = new ArrayList<>();
private BottomNavigationView.OnNavigationItemSelectedListener mOnNavigationItemSelectedListener
= new BottomNavigationView.OnNavigationItemSelectedListener() {
@Override
public boolean onNavigationItemSelected(@NonNull MenuItem item) {
switch (item.getItemId()) {
case R.id.navigation_home:
viewpager.setCurrentItem(0);
return true;
case R.id.navigation_dashboard:
viewpager.setCurrentItem(1);
return true;
case R.id.navigation_notifications:
viewpager.setCurrentItem(2);
return true;
}
return false;
}
};
private ViewPager.OnPageChangeListener mOnPageChangeListener = new ViewPager.OnPageChangeListener() {
@Override
public void onPageScrolled(int i, float v, int i1) {
Menu item = navigation.getMenu();
if (item.getItem(i) != null){
item.getItem(i).setChecked(false);
}else{
item.getItem(0).setChecked(false);
}
item.getItem(i).setChecked(true);
}
@Override
public void onPageSelected(int i) {
}
@Override
public void onPageScrollStateChanged(int i) {
}
};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//添加Fragment
fragmentList.add(DemoFragment.newInstance("Home"));
fragmentList.add(DemoFragment.newInstance("Dashboard"));
fragmentList.add(DemoFragment.newInstance("Notifications"));
ViewPagerAdapter adapter = new ViewPagerAdapter(getSupportFragmentManager());
ViewPager viewPager = (ViewPager) findViewById(R.id.viewpager);
navigation = (BottomNavigationView) findViewById(R.id.navigation);
//ViewPager设置adpater
viewPager.setAdapter(adapter);
//BottomNavigationView添加OnPageChangeListener事件
navigation.setOnNavigationItemSelectedListener(mOnNavigationItemSelectedListener);
//ViewPager添加OnPageChangeListener事件
viewPager.addOnPageChangeListener(mOnPageChangeListener);
}
//ViewPager adapter
class ViewPagerAdapter extends FragmentPagerAdapter{
public ViewPagerAdapter(FragmentManager fm) {
super(fm);
}
@Override
public Fragment getItem(int i) {
return fragmentList.get(i);
}
@Override
public int getCount() {
return fragmentList.size();
}
}
}
DemoFragment.java 完整代码
public class DemoFragment extends Fragment {
public static DemoFragment newInstance(String info){
Bundle bundle = new Bundle();
bundle.putString("title",info);
DemoFragment fragment = new DemoFragment();
fragment.setArguments(bundle);
return fragment;
}
@Nullable
@Override
public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
View v = inflater.inflate(R.layout.fragment,container,false);
TextView tv = (TextView)v.findViewById(R.id.tv);
tv.setText(getArguments().getString("title"));
return v;
}
}
ps:由于过于简单所以就不留下源码文件下载地址了。。。。