Android ViewPager初探:让页面滑动起来

下一篇:《Android ViewPager再探:增加滑动指示条》

ViewPager需要用到适配器PagerAAdapter,以下四个函数需要重写:

instantiateItem(ViewGroup container, int position):创建指定位置的页面视图。适配器增加即将创建的View视图到这里给定的container中。
destroyItem(ViewGroup container, int position, Object object):移除一个给定位置的页面。
getCount():返回当前有效视图的个数。
isViewFromObject(View view, Object object):判断instantiateItem(ViewGroup, int)函数所返回来的Key与一个页面视图是否是代表的同一个视图。

主界面的布局只要加上

<android.support.v4.view.ViewPager />

即可:

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"
tools:context=".MainActivity"> <android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"/> </RelativeLayout>

决定ViewPager有3个页面,每个页面都要写布局:

以第一个first_page.xml为例:

 <?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:text="这是第一页"
android:textSize="20sp"/> </RelativeLayout>

MainActivity需要在onCreate里对其初始化,并调用适配器:

 package com.example.hopecapital.myapplication;

 import android.app.Activity;
import android.os.Bundle;
import android.support.v4.view.ViewPager;
import android.view.LayoutInflater;
import android.view.View; import java.util.ArrayList;
import java.util.List; public class MainActivity extends Activity {
private View first,second,third;
private ViewPager viewPager;//对应 <android.support.v4.view.ViewPager/>控件
private List<View> viewList;//View数组 @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main); /*初始化*/
viewPager = (ViewPager)findViewById(R.id.viewpager);
LayoutInflater inflater = getLayoutInflater();
first = inflater.inflate(R.layout.first_page,null);
second = inflater.inflate(R.layout.second_page,null);
third = inflater.inflate(R.layout.third_page,null); viewList = new ArrayList<View>();// 将要分页显示的View装入数组中
viewList.add(first);
viewList.add(second);
viewList.add(third); /*适配器部分*/
NewPagerAdapter pagerAdapter = new NewPagerAdapter(viewList);
viewPager.setAdapter(pagerAdapter);
} }

最后也是最重要的,继承自PagerAdapter的适配器:

NewPagerAdapter.java:

 package com.example.hopecapital.myapplication;

 import android.support.v4.view.PagerAdapter;
import android.view.View;
import android.view.ViewGroup; import java.util.List; /**
* Created by LT on 2015/7/27.
*/
public class NewPagerAdapter extends PagerAdapter{
public List<View> viewList; public NewPagerAdapter(List<View> viewList){
this.viewList = viewList;
} /*下面四个函数是一定要重写的*/
@Override
public boolean isViewFromObject(View arg0,Object arg1){
//判断instantiateItem(ViewGroup, int)函数所返回来的Key与一个页面视图是否是代表的同一个视图(判断key)
// TODO Auto-generated method stub
return arg0 == arg1;
} @Override
public int getCount() {//返回要滑动的VIew的个数
// TODO Auto-generated method stub
return viewList.size();
} @Override
public void destroyItem(ViewGroup container, int position,
Object object) {//从当前container中删除指定位置(position)的View;
// TODO Auto-generated method stub
container.removeView(viewList.get(position));
} @Override
public Object instantiateItem(ViewGroup container, int position) {
//实例化:将当前视图添加到container中,并返回当前View(传送key)
// TODO Auto-generated method stub
container.addView(viewList.get(position)); return viewList.get(position);
}
}

以上,便完成了简单的ViewPager。

上一篇:ViewPager+Fragment实现页面的切换


下一篇:html .css 实现图片滑动和自动播放特效移动端 HTML 5中添加了以touch 开头的事件