前言
ViewPager(视图滑动切换工具)是安卓3.0引入的一个页面容器组件,用于手势滑动切换页面,常常用于页面导航或者图片轮播。在安卓开发时将其与Android 碎片(fragment)相配合可以快速搭建出类似微信的滑动视图效果。
实现
1.创建fragment
通过android student 创建多个fragment,并为其初始化对应页面。这里需要注意的一点是本实例中的所有fragment对象一定要统一引用相同包下的fragment类,否则运行中会造成多种fragment类型冲突的异常。
2.创建Activity为其注册ViewPager组件并在底部添加3个按钮
public class Menu extends AppCompatActivity implements View.OnClickListener {
private ViewPager viewPager;
//用于存放创建的fragment
private List<Fragment> fragmentList = new ArrayList<>();
//在底部的三个按钮,使用TextView实现(方便添加图标)
private TextView index;
private TextView function;
private TextView myself;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_menu);
initView();
}
private void initView() {
viewPager = (ViewPager) findViewById(R.id.viewpager);
//将创建的fragment放入集合
fragmentList.add(new Index());
fragmentList.add(new Function());
fragmentList.add(new Myself());
//自定义的FragmentPagerAdapter适配器,传入刚刚创建的fragment集合
MyFragmentPagerAdapter adapter = new MyFragmentPagerAdapter(getSupportFragmentManager(), fragmentList);
//为ViewPager设置适配器
viewPager.setAdapter(adapter);
//初始化TextView组件
index = (TextView) findViewById(R.id.index);
index.setOnClickListener(this);
function = (TextView) findViewById(R.id.function);
function.setOnClickListener(this);
myself = (TextView) findViewById(R.id.myself);
myself.setOnClickListener(this);
}
@Override
public void onClick(View v) {
switch (v.getId()){
case R.id.index:
//ViewPager的页面切换方法,0为第一个界面(也就是第一个fragment)
viewPager.setCurrentItem(0);
break;
case R.id.function:
viewPager.setCurrentItem(1);
break;
case R.id.myself:
viewPager.setCurrentItem(2);
break;
}
}
Activity界面的xml文件 activity_menu
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".activity.Menu">
<androidx.viewpager.widget.ViewPager
android:id="@+id/viewpager"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="8"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:orientation="horizontal"
android:gravity="center"
android:background="#ccc"
android:padding="5dp"
android:layout_weight="1">
<TextView
android:id="@+id/index"
android:drawableTop="@drawable/index"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:textSize="18sp"
android:gravity="center"
android:text="@string/index"></TextView>
<TextView
android:id="@+id/function"
android:drawableTop="@drawable/function"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:textSize="18sp"
android:gravity="center"
android:text="@string/function"></TextView>
<TextView
android:id="@+id/myself"
android:drawableTop="@drawable/myself"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:textSize="18sp"
android:gravity="center"
android:text="@string/myself"></TextView>
</LinearLayout>
</LinearLayout>
3.为ViewPager创建FragmentPagerAdapter适配器
创建MyFragmentPagerAdapter类作为ViewPager的适配器并让其继承FragmentPagerAdapter类
public class MyFragmentPagerAdapter extends FragmentPagerAdapter {
private List<Fragment> list;
public MyFragmentPagerAdapter(FragmentManager fm,List<Fragment> list) {
super(fm);
this.list = list;
}
@Override
public Fragment getItem(int position) {
return list.get(position);
}
@Override
public int getCount() {
return list.size();
}
}
4.模拟器运行
可以实现ViewPager的滑动切换页面效果并且还可以通过下方的按钮进行页面的切换,每个ViewPager页面对应的就是集合中的fragment对象,这样我们就完成了类似微信页面的效果。