Android ViewPager多页面滑动切换以及动画效果

ViewPager特点，暂列1.与ListView一样，初始化时需要传入适配器。2.多见于相片、图片切换，或进入应用时，介绍切换。使用步骤

1.在布局文件里加入（同样类似与ListView），不过为兼容版本，引入方式有差异

<android.support.v4.view.ViewPager
android:id="@+id/viewpage"
android:layout_width="match_parent"
android:layout_height="match_parent" />

2.加载要显示的选项卡，即封装显示的view数组

1）布局文件引用

LayoutInflater lf = getLayoutInflater().from(this);
view1 = lf.inflate(R.layout.layout1, null);
view2 = lf.inflate(R.layout.layout2, null);
view3 = lf.inflate(R.layout.layout3, null);

viewList = new ArrayList<View>();// 将要分页显示的View装入数组中
viewList.add(view1);
viewList.add(view2);
viewList.add(view3);

2）类文件引用

Intent intent = new Intent(context, A.class);

LocalActivityManager manager = new LocalActivityManager(this , true);

---该对象已被标记为过时

manager.startActivity(id, intent).getDecorView();

3.实例化ViewPager组件，并设置它的PagerAdapter

先看布局activity_main.xml

<LinearLayout 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:orientation="vertical" ><LinearLayoutandroid:layout_width="match_parent"android:layout_height="wrap_content" ><TextViewandroid:id="@+id/tab1"android:gravity="center"android:layout_weight="1"android:layout_width="wrap_content"android:layout_height="wrap_content"android:text="@string/tab1" /><TextViewandroid:id="@+id/tab2"android:gravity="center"android:layout_weight="1"android:layout_width="wrap_content"android:layout_height="wrap_content"android:text="@string/tab2" /><TextViewandroid:id="@+id/tab3"android:gravity="center"android:layout_weight="1"android:layout_width="wrap_content"android:layout_height="wrap_content"android:text="@string/tab3" /></LinearLayout><!-- 用matrix来绘制 --><ImageViewandroid:id="@+id/cursor"android:src="@drawable/a"android:scaleType="matrix"android:layout_width="wrap_content"android:layout_height="wrap_content"/><android.support.v4.view.ViewPagerandroid:id="@+id/viewpage"android:layout_width="match_parent"android:layout_height="wrap_content" /></LinearLayout>

然后是java代码，MainActivity

import java.util.ArrayList;import java.util.List;import android.app.Activity;import android.graphics.BitmapFactory;import android.graphics.Matrix;import android.os.Bundle;import android.support.v4.view.PagerAdapter;import android.support.v4.view.ViewPager;import android.support.v4.view.ViewPager.OnPageChangeListener;import android.util.DisplayMetrics;import android.view.LayoutInflater;import android.view.Menu;import android.view.MenuItem;import android.view.View;import android.view.View.OnClickListener;import android.view.ViewGroup;import android.view.animation.Animation;import android.view.animation.TranslateAnimation;import android.widget.ImageView;public class MainActivity extends Activity {private List<View> viewList;private List<String> titleList;private View view1,view2,view3;private ViewPager viewPager;private int offset = 0;// 动画图片偏移量private int currIndex = 0;// 当前页卡编号private int bmpW;// 动画图片宽度private ImageView imageView;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);view1 = findViewById(R.layout.tab1);view2 = findViewById(R.layout.tab2);view3 = findViewById(R.layout.tab3);//加载要显示的选项卡/** 通俗的说,inflate就相当于将一个xml中定义的布局找出来.　　		因为在一个Activity里如果直接用findViewById()的话,对应的是setConentView()的那个layout里的组件.　　		因此如果你的Activity里如果用到别的layout,比如对话框上的layout,你还要设置对话框上的layout里的组件(像图片ImageView,文字TextView)上的内容,你就必须用inflate()先将对话框上的layout找出来,然后再用这个layout对象去找到它上面的组件*/LayoutInflater lf = getLayoutInflater().from(this);view1 = lf.inflate(R.layout.tab1, null);view2 = lf.inflate(R.layout.tab2, null);view3 = lf.inflate(R.layout.tab3, null);viewList = new ArrayList<View>();// 将要分页显示的View装入数组中viewList.add(view1);viewList.add(view2);viewList.add(view3);titleList = new ArrayList<String>();// 每个页面的Title数据titleList.add("tab1");titleList.add("tab2");titleList.add("tab3");//为TextView注册监听事件findViewById(R.id.tab1).setOnClickListener(new MyOnClickListener(0));findViewById(R.id.tab2).setOnClickListener(new MyOnClickListener(1));findViewById(R.id.tab3).setOnClickListener(new MyOnClickListener(2));//初始化图片视图InitImageView();//获取ViewPager视图对象vie4000wPager = (ViewPager) findViewById(R.id.viewpage);PagerAdapter adapter = new PagerAdapter(){@Overridepublic int getCount() {return viewList.size();}@Overridepublic boolean isViewFromObject(View arg0, Object arg1) {return arg0 == arg1;}@Overridepublic void destroyItem(ViewGroup container, int position,Object object) {container.removeView(viewList.get(position));}@Overridepublic int getItemPosition(Object object) {return super.getItemPosition(object);}@Overridepublic CharSequence getPageTitle(int position) {//获取指定位置的标题名称return titleList.get(position);}@Overridepublic Object instantiateItem(ViewGroup container, int position) {//初始化container.addView(viewList.get(position));return viewList.get(position);}};viewPager.setAdapter(adapter);//为ViewPager注册切换触发事件viewPager.setOnPageChangeListener(new MyOnPageChangeListener());}private class MyOnClickListener implements OnClickListener {private int index = 0;public MyOnClickListener(int index){this.index = index;}@Overridepublic void onClick(View v) {//支持点击视图切换viewPager.setCurrentItem(index);}}private class MyOnPageChangeListener implements OnPageChangeListener{int one = offset * 2 + bmpW;// 页卡1 -> 页卡2 偏移量int two = one * 2;// 页卡1 -> 页卡3 偏移量@Overridepublic void onPageScrollStateChanged(int arg0) {// TODO Auto-generated method stub}@Overridepublic void onPageScrolled(int arg0, float arg1, int arg2) {// TODO Auto-generated method stub}@Overridepublic void onPageSelected(int arg0) {Animation animation = new TranslateAnimation(one*currIndex, one*arg0, 0, 0);//显然这个比较简洁，只有一行代码。currIndex = arg0;animation.setFillAfter(true);// True:图片停在动画结束位置animation.setDuration(300);//添加动画imageView.startAnimation(animation);}}private void InitImageView() {imageView= (ImageView) findViewById(R.id.cursor);bmpW = BitmapFactory.decodeResource(getResources(), R.drawable.a).getWidth();// 获取图片宽度DisplayMetrics dm = new DisplayMetrics();getWindowManager().getDefaultDisplay().getMetrics(dm);int screenW = dm.widthPixels;// 获取分辨率宽度offset = (screenW / 3 - bmpW) / 2;// 计算偏移量Matrix matrix = new Matrix();matrix.postTranslate(offset, 0);imageView.setImageMatrix(matrix);// 设置动画初始位置}}

运行后界面如图，样式较粗糙，重在切换效果部分代码源自网友，细节处理还需改进学习。