ViewPager的功能与使用

ViewPager用于实现多页面的切换效果，该类存在于Google的兼容包里面，所以在引用时记得在BuilldPath中加入“android-support-v4.jar”.

新效果有如下特征：

[1] 当前显示一组界面中的其中一个界面。

[2] 当用户通过左右滑动界面时，当前的屏幕显示当前界面和下一个界面的一部分。

[3]滑动结束后，界面自动跳转到当前选择的界面中

使用贴上源码如下：

XML：

<?xml version="1.0" encoding="utf-8"?><FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="fill_parent"    android:layout_height="fill_parent"    android:orientation="vertical" >      <android.support.v4.view.ViewPager        android:id="@+id/whatsnew_viewpager"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_gravity="center" >                         <android.support.v4.view.PagerTitleStrip            android:id="@+id/pagertitle"            android:layout_width="wrap_content"            android:layout_height="0dp"            android:layout_gravity="bottom"            android:background="#0000"            android:textColor="#ffff" />    </android.support.v4.view.ViewPager>          <LinearLayout        android:layout_width="match_parent"        android:layout_height="match_parent"        android:orientation="horizontal"        >                  <LinearLayout            android:layout_width="fill_parent"            android:layout_height="wrap_content"            android:layout_gravity="bottom"        android:layout_marginBottom="30dp"         android:gravity="center_horizontal"     >                        <ImageView            android:id="@+id/page0"        android:layout_width="wrap_content"        android:layout_height="wrap_content"                     android:scaleType="matrix"        android:src="@drawable/page_now" />            <ImageView            android:id="@+id/page1"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_marginLeft="10dp"                     android:scaleType="matrix"        android:src="@drawable/page" />            <ImageView            android:id="@+id/page2"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_marginLeft="10dp"                        android:scaleType="matrix"        android:src="@drawable/page" />            <ImageView            android:id="@+id/page3"        android:layout_width="wrap_content"        android:layout_height="wrap_content"         android:layout_marginLeft="10dp"                       android:scaleType="matrix"        android:src="@drawable/page" />            <ImageView            android:id="@+id/page4"        android:layout_width="wrap_content"        android:layout_height="wrap_content"         android:layout_marginLeft="10dp"                       android:scaleType="matrix"        android:src="@drawable/page" />            <ImageView            android:id="@+id/page5"        android:layout_width="wrap_content"        android:layout_height="wrap_content"         android:layout_marginLeft="10dp"                       android:scaleType="matrix"        android:src="@drawable/page" />                               </LinearLayout>                   </LinearLayout>       </FrameLayout>

代码：

package com.example.viewpaper_demo;import java.util.ArrayList;import android.os.Bundle;import android.app.Activity;import android.content.Intent;import android.support.v4.view.PagerAdapter;import android.support.v4.view.ViewPager;import android.support.v4.view.ViewPager.OnPageChangeListener;import android.util.Log;import android.view.LayoutInflater;import android.view.Menu;import android.view.View;import android.widget.ImageView;public class MainActivity extends Activity implements OnPageChangeListener {private ViewPager mViewPager;private ImageView mPage0;private ImageView mPage1;private ImageView mPage2;private ImageView mPage3;private ImageView mPage4;private ImageView mPage5;private int currIndex = 0;    @Override    public void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        mViewPager=(ViewPager)this.findViewById(R.id.whatsnew_viewpager);        mViewPager.setOnPageChangeListener(this);                mPage0 = (ImageView)findViewById(R.id.page0);        mPage1 = (ImageView)findViewById(R.id.page1);        mPage2 = (ImageView)findViewById(R.id.page2);        mPage3 = (ImageView)findViewById(R.id.page3);        mPage4 = (ImageView)findViewById(R.id.page4);        mPage5 = (ImageView)findViewById(R.id.page5);                LayoutInflater  mLi=LayoutInflater.from(this);        View view1 = mLi.inflate(R.layout.whats1, null);        View view2 = mLi.inflate(R.layout.whats2, null);        View view3 = mLi.inflate(R.layout.whats3, null);        View view4 = mLi.inflate(R.layout.whats4, null);        View view5 = mLi.inflate(R.layout.whats5, null);        View view6 = mLi.inflate(R.layout.whats6, null);      //每个页面的view数据        final ArrayList<View> views = new ArrayList<View>();        views.add(view1);        views.add(view2);        views.add(view3);        views.add(view4);        views.add(view5);        views.add(view6);                PagerAdapter mPagerAdapter=new PagerAdapter(){@Overridepublic int getCount() {// TODO Auto-generated method stubreturn views.size();}@Overridepublic boolean isViewFromObject(View arg0, Object arg1) {// TODO Auto-generated method stubreturn arg0==arg1;}@Overridepublic void destroyItem(View container, int position, Object object) {// TODO Auto-generated method stub((ViewPager)container).removeView(views.get(position));}@Overridepublic Object instantiateItem(View container, int position) {// TODO Auto-generated method stub((ViewPager)container).addView(views.get(position));return views.get(position);}                };        mViewPager.setAdapter(mPagerAdapter);            }    @Override    public boolean onCreateOptionsMenu(Menu menu) {        getMenuInflater().inflate(R.menu.activity_main, menu);        return true;    }public void onPageScrollStateChanged(int arg0) {// TODO Auto-generated method stub}public void onPageScrolled(int arg0, float arg1, int arg2) {// TODO Auto-generated method stub}public void onPageSelected(int arg0) {//实现亮点随着界面变换而变换// TODO Auto-generated method stubswitch (arg0) {case 0:mPage0.setImageDrawable(getResources().getDrawable(R.drawable.page_now));mPage1.setImageDrawable(getResources().getDrawable(R.drawable.page));break;case 1:mPage1.setImageDrawable(getResources().getDrawable(R.drawable.page_now));mPage0.setImageDrawable(getResources().getDrawable(R.drawable.page));mPage2.setImageDrawable(getResources().getDrawable(R.drawable.page));break;case 2:mPage2.setImageDrawable(getResources().getDrawable(R.drawable.page_now));mPage1.setImageDrawable(getResources().getDrawable(R.drawable.page));mPage3.setImageDrawable(getResources().getDrawable(R.drawable.page));break;case 3:mPage3.setImageDrawable(getResources().getDrawable(R.drawable.page_now));mPage4.setImageDrawable(getResources().getDrawable(R.drawable.page));mPage2.setImageDrawable(getResources().getDrawable(R.drawable.page));break;case 4:mPage4.setImageDrawable(getResources().getDrawable(R.drawable.page_now));mPage3.setImageDrawable(getResources().getDrawable(R.drawable.page));mPage5.setImageDrawable(getResources().getDrawable(R.drawable.page));break;case 5:mPage5.setImageDrawable(getResources().getDrawable(R.drawable.page_now));mPage4.setImageDrawable(getResources().getDrawable(R.drawable.page));break;}currIndex = arg0;} public void start(View v) {        Log.d("Infor", "dao l ");this.finish();      }  }

PS:在ViewPager的第六个界面有个按钮，对其监听使用的方法是在该界面布局的XML文件中对于该Button使用android:onClick="start"来进行定义监听处理的方法。注意使用该方法定义的函数必须有形参（View v），否则便会报错提示。

效果图：

想要实现无限循环界面切换，只要针对PagerAdapter进行处理一下即可：

PagerAdapter mPagerAdapter=new PagerAdapter(){@Overridepublic int getCount() {// TODO Auto-generated method stub//return views.size();    return Integer.MAX_VALUE;}@Overridepublic boolean isViewFromObject(View arg0, Object arg1) {// TODO Auto-generated method stubreturn arg0==arg1;}@Overridepublic void destroyItem(View container, int position, Object object) {// TODO Auto-generated method stub((ViewPager)container).removeView(views.get(position%views.size()));}@Overridepublic Object instantiateItem(View container, int position) {// TODO Auto-generated method stub((ViewPager)container).addView(views.get(position%views.size()));return views.get(position%views.size());}                };        mViewPager.setAdapter(mPagerAdapter);