一. 什么是ViewPager
1.初识ViewPager
*记忆中一直停留在和你相遇的那一刻,只因你回眸一笑,我却停止了思考!*
1.1 ViewPager的继承结构
public class ViewPager extends ViewGroup
java.lang.Object
->android.view.View
->android.view.ViewGroup
->android.suppot.v4.view.ViewPager
1.2 ViewPager控件的特性
ViewPager是android.support.v4包中的控件类.ViewPager是一个默认支持手势的水平滑动,实现对多个View的切换显示,并自带平移动画效果的控件.你可以通过一个适配器(PagerAdapter)来管理要显示的页面.
ViewPager主要用来左右滑动.它要用适配器来连接ViewPager控件和Pages.类似ListView和Adapter
2.下面通过一个案例来说明ViewPager的使用
2.1 首先是创建主界面的xml,里面放一个ViewPager控件.因为ViewPager是android.support.v4包中的控件,所以写的时候跟普通的控件有所不同.
activity_main.xml 如下:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<android.support.v4.view.ViewPager
android:id="@+id/vp_pages"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</RelativeLayout>
2.2 在layout目录下创建4个xml文件,用来显示4张图片,作为ViewPager的视图来源.
page01.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" >
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="fitXY"
android:contentDescription="@null"
android:src="@drawable/a001"
/>
</LinearLayout>
page02.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" >
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="fitXY"
android:contentDescription="@null"
android:src="@drawable/a002"
/>
</LinearLayout>
page03.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" >
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="fitXY"
android:contentDescription="@null"
android:src="@drawable/a003"
/>
</LinearLayout>
page04.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" >
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="fitXY"
android:contentDescription="@null"
android:src="@drawable/a004"
/>
</LinearLayout>
2.3 下面是Acitivity里面配置ViewPager,使其完成活动显示功能.
编写过程
//1.初始化控件
vpPages = (ViewPager) findViewById();//2.准备数据 – 要显示的pages
pages = new ArrayList();
pages.add();
…..//3.创建adapter
adapter = new InnerPagerAdapter();//4.为ViewPager配置Adapter,以显示内容
vpPages.setAdapter(adapter);
其中我们用成员内部类的方式创建InnerPagerAdapter,它必须继承自PagerAdapter,并实现PagerAdapter的4个抽象方法.
关于PagerAdapter:
PagerAdapter是用于”将多个页面填充到ViewPager”的适配器的基类,PagerAdapter比AdapterView的使用更加普通.ViewPager使用回调函数来表示一个更新的步骤,而不是使用一个视图回收机制。在需要的时候pageradapter也可以实现视图的回收或者使用一种更为巧妙的方法来管理视图,比如采用可以管理自身视图的fragment。
viewpager不直接处理每一个视图而是将各个视图与一个键联系起来。这个键用来跟踪且唯一代表一个页面,不仅如此,该键还独立于这个页面所在adapter的位置。当pageradapter将要改变的时候他会调用startUpdate函数,接下来会调用一次或多次的instantiateItem或者destroyItem。最后在更新的后期会调用finishUpdate。当finishUpdate返回时 instantiateItem返回的对象应该添加到父ViewGroup destroyItem返回的对象应该被ViewGroup删除。methodisViewFromObject(View, Object)代表了当前的页面是否与给定的键相关联。
对于非常简单的pageradapter或许你可以选择用page本身作为键,在创建并且添加到viewgroup后instantiateItem方法里返回该page本身即可
destroyItem将会将该page从viewgroup里面移除。isViewFromObject方法里面直接可以返回view == object。
pageradapter支持数据集合的改变,数据集合的改变必须要在主线程里面执行,然后还要调用notifyDataSetChanged方法。和baseadapter非常相似。数据集合的改变包括页面的添加删除和修改位置。viewpager要维持当前页面是活动的,所以你必须提供getItemPosition方法。
代码实现:
package com.example.my20_viewpager;
import java.util.ArrayList;
import java.util.List;
import android.app.Activity;
import android.os.Bundle;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
public class MainActivity extends Activity
{
/**
* ViewPager 控件
*/
private ViewPager vpPages;
/**
* PagerAdapter ViewPager的适配器
*/
private PagerAdapter adapter;
/**
* 在ViewPager中要显示的View对象集合
*/
List<View> pages ;
/**
* 将xml文档解析成view对象的工具
*/
@Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
LayoutInflater inflater = getLayoutInflater();
//1.初始化控件
vpPages = (ViewPager) findViewById(R.id.vp_pages);
//2.准备数据源 --> 要显示的view对象
pages = new ArrayList<View>();
pages.add(inflater.inflate(R.layout.page01, null));
pages.add(inflater.inflate(R.layout.page02, null));
pages.add(inflater.inflate(R.layout.page03, null));
pages.add(inflater.inflate(R.layout.page04, null));
//3.创建adapter
adapter = new InnerAdapter();
//4.为ViewPager配置适配器,以显示内容
vpPages.setAdapter(adapter);
}
private class InnerAdapter extends PagerAdapter
{
/**
* 这个函数的功能是创建指定位置的页面视图.适配器有责任将即将创建的View视图到这里给定的container中,
* 这是为了确保在finishUpdate(viewGroup)返回时这里已经完成.
* return: 返回一个代表新增视图页面的Object(key),而一般简单的PagerAdapter我们就返回视图本身.
* 在finishUpdate(ViewGroup)执行完后,有两个操作,一个是原视图的移除(不再显示的视图),另一个是新视图的
* 增加(即将显示的视图)
*
* 对于非常简单的pageradapter或许你可以选择用page本身作为键,在创建并且添加到viewgroup后instantiateItem方法里返回该page本身即可
* destroyItem将会将该page从viewgroup里面移除。isViewFromObject方法里面直接可以返回view == object。
*/
@Override
public Object instantiateItem(ViewGroup container, int position)
{
//根据第二个参数position确定需要显示的view对象
View view = pages.get(position);
//将需要显示的view增加到容器container中.
container.addView(view);
//返回将要显示的view对象
return view;
}
/**
* 这个方法的功能是从container容器中移除一个指定位置的视图.在finishUpdate(viewGroup)返回时视图要确保被移除.
*/
@Override
public void destroyItem(ViewGroup container, int position, Object object)
{
container.removeView(pages.get(position));
}
/**
* 返回当前有效视图的个数,也即是pages集合中元素的个数
*/
@Override
public int getCount()
{
return pages.size();
}
/**
* 这个方法用来判断instantiateItem(ViewGroup,int)函数所返回来的key与一个页面视图是否代表同一个视图
* (即他俩是否是对应的,对应的表示同一个View)
*
* Determines whether a page View is associated with a specific key object as returned by instantiateItem(ViewGroup, int)
*/
@Override
public boolean isViewFromObject(View view, Object object)
{
return view == object;
}
}
}