Android ViewPager使用详解

这是谷歌官方给我们提供的一个兼容低版本安卓设备的软件包,里面包囊了只有在安卓3.0以上可以使用的api。而viewpager就是其中之一利用它,我们可以做很多事情,从最简单的导航,到页面菜单等等。那如何使用它呢,与LisstView类似,我们也需要一个适配器,他就是PagerAdapter。看一下api的图片,


ViewPager的功能就是可以使视图滑动,就像Lanucher左右滑动那样。分三个步骤来使用它:

  1.在住布局文件里加入

  1. <android.support.v4.view.ViewPager    这个组件,注意这个组件是用来显示左右滑动的界面的,如果不加载xml布局文件,他是不会显示内容的。 
  2.         android:id="@+id/viewpager" 
  3.         android:layout_width="wrap_content" 
  4.         android:layout_height="wrap_content" 
  5.         android:layout_gravity="center" > 
<android.support.v4.view.ViewPager    这个组件,注意这个组件是用来显示左右滑动的界面的,如果不加载xml布局文件,他是不会显示内容的。
        android:id="@+id/viewpager"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center" >
2.加载要显示的页卡,

  1. LayoutInflater lf = getLayoutInflater().from(this); 
  2.         view1 = lf.inflate(R.layout.layout1, null); 
  3.         view2 = lf.inflate(R.layout.layout2, null); 
  4.         view3 = lf.inflate(R.layout.layout3, null); 
  5.  
  6.         viewList = new ArrayList<View>();// 将要分页显示的View装入数组中 
  7.         viewList.add(view1); 
  8.         viewList.add(view2); 
  9.         viewList.add(view3); 
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);

3.在Activity里实例化ViewPager组件,并设置它的Adapter(就是PagerAdapter,方法与ListView一样的),在这里一般需要重写PagerAdapter。

  1. PagerAdapter pagerAdapter = new PagerAdapter() { 
  2.  
  3.             @Override 
  4.             public boolean isViewFromObject(View arg0, Object arg1) { 
  5.  
  6.                 return arg0 == arg1; 
  7.             } 
  8.  
  9.             @Override 
  10.             public int getCount() { 
  11.  
  12.                 return viewList.size(); 
  13.             } 
  14.  
  15.             @Override 
  16.             public void destroyItem(ViewGroup container, int position, 
  17.                     Object object) { 
  18.                 container.removeView(viewList.get(position)); 
  19.  
  20.             } 
  21.  
  22.             @Override 
  23.             public int getItemPosition(Object object) { 
  24.  
  25.                 return super.getItemPosition(object); 
  26.             } 
  27.  
  28.             @Override 
  29.             public CharSequence getPageTitle(int position) { 
  30.  
  31.                 return titleList.get(position); 
  32.             } 
  33.  
  34.             @Override 
  35.             public Object instantiateItem(ViewGroup container, int position) { 
  36.                 container.addView(viewList.get(position)); 
  37.                 weibo_button=(Button) findViewById(R.id.button1); 
  38.                 weibo_button.setOnClickListener(new OnClickListener() { 
  39.                      
  40.                     public void onClick(View v) { 
  41.                         intent=new Intent(ViewPagerDemo.this,WeiBoActivity.class); 
  42.                         startActivity(intent); 
  43.                     } 
  44.                 }); 
  45.                 return viewList.get(position); 
  46.             } 
  47.  
  48.         }; 
  49.         viewPager.setAdapter(pagerAdapter); 
PagerAdapter pagerAdapter = new PagerAdapter() {

			@Override
			public boolean isViewFromObject(View arg0, Object arg1) {

				return arg0 == arg1;
			}

			@Override
			public int getCount() {

				return viewList.size();
			}

			@Override
			public void destroyItem(ViewGroup container, int position,
					Object object) {
				container.removeView(viewList.get(position));

			}

			@Override
			public int getItemPosition(Object object) {

				return super.getItemPosition(object);
			}

			@Override
			public CharSequence getPageTitle(int position) {

				return titleList.get(position);
			}

			@Override
			public Object instantiateItem(ViewGroup container, int position) {
				container.addView(viewList.get(position));
				weibo_button=(Button) findViewById(R.id.button1);
				weibo_button.setOnClickListener(new OnClickListener() {
					
					public void onClick(View v) {
						intent=new Intent(ViewPagerDemo.this,WeiBoActivity.class);
						startActivity(intent);
					}
				});
				return viewList.get(position);
			}

		};
		viewPager.setAdapter(pagerAdapter);
  这是重写PagerAdapter的一个方法,我们还可以这样做:

  1. public class MyViewPagerAdapter extends PagerAdapter{ 
  2.         private List<View> mListViews; 
  3.          
  4.         public MyViewPagerAdapter(List<View> mListViews) { 
  5.             this.mListViews = mListViews;//构造方法,参数是我们的页卡,这样比较方便。 
  6.         } 
  7.  
  8.         @Override 
  9.         public void destroyItem(ViewGroup container, int position, Object object)   {    
  10.             container.removeView(mListViews.get(position));//删除页卡 
  11.         } 
  12.  
  13.  
  14.         @Override 
  15.         public Object instantiateItem(ViewGroup container, int position) {  //这个方法用来实例化页卡        
  16.              container.addView(mListViews.get(position), 0);//添加页卡 
  17.              return mListViews.get(position); 
  18.         } 
  19.  
  20.         @Override 
  21.         public int getCount() {          
  22.             return  mListViews.size();//返回页卡的数量 
  23.         } 
  24.          
  25.         @Override 
  26.         public boolean isViewFromObject(View arg0, Object arg1) {            
  27.             return arg0==arg1;//官方提示这样写 
  28.         } 
  29.     } 
public class MyViewPagerAdapter extends PagerAdapter{
		private List<View> mListViews;
		
		public MyViewPagerAdapter(List<View> mListViews) {
			this.mListViews = mListViews;//构造方法,参数是我们的页卡,这样比较方便。
		}

		@Override
		public void destroyItem(ViewGroup container, int position, Object object) 	{	
			container.removeView(mListViews.get(position));//删除页卡
		}


		@Override
		public Object instantiateItem(ViewGroup container, int position) {	//这个方法用来实例化页卡		
			 container.addView(mListViews.get(position), 0);//添加页卡
			 return mListViews.get(position);
		}

		@Override
		public int getCount() {			
			return  mListViews.size();//返回页卡的数量
		}
		
		@Override
		public boolean isViewFromObject(View arg0, Object arg1) {			
			return arg0==arg1;//官方提示这样写
		}
	}

  大同小异,有一定很重要,就是我们需要重写哪些方法。从上面的图片可以看到,ViewPager的适配器是PagerAdapter,它是基类提供适配器来填充页面ViewPager内部,你很可能想要使用一个更具体的实现,如FragmentPagerAdapter或FragmentStatePagerAdapter。在这里需要说明一下,其实ViewPager应该和Fragment一起使用,至少谷歌官方是这么想的,但是在3.0之下,我们没有必要这么做。下面要注意,当你实现一个PagerAdapter,你必须至少覆盖以下方法:

  从上面的例子中可以看到,我们最少也是实现了上面四个方法,当然如果你想让程序更健壮或是功能更全面,你可以重写其他的方法。下面看一下第一个完整的示例代码:
  主页面Activity:
  1. package com.example.viewpagerdemo; 
  2.  
  3. import java.util.ArrayList; 
  4. import java.util.List; 
  5. import android.os.Bundle; 
  6. import android.app.Activity; 
  7. import android.content.Context; 
  8. import android.content.Intent; 
  9. import android.support.v4.view.PagerAdapter; 
  10. import android.support.v4.view.PagerTabStrip; 
  11. import android.support.v4.view.PagerTitleStrip; 
  12. import android.support.v4.view.ViewPager; 
  13. import android.util.AttributeSet; 
  14. import android.view.LayoutInflater; 
  15. import android.view.Menu; 
  16. import android.view.View; 
  17. import android.view.View.OnClickListener; 
  18. import android.view.ViewGroup; 
  19. import android.widget.Button; 
  20.  
  21. public class ViewPagerDemo extends Activity { 
  22.  
  23.     private View view1, view2, view3;//需要滑动的页卡 
  24.     private ViewPager viewPager;//viewpager 
  25.     private PagerTitleStrip pagerTitleStrip;//viewpager的标题 
  26.     private PagerTabStrip pagerTabStrip;//一个viewpager的指示器,效果就是一个横的粗的下划线 
  27.     private List<View> viewList;//把需要滑动的页卡添加到这个list中 
  28.     private List<String> titleList;//viewpager的标题 
  29.     private Button weibo_button;//button对象,一会用来进入第二个Viewpager的示例 
  30.    private Intent intent; 
  31.     @Override 
  32.     public void onCreate(Bundle savedInstanceState) { 
  33.         super.onCreate(savedInstanceState); 
  34.         setContentView(R.layout.activity_view_pager_demo); 
  35.         initView(); 
  36.     } 
  37.       /*在这里需要说明一下,在上面的图片中我们看到了,PagerTabStrip,PagerTitleStrip,他们其实是viewpager的一个指示器,前者效果就是一个横的粗的下划线,后者用来显示各个页卡的标题,当然而这也可以共存。在使用他们的时候需要注意,看下面的布局文件,要在android.support.v4.view.ViewPager里面添加
  38. android.support.v4.view.PagerTabStrip以及android.support.v4.view.PagerTitleStrip。
  39.     private void initView() {
  40.         viewPager = (ViewPager) findViewById(R.id.viewpager);
  41.         //pagerTitleStrip = (PagerTitleStrip) findViewById(R.id.pagertitle);
  42.         pagerTabStrip=(PagerTabStrip) findViewById(R.id.pagertab);
  43.         pagerTabStrip.setTabIndicatorColor(getResources().getColor(R.color.gold));
  44.         pagerTabStrip.setDrawFullUnderline(false);
  45.         pagerTabStrip.setBackgroundColor(getResources().getColor(R.color.azure));
  46.         pagerTabStrip.setTextSpacing(50);
  47.         /*
  48.         weibo_button=(Button) findViewById(R.id.button1);
  49.         weibo_button.setOnClickListener(new OnClickListener() {
  50.            
  51.             public void onClick(View v) {
  52.                 intent=new Intent(ViewPagerDemo.this,WeiBoActivity.class);
  53.                 startActivity(intent);
  54.             }
  55.         });
  56.         */ 
  57.          
  58.         view1 = findViewById(R.layout.layout1); 
  59.         view2 = findViewById(R.layout.layout2); 
  60.         view3 = findViewById(R.layout.layout3); 
  61.  
  62.         LayoutInflater lf = getLayoutInflater().from(this); 
  63.         view1 = lf.inflate(R.layout.layout1, null); 
  64.         view2 = lf.inflate(R.layout.layout2, null); 
  65.         view3 = lf.inflate(R.layout.layout3, null); 
  66.  
  67.         viewList = new ArrayList<View>();// 将要分页显示的View装入数组中 
  68.         viewList.add(view1); 
  69.         viewList.add(view2); 
  70.         viewList.add(view3); 
  71.  
  72.         titleList = new ArrayList<String>();// 每个页面的Title数据 
  73.         titleList.add("wp"); 
  74.         titleList.add("jy"); 
  75.         titleList.add("jh"); 
  76.  
  77.         PagerAdapter pagerAdapter = new PagerAdapter() { 
  78.  
  79.             @Override 
  80.             public boolean isViewFromObject(View arg0, Object arg1) { 
  81.  
  82.                 return arg0 == arg1; 
  83.             } 
  84.  
  85.             @Override 
  86.             public int getCount() { 
  87.  
  88.                 return viewList.size(); 
  89.             } 
  90.  
  91.             @Override 
  92.             public void destroyItem(ViewGroup container, int position, 
  93.                     Object object) { 
  94.                 container.removeView(viewList.get(position)); 
  95.  
  96.             } 
  97.  
  98.             @Override 
  99.             public int getItemPosition(Object object) { 
  100.  
  101.                 return super.getItemPosition(object); 
  102.             } 
  103.  
  104.             @Override 
  105.             public CharSequence getPageTitle(int position) { 
  106.  
  107.                 return titleList.get(position);//直接用适配器来完成标题的显示,所以从上面可以看到,我们没有使用PagerTitleStrip。当然你可以使用。 
  108.  
  109.             } 
  110.  
  111.             @Override 
  112.             public Object instantiateItem(ViewGroup container, int position) { 
  113.                 container.addView(viewList.get(position)); 
  114.                 weibo_button=(Button) findViewById(R.id.button1);//这个需要注意,我们是在重写adapter里面实例化button组件的,如果你在onCreate()方法里这样做会报错的。 
  115.                 weibo_button.setOnClickListener(new OnClickListener() { 
  116.                      
  117.                     public void onClick(View v) { 
  118.                         intent=new Intent(ViewPagerDemo.this,WeiBoActivity.class); 
  119.                         startActivity(intent); 
  120.                     } 
  121.                 }); 
  122.                 return viewList.get(position); 
  123.             } 
  124.  
  125.         }; 
  126.         viewPager.setAdapter(pagerAdapter); 
  127.     } 
  128.  
  129.     @Override 
  130.     public boolean onCreateOptionsMenu(Menu menu) { 
  131.         getMenuInflater().inflate(R.menu.activity_view_pager_demo, menu); 
  132.         return true
  133.     } 
  134.  
package com.example.viewpagerdemo;

import java.util.ArrayList;
import java.util.List;
import android.os.Bundle;
import android.app.Activity;
import android.content.Context;
import android.content.Intent;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.PagerTabStrip;
import android.support.v4.view.PagerTitleStrip;
import android.support.v4.view.ViewPager;
import android.util.AttributeSet;
import android.view.LayoutInflater;
import android.view.Menu;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewGroup;
import android.widget.Button;

public class ViewPagerDemo extends Activity {

	private View view1, view2, view3;//需要滑动的页卡
	private ViewPager viewPager;//viewpager
	private PagerTitleStrip pagerTitleStrip;//viewpager的标题
	private PagerTabStrip pagerTabStrip;//一个viewpager的指示器,效果就是一个横的粗的下划线
	private List<View> viewList;//把需要滑动的页卡添加到这个list中
	private List<String> titleList;//viewpager的标题
	private Button weibo_button;//button对象,一会用来进入第二个Viewpager的示例
   private Intent intent;
	@Override
	public void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_view_pager_demo);
		initView();
	}
      /*在这里需要说明一下,在上面的图片中我们看到了,PagerTabStrip,PagerTitleStrip,他们其实是viewpager的一个指示器,前者效果就是一个横的粗的下划线,后者用来显示各个页卡的标题,当然而这也可以共存。在使用他们的时候需要注意,看下面的布局文件,要在android.support.v4.view.ViewPager里面添加
android.support.v4.view.PagerTabStrip以及android.support.v4.view.PagerTitleStrip。

	private void initView() {
		viewPager = (ViewPager) findViewById(R.id.viewpager);
		//pagerTitleStrip = (PagerTitleStrip) findViewById(R.id.pagertitle);
		pagerTabStrip=(PagerTabStrip) findViewById(R.id.pagertab);
		pagerTabStrip.setTabIndicatorColor(getResources().getColor(R.color.gold)); 
		pagerTabStrip.setDrawFullUnderline(false);
		pagerTabStrip.setBackgroundColor(getResources().getColor(R.color.azure));
		pagerTabStrip.setTextSpacing(50);
		/*
		weibo_button=(Button) findViewById(R.id.button1);
		weibo_button.setOnClickListener(new OnClickListener() {
			
			public void onClick(View v) {
				intent=new Intent(ViewPagerDemo.this,WeiBoActivity.class);
				startActivity(intent);
			}
		});
		*/
		
		view1 = findViewById(R.layout.layout1);
		view2 = findViewById(R.layout.layout2);
		view3 = findViewById(R.layout.layout3);

		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);

		titleList = new ArrayList<String>();// 每个页面的Title数据
		titleList.add("wp");
		titleList.add("jy");
		titleList.add("jh");

		PagerAdapter pagerAdapter = new PagerAdapter() {

			@Override
			public boolean isViewFromObject(View arg0, Object arg1) {

				return arg0 == arg1;
			}

			@Override
			public int getCount() {

				return viewList.size();
			}

			@Override
			public void destroyItem(ViewGroup container, int position,
					Object object) {
				container.removeView(viewList.get(position));

			}

			@Override
			public int getItemPosition(Object object) {

				return super.getItemPosition(object);
			}

			@Override
			public CharSequence getPageTitle(int position) {

				return titleList.get(position);//直接用适配器来完成标题的显示,所以从上面可以看到,我们没有使用PagerTitleStrip。当然你可以使用。

			}

			@Override
			public Object instantiateItem(ViewGroup container, int position) {
				container.addView(viewList.get(position));
				weibo_button=(Button) findViewById(R.id.button1);//这个需要注意,我们是在重写adapter里面实例化button组件的,如果你在onCreate()方法里这样做会报错的。
				weibo_button.setOnClickListener(new OnClickListener() {
					
					public void onClick(View v) {
						intent=new Intent(ViewPagerDemo.this,WeiBoActivity.class);
						startActivity(intent);
					}
				});
				return viewList.get(position);
			}

		};
		viewPager.setAdapter(pagerAdapter);
	}

	@Override
	public boolean onCreateOptionsMenu(Menu menu) {
		getMenuInflater().inflate(R.menu.activity_view_pager_demo, menu);
		return true;
	}

}
  它的布局文件:
  1. <?xml version="1.0" encoding="utf-8"?> 
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
  3.     android:layout_width="fill_parent" 
  4.     android:layout_height="fill_parent" 
  5.     android:orientation="vertical"
  6.  
  7.     <android.support.v4.view.ViewPager 
  8.         android:id="@+id/viewpager" 
  9.         android:layout_width="wrap_content" 
  10.         android:layout_height="wrap_content" 
  11.         android:layout_gravity="center"
  12.                
  13.         <android.support.v4.view.PagerTabStrip   
  14.             android:id="@+id/pagertab"   
  15.             android:layout_width="wrap_content"   
  16.             android:layout_height="wrap_content"   
  17.             android:layout_gravity="top"/>   
  18.           
  19.     </android.support.v4.view.ViewPager> 
  20.  
  21. </LinearLayout> 
  22. <!--注意事项:    
  23.     1.这里ViewPager和 PagerTabStrip都要把包名写全了,不然会ClassNotFount   
  24.     2.API中说:在布局xml把PagerTabStrip当做ViewPager的一个子标签来用,不能拿出来,不然还是会报错   
  25.     3.在PagerTabStrip标签中可以用属性android:layout_gravity=TOP|BOTTOM来指定title的位置   
  26.     4.如果要显示出PagerTabStrip某一页的title,需要在ViewPager的adapter中实现getPageTitle(int)-->  
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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/viewpager"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center" >
              
        <android.support.v4.view.PagerTabStrip  
            android:id="@+id/pagertab"  
            android:layout_width="wrap_content"  
            android:layout_height="wrap_content"  
            android:layout_gravity="top"/>  
         
    </android.support.v4.view.ViewPager>

</LinearLayout>
<!--注意事项:   
    1.这里ViewPager和 PagerTabStrip都要把包名写全了,不然会ClassNotFount  
    2.API中说:在布局xml把PagerTabStrip当做ViewPager的一个子标签来用,不能拿出来,不然还是会报错  
    3.在PagerTabStrip标签中可以用属性android:layout_gravity=TOP|BOTTOM来指定title的位置  
    4.如果要显示出PagerTabStrip某一页的title,需要在ViewPager的adapter中实现getPageTitle(int)--> 
这样就完成了一个简单的ViewPager的使用示例,看一下效果图:

可以左右滑动页卡,但是仔细看一下,标题的效果不好,不能一次显示一个,而且标题还滑动。其实在api里面提供了一个 pagerTabStrip.setTextSpacing()来设置标题的距离,但是我在这里设置了,没有效果不知道为什么,明白的朋友希望能够赐教一下。
  所以就有人使用下面这样的方法来仿微博的效果,
  这个标题就固定了,而且可以左右滑动,也有下面的横线,来指示页卡。方法和上面的差不多,区别在于这个横线需要我们自己来做,其实就是一个图片。这个例子是网上的一篇文章,看代码:
主Activity:
  1. package com.example.viewpagerdemo; 
  2.  
  3. import java.util.ArrayList; 
  4. import java.util.List; 
  5. import android.app.Activity; 
  6. import android.graphics.BitmapFactory; 
  7. import android.graphics.Matrix; 
  8. import android.os.Bundle; 
  9. import android.support.v4.view.PagerAdapter; 
  10. import android.support.v4.view.ViewPager; 
  11. import android.support.v4.view.ViewPager.OnPageChangeListener; 
  12. import android.util.DisplayMetrics; 
  13. import android.view.LayoutInflater; 
  14. import android.view.View; 
  15. import android.view.View.OnClickListener; 
  16. import android.view.animation.Animation; 
  17. import android.view.animation.TranslateAnimation; 
  18. import android.view.ViewGroup; 
  19. import android.widget.ImageView; 
  20. import android.widget.TextView; 
  21. import android.widget.Toast; 
  22.  
  23. public class WeiBoActivity extends Activity { 
  24.  
  25.     private ViewPager viewPager;//页卡内容 
  26.     private ImageView imageView;// 动画图片 
  27.     private TextView textView1,textView2,textView3; 
  28.     private List<View> views;// Tab页面列表 
  29.     private int offset = 0;// 动画图片偏移量 
  30.     private int currIndex = 0;// 当前页卡编号 
  31.     private int bmpW;// 动画图片宽度 
  32.     private View view1,view2,view3;//各个页卡 
  33.     @Override 
  34.     protected void onCreate(Bundle savedInstanceState) { 
  35.         super.onCreate(savedInstanceState); 
  36.         setContentView(R.layout.weibo); 
  37.         InitImageView(); 
  38.         InitTextView(); 
  39.         InitViewPager(); 
  40.     } 
  41.  
  42.     private void InitViewPager() { 
  43.         viewPager=(ViewPager) findViewById(R.id.vPager); 
  44.         views=new ArrayList<View>(); 
  45.         LayoutInflater inflater=getLayoutInflater(); 
  46.         view1=inflater.inflate(R.layout.lay1, null); 
  47.         view2=inflater.inflate(R.layout.lay2, null); 
  48.         view3=inflater.inflate(R.layout.lay3, null); 
  49.         views.add(view1); 
  50.         views.add(view2); 
  51.         views.add(view3); 
  52.         viewPager.setAdapter(new MyViewPagerAdapter(views)); 
  53.         viewPager.setCurrentItem(0); 
  54.         viewPager.setOnPageChangeListener(new MyOnPageChangeListener()); 
  55.     } 
  56.      /**
  57.       *  初始化头标
  58.       */ 
  59.  
  60.     private void InitTextView() { 
  61.         textView1 = (TextView) findViewById(R.id.text1); 
  62.         textView2 = (TextView) findViewById(R.id.text2); 
  63.         textView3 = (TextView) findViewById(R.id.text3); 
  64.  
  65.         textView1.setOnClickListener(new MyOnClickListener(0)); 
  66.         textView2.setOnClickListener(new MyOnClickListener(1)); 
  67.         textView3.setOnClickListener(new MyOnClickListener(2)); 
  68.     } 
  69.  
  70.     /**
  71.      2      * 初始化动画,这个就是页卡滑动时,下面的横线也滑动的效果,在这里需要计算一些数据
  72.      3 */ 
  73.  
  74.     private void InitImageView() { 
  75.         imageView= (ImageView) findViewById(R.id.cursor); 
  76.         bmpW = BitmapFactory.decodeResource(getResources(), R.drawable.a).getWidth();// 获取图片宽度 
  77.         DisplayMetrics dm = new DisplayMetrics(); 
  78.         getWindowManager().getDefaultDisplay().getMetrics(dm); 
  79.         int screenW = dm.widthPixels;// 获取分辨率宽度 
  80.         offset = (screenW / 3 - bmpW) / 2;// 计算偏移量 
  81.         Matrix matrix = new Matrix(); 
  82.         matrix.postTranslate(offset, 0); 
  83.         imageView.setImageMatrix(matrix);// 设置动画初始位置 
  84.     } 
  85. <img alt="" src="https://img-my.csdn.net/uploads/201211/10/1352554452_1685.jpg"
  86.     /**
  87.      *    
  88.      * 头标点击监听 3 */ 
  89.     private class MyOnClickListener implements OnClickListener{ 
  90.         private int index=0
  91.         public MyOnClickListener(int i){ 
  92.             index=i; 
  93.         } 
  94.         public void onClick(View v) { 
  95.             viewPager.setCurrentItem(index);             
  96.         } 
  97.          
  98.     } 
  99.      
  100.     public class MyViewPagerAdapter extends PagerAdapter{ 
  101.         private List<View> mListViews; 
  102.          
  103.         public MyViewPagerAdapter(List<View> mListViews) { 
  104.             this.mListViews = mListViews; 
  105.         } 
  106.  
  107.         @Override 
  108.         public void destroyItem(ViewGroup container, int position, Object object)   {    
  109.             container.removeView(mListViews.get(position)); 
  110.         } 
  111.  
  112.  
  113.         @Override 
  114.         public Object instantiateItem(ViewGroup container, int position) {           
  115.              container.addView(mListViews.get(position), 0); 
  116.              return mListViews.get(position); 
  117.         } 
  118.  
  119.         @Override 
  120.         public int getCount() {          
  121.             return  mListViews.size(); 
  122.         } 
  123.          
  124.         @Override 
  125.         public boolean isViewFromObject(View arg0, Object arg1) {            
  126.             return arg0==arg1; 
  127.         } 
  128.     } 
  129.  
  130.     public class MyOnPageChangeListener implements OnPageChangeListener{ 
  131.  
  132.         int one = offset * 2 + bmpW;// 页卡1 -> 页卡2 偏移量 
  133.         int two = one * 2;// 页卡1 -> 页卡3 偏移量 
  134.         public void onPageScrollStateChanged(int arg0) { 
  135.              
  136.              
  137.         } 
  138.  
  139.         public void onPageScrolled(int arg0, float arg1, int arg2) { 
  140.              
  141.              
  142.         } 
  143.  
  144.         public void onPageSelected(int arg0) { 
  145.             /*两种方法,这个是一种,下面还有一种,显然这个比较麻烦
  146.             Animation animation = null;
  147.             switch (arg0) {
  148.             case 0:
  149.                 if (currIndex == 1) {
  150.                     animation = new TranslateAnimation(one, 0, 0, 0);
  151.                 } else if (currIndex == 2) {
  152.                     animation = new TranslateAnimation(two, 0, 0, 0);
  153.                 }
  154.                 break;
  155.             case 1:
  156.                 if (currIndex == 0) {
  157.                     animation = new TranslateAnimation(offset, one, 0, 0);
  158.                 } else if (currIndex == 2) {
  159.                     animation = new TranslateAnimation(two, one, 0, 0);
  160.                 }
  161.                 break;
  162.             case 2:
  163.                 if (currIndex == 0) {
  164.                     animation = new TranslateAnimation(offset, two, 0, 0);
  165.                 } else if (currIndex == 1) {
  166.                     animation = new TranslateAnimation(one, two, 0, 0);
  167.                 }
  168.                 break;
  169.                
  170.             }
  171.             */ 
  172.             Animation animation = new TranslateAnimation(one*currIndex, one*arg0, 0, 0);//显然这个比较简洁,只有一行代码。 
  173.             currIndex = arg0; 
  174.             animation.setFillAfter(true);// True:图片停在动画结束位置 
  175.             animation.setDuration(300); 
  176.             imageView.startAnimation(animation); 
  177.             Toast.makeText(WeiBoActivity.this, "您选择了"+ viewPager.getCurrentItem()+"页卡", Toast.LENGTH_SHORT).show(); 
  178.         } 
  179.          
  180.     } 
package com.example.viewpagerdemo;

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.View;
import android.view.View.OnClickListener;
import android.view.animation.Animation;
import android.view.animation.TranslateAnimation;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.TextView;
import android.widget.Toast;

public class WeiBoActivity extends Activity {

	private ViewPager viewPager;//页卡内容
	private ImageView imageView;// 动画图片
	private TextView textView1,textView2,textView3;
	private List<View> views;// Tab页面列表
	private int offset = 0;// 动画图片偏移量
	private int currIndex = 0;// 当前页卡编号
	private int bmpW;// 动画图片宽度
	private View view1,view2,view3;//各个页卡
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.weibo);
		InitImageView();
		InitTextView();
		InitViewPager();
	}

	private void InitViewPager() {
		viewPager=(ViewPager) findViewById(R.id.vPager);
		views=new ArrayList<View>();
		LayoutInflater inflater=getLayoutInflater();
		view1=inflater.inflate(R.layout.lay1, null);
		view2=inflater.inflate(R.layout.lay2, null);
		view3=inflater.inflate(R.layout.lay3, null);
		views.add(view1);
		views.add(view2);
		views.add(view3);
		viewPager.setAdapter(new MyViewPagerAdapter(views));
		viewPager.setCurrentItem(0);
		viewPager.setOnPageChangeListener(new MyOnPageChangeListener());
	}
	 /**
	  *  初始化头标
	  */

	private void InitTextView() {
		textView1 = (TextView) findViewById(R.id.text1);
		textView2 = (TextView) findViewById(R.id.text2);
		textView3 = (TextView) findViewById(R.id.text3);

		textView1.setOnClickListener(new MyOnClickListener(0));
		textView2.setOnClickListener(new MyOnClickListener(1));
		textView3.setOnClickListener(new MyOnClickListener(2));
	}

	/**
	 2      * 初始化动画,这个就是页卡滑动时,下面的横线也滑动的效果,在这里需要计算一些数据
	 3 */

	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);// 设置动画初始位置
	}
<img alt="" src="https://img-my.csdn.net/uploads/201211/10/1352554452_1685.jpg" />
	/** 
	 *     
	 * 头标点击监听 3 */
	private class MyOnClickListener implements OnClickListener{
        private int index=0;
        public MyOnClickListener(int i){
        	index=i;
        }
		public void onClick(View v) {
			viewPager.setCurrentItem(index);			
		}
		
	}
	
	public class MyViewPagerAdapter extends PagerAdapter{
		private List<View> mListViews;
		
		public MyViewPagerAdapter(List<View> mListViews) {
			this.mListViews = mListViews;
		}

		@Override
		public void destroyItem(ViewGroup container, int position, Object object) 	{	
			container.removeView(mListViews.get(position));
		}


		@Override
		public Object instantiateItem(ViewGroup container, int position) {			
			 container.addView(mListViews.get(position), 0);
			 return mListViews.get(position);
		}

		@Override
		public int getCount() {			
			return  mListViews.size();
		}
		
		@Override
		public boolean isViewFromObject(View arg0, Object arg1) {			
			return arg0==arg1;
		}
	}

    public class MyOnPageChangeListener implements OnPageChangeListener{

    	int one = offset * 2 + bmpW;// 页卡1 -> 页卡2 偏移量
		int two = one * 2;// 页卡1 -> 页卡3 偏移量
		public void onPageScrollStateChanged(int arg0) {
			
			
		}

		public void onPageScrolled(int arg0, float arg1, int arg2) {
			
			
		}

		public void onPageSelected(int arg0) {
			/*两种方法,这个是一种,下面还有一种,显然这个比较麻烦
			Animation animation = null;
			switch (arg0) {
			case 0:
				if (currIndex == 1) {
					animation = new TranslateAnimation(one, 0, 0, 0);
				} else if (currIndex == 2) {
					animation = new TranslateAnimation(two, 0, 0, 0);
				}
				break;
			case 1:
				if (currIndex == 0) {
					animation = new TranslateAnimation(offset, one, 0, 0);
				} else if (currIndex == 2) {
					animation = new TranslateAnimation(two, one, 0, 0);
				}
				break;
			case 2:
				if (currIndex == 0) {
					animation = new TranslateAnimation(offset, two, 0, 0);
				} else if (currIndex == 1) {
					animation = new TranslateAnimation(one, two, 0, 0);
				}
				break;
				
			}
			*/
			Animation animation = new TranslateAnimation(one*currIndex, one*arg0, 0, 0);//显然这个比较简洁,只有一行代码。
			currIndex = arg0;
			animation.setFillAfter(true);// True:图片停在动画结束位置
			animation.setDuration(300);
			imageView.startAnimation(animation);
			Toast.makeText(WeiBoActivity.this, "您选择了"+ viewPager.getCurrentItem()+"页卡", Toast.LENGTH_SHORT).show();
		}
    	
    }
}
它的布局文件:
  1. <?xml version="1.0" encoding="utf-8"?> 
  2. lt;LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
  3.    android:layout_width="fill_parent" 
  4.    android:layout_height="fill_parent" 
  5.    android:orientation="vertical"
  6.  
  7.    <LinearLayout 
  8.        android:id="@+id/linearLayout1" 
  9.        android:layout_width="fill_parent" 
  10.        android:layout_height="40.0dip" 
  11.        android:background="#FFFFFF"
  12.  
  13.        <TextView 
  14.            android:id="@+id/text1" 
  15.            android:layout_width="fill_parent" 
  16.            android:layout_height="fill_parent" 
  17.            android:layout_weight="1.0" 
  18.            android:gravity="center" 
  19.            android:text=" @我" 
  20.            android:textColor="#000000" 
  21.            android:textSize="20.0dip" /> 
  22.  
  23.        <TextView 
  24.            android:id="@+id/text2" 
  25.            android:layout_width="fill_parent" 
  26.            android:layout_height="fill_parent" 
  27.            android:layout_weight="1.0" 
  28.            android:gravity="center" 
  29.            android:text="评论" 
  30.            android:textColor="#000000" 
  31.            android:textSize="20.0dip" /> 
  32.  
  33.        <TextView 
  34.            android:id="@+id/text3" 
  35.            android:layout_width="fill_parent" 
  36.            android:layout_height="fill_parent" 
  37.            android:layout_weight="1.0" 
  38.            android:gravity="center" 
  39.            android:text="私信" 
  40.            android:textColor="#000000" 
  41.            android:textSize="20.0dip" /> 
  42.    </LinearLayout> 
  43.  
  44.    <ImageView 
  45.        android:id="@+id/cursor" 
  46.        android:layout_width="fill_parent" 
  47.        android:layout_height="wrap_content" 
  48.        android:scaleType="matrix" 
  49.        android:src="@drawable/a" /> 
  50.  
  51.    <android.support.v4.view.ViewPager 
  52.        android:id="@+id/vPager" 
  53.        android:layout_width="wrap_content" 
  54.        android:layout_height="0dp" 
  55.        android:layout_gravity="center" 
  56.        android:layout_weight="1.0" 
  57.        android:background="#000000" 
  58.        android:flipInterval="30" 
  59.        android:persistentDrawingCache="animation" /> 
  60. lt;/LinearLayout> 
 <?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <LinearLayout
        android:id="@+id/linearLayout1"
        android:layout_width="fill_parent"
        android:layout_height="40.0dip"
        android:background="#FFFFFF" >

        <TextView
            android:id="@+id/text1"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="1.0"
            android:gravity="center"
            android:text=" @我"
            android:textColor="#000000"
            android:textSize="20.0dip" />

        <TextView
            android:id="@+id/text2"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="1.0"
            android:gravity="center"
            android:text="评论"
            android:textColor="#000000"
            android:textSize="20.0dip" />

        <TextView
            android:id="@+id/text3"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="1.0"
            android:gravity="center"
            android:text="私信"
            android:textColor="#000000"
            android:textSize="20.0dip" />
    </LinearLayout>

    <ImageView
        android:id="@+id/cursor"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:scaleType="matrix"
        android:src="@drawable/a" />

    <android.support.v4.view.ViewPager
        android:id="@+id/vPager"
        android:layout_width="wrap_content"
        android:layout_height="0dp"
        android:layout_gravity="center"
        android:layout_weight="1.0"
        android:background="#000000"
        android:flipInterval="30"
        android:persistentDrawingCache="animation" />
</LinearLayout>
  效果如下:



下面使用ViewPager来实现一个程序引导的demo:
一般来说,引导界面是出现第一次运行时出现的,之后不会再出现。所以需要记录是否是第一次使用程序,办法有很多,最容易想到的就是使用SharedPreferences来保存。步骤如下:
  1、程序进入欢迎界面,SplashActivity,在这里读取SharedPreferences里面的变量,先设置为true。进入引导界面,然后设置为false。
  2、之后每次进入欢迎界面读取SharedPreferences里面的变量,因为是false,所以不会运行引导界面了。
代码如下:
SplashActivity.java,欢迎界面。
  1. import android.app.Activity; 
  2. import android.content.Intent; 
  3. import android.content.SharedPreferences; 
  4. import android.os.Bundle; 
  5. import android.os.Handler; 
  6. import android.os.Message; 
  7.  
  8. /**
  9. */ 
  10. public class SplashActivity extends Activity { 
  11.     boolean isFirstIn = false
  12.  
  13.     private static final int GO_HOME = 1000
  14.     private static final int GO_GUIDE = 1001
  15.     // 延迟3秒 
  16.     private static final long SPLASH_DELAY_MILLIS = 3000
  17.  
  18.     private static final String SHAREDPREFERENCES_NAME = "first_pref"
  19.  
  20.     /**
  21.      * Handler:跳转到不同界面
  22.      */ 
  23.     private Handler mHandler = new Handler() { 
  24.  
  25.         @Override 
  26.         public void handleMessage(Message msg) { 
  27.             switch (msg.what) { 
  28.             case GO_HOME: 
  29.                 goHome(); 
  30.                 break
  31.             case GO_GUIDE: 
  32.                 goGuide(); 
  33.                 break
  34.             } 
  35.             super.handleMessage(msg); 
  36.         } 
  37.     }; 
  38.  
  39.     @Override 
  40.     protected void onCreate(Bundle savedInstanceState) { 
  41.         super.onCreate(savedInstanceState); 
  42.         setContentView(R.layout.splash); 
  43.  
  44.         init(); 
  45.     } 
  46.  
  47.     private void init() { 
  48.         // 读取SharedPreferences中需要的数据 
  49.         // 使用SharedPreferences来记录程序的使用次数 
  50.         SharedPreferences preferences = getSharedPreferences( 
  51.                 SHAREDPREFERENCES_NAME, MODE_PRIVATE); 
  52.  
  53.         // 取得相应的值,如果没有该值,说明还未写入,用true作为默认值 
  54.         isFirstIn = preferences.getBoolean("isFirstIn", true); 
  55.  
  56.         // 判断程序与第几次运行,如果是第一次运行则跳转到引导界面,否则跳转到主界面 
  57.         if (!isFirstIn) { 
  58.             // 使用Handler的postDelayed方法,3秒后执行跳转到MainActivity 
  59.             mHandler.sendEmptyMessageDelayed(GO_HOME, SPLASH_DELAY_MILLIS); 
  60.         } else
  61.             mHandler.sendEmptyMessageDelayed(GO_GUIDE, SPLASH_DELAY_MILLIS); 
  62.         } 
  63.  
  64.     } 
  65.  
  66.     private void goHome() { 
  67.         Intent intent = new Intent(SplashActivity.this, MainActivity.class); 
  68.         SplashActivity.this.startActivity(intent); 
  69.         SplashActivity.this.finish(); 
  70.     } 
  71.  
  72.     private void goGuide() { 
  73.         Intent intent = new Intent(SplashActivity.this, GuideActivity.class); 
  74.         SplashActivity.this.startActivity(intent); 
  75.         SplashActivity.this.finish(); 
  76.     } 
import android.app.Activity;
import android.content.Intent;
import android.content.SharedPreferences;
import android.os.Bundle;
import android.os.Handler;
import android.os.Message;

/**

 */
public class SplashActivity extends Activity {
	boolean isFirstIn = false;

	private static final int GO_HOME = 1000;
	private static final int GO_GUIDE = 1001;
	// 延迟3秒
	private static final long SPLASH_DELAY_MILLIS = 3000;

	private static final String SHAREDPREFERENCES_NAME = "first_pref";

	/**
	 * Handler:跳转到不同界面
	 */
	private Handler mHandler = new Handler() {

		@Override
		public void handleMessage(Message msg) {
			switch (msg.what) {
			case GO_HOME:
				goHome();
				break;
			case GO_GUIDE:
				goGuide();
				break;
			}
			super.handleMessage(msg);
		}
	};

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.splash);

		init();
	}

	private void init() {
		// 读取SharedPreferences中需要的数据
		// 使用SharedPreferences来记录程序的使用次数
		SharedPreferences preferences = getSharedPreferences(
				SHAREDPREFERENCES_NAME, MODE_PRIVATE);

		// 取得相应的值,如果没有该值,说明还未写入,用true作为默认值
		isFirstIn = preferences.getBoolean("isFirstIn", true);

		// 判断程序与第几次运行,如果是第一次运行则跳转到引导界面,否则跳转到主界面
		if (!isFirstIn) {
			// 使用Handler的postDelayed方法,3秒后执行跳转到MainActivity
			mHandler.sendEmptyMessageDelayed(GO_HOME, SPLASH_DELAY_MILLIS);
		} else {
			mHandler.sendEmptyMessageDelayed(GO_GUIDE, SPLASH_DELAY_MILLIS);
		}

	}

	private void goHome() {
		Intent intent = new Intent(SplashActivity.this, MainActivity.class);
		SplashActivity.this.startActivity(intent);
		SplashActivity.this.finish();
	}

	private void goGuide() {
		Intent intent = new Intent(SplashActivity.this, GuideActivity.class);
		SplashActivity.this.startActivity(intent);
		SplashActivity.this.finish();
	}
}
GuideActivity.java引导界面:
  1. import java.util.ArrayList; 
  2. import java.util.List; 
  3. import android.app.Activity; 
  4. import android.os.Bundle; 
  5. import android.support.v4.view.ViewPager; 
  6. import android.support.v4.view.ViewPager.OnPageChangeListener; 
  7. import android.view.LayoutInflater; 
  8. import android.view.View; 
  9. import android.widget.ImageView; 
  10. import android.widget.LinearLayout; 
  11. import cn.eoe.leigo.splash.adapter.ViewPagerAdapter; 
  12.  
  13. /**
  14. *
  15. *
  16. */ 
  17. public class GuideActivity extends Activity implements OnPageChangeListener { 
  18.  
  19.     private ViewPager vp; 
  20.     private ViewPagerAdapter vpAdapter; 
  21.     private List<View> views; 
  22.  
  23.     // 底部小点图片 
  24.     private ImageView[] dots; 
  25.  
  26.     // 记录当前选中位置 
  27.     private int currentIndex; 
  28.  
  29.     @Override 
  30.     protected void onCreate(Bundle savedInstanceState) { 
  31.         super.onCreate(savedInstanceState); 
  32.         setContentView(R.layout.guide); 
  33.  
  34.         // 初始化页面 
  35.         initViews(); 
  36.  
  37.         // 初始化底部小点 
  38.         initDots(); 
  39.     } 
  40.  
  41.     private void initViews() { 
  42.         LayoutInflater inflater = LayoutInflater.from(this); 
  43.  
  44.         views = new ArrayList<View>(); 
  45.         // 初始化引导图片列表 
  46.         views.add(inflater.inflate(R.layout.what_new_one, null)); 
  47.         views.add(inflater.inflate(R.layout.what_new_two, null)); 
  48.         views.add(inflater.inflate(R.layout.what_new_three, null)); 
  49.         views.add(inflater.inflate(R.layout.what_new_four, null)); 
  50.  
  51.         // 初始化Adapter 
  52.         vpAdapter = new ViewPagerAdapter(views, this); 
  53.          
  54.         vp = (ViewPager) findViewById(R.id.viewpager); 
  55.         vp.setAdapter(vpAdapter); 
  56.         // 绑定回调 
  57.         vp.setOnPageChangeListener(this); 
  58.     } 
  59.  
  60.     private void initDots() { 
  61.         LinearLayout ll = (LinearLayout) findViewById(R.id.ll); 
  62.  
  63.         dots = new ImageView[views.size()]; 
  64.  
  65.         // 循环取得小点图片 
  66.         for (int i = 0; i < views.size(); i++) { 
  67.             dots[i] = (ImageView) ll.getChildAt(i); 
  68.             dots[i].setEnabled(true);// 都设为灰色 
  69.         } 
  70.  
  71.         currentIndex = 0
  72.         dots[currentIndex].setEnabled(false);// 设置为白色,即选中状态 
  73.     } 
  74.  
  75.     private void setCurrentDot(int position) { 
  76.         if (position < 0 || position > views.size() - 1 
  77.                 || currentIndex == position) { 
  78.             return
  79.         } 
  80.  
  81.         dots[position].setEnabled(false); 
  82.         dots[currentIndex].setEnabled(true); 
  83.  
  84.         currentIndex = position; 
  85.     } 
  86.  
  87.     // 当滑动状态改变时调用 
  88.     @Override 
  89.     public void onPageScrollStateChanged(int arg0) { 
  90.     } 
  91.  
  92.     // 当当前页面被滑动时调用 
  93.     @Override 
  94.     public void onPageScrolled(int arg0, float arg1, int arg2) { 
  95.     } 
  96.  
  97.     // 当新的页面被选中时调用 
  98.     @Override 
  99.     public void onPageSelected(int arg0) { 
  100.         // 设置底部小点选中状态 
  101.         setCurrentDot(arg0); 
  102.     } 
  103.  
import java.util.ArrayList;
import java.util.List;
import android.app.Activity;
import android.os.Bundle;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.ImageView;
import android.widget.LinearLayout;
import cn.eoe.leigo.splash.adapter.ViewPagerAdapter;

/**
 * 

 * 
 */
public class GuideActivity extends Activity implements OnPageChangeListener {

	private ViewPager vp;
	private ViewPagerAdapter vpAdapter;
	private List<View> views;

	// 底部小点图片
	private ImageView[] dots;

	// 记录当前选中位置
	private int currentIndex;

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.guide);

		// 初始化页面
		initViews();

		// 初始化底部小点
		initDots();
	}

	private void initViews() {
		LayoutInflater inflater = LayoutInflater.from(this);

		views = new ArrayList<View>();
		// 初始化引导图片列表
		views.add(inflater.inflate(R.layout.what_new_one, null));
		views.add(inflater.inflate(R.layout.what_new_two, null));
		views.add(inflater.inflate(R.layout.what_new_three, null));
		views.add(inflater.inflate(R.layout.what_new_four, null));

		// 初始化Adapter
		vpAdapter = new ViewPagerAdapter(views, this);
		
		vp = (ViewPager) findViewById(R.id.viewpager);
		vp.setAdapter(vpAdapter);
		// 绑定回调
		vp.setOnPageChangeListener(this);
	}

	private void initDots() {
		LinearLayout ll = (LinearLayout) findViewById(R.id.ll);

		dots = new ImageView[views.size()];

		// 循环取得小点图片
		for (int i = 0; i < views.size(); i++) {
			dots[i] = (ImageView) ll.getChildAt(i);
			dots[i].setEnabled(true);// 都设为灰色
		}

		currentIndex = 0;
		dots[currentIndex].setEnabled(false);// 设置为白色,即选中状态
	}

	private void setCurrentDot(int position) {
		if (position < 0 || position > views.size() - 1
				|| currentIndex == position) {
			return;
		}

		dots[position].setEnabled(false);
		dots[currentIndex].setEnabled(true);

		currentIndex = position;
	}

	// 当滑动状态改变时调用
	@Override
	public void onPageScrollStateChanged(int arg0) {
	}

	// 当当前页面被滑动时调用
	@Override
	public void onPageScrolled(int arg0, float arg1, int arg2) {
	}

	// 当新的页面被选中时调用
	@Override
	public void onPageSelected(int arg0) {
		// 设置底部小点选中状态
		setCurrentDot(arg0);
	}

}
ViewPagerAdapter.java。ViewPager的适配器:
  1. import java.util.List; 
  2. import android.app.Activity; 
  3. import android.content.Context; 
  4. import android.content.Intent; 
  5. import android.content.SharedPreferences; 
  6. import android.content.SharedPreferences.Editor; 
  7. import android.os.Parcelable; 
  8. import android.support.v4.view.PagerAdapter; 
  9. import android.support.v4.view.ViewPager; 
  10. import android.view.View; 
  11. import android.view.View.OnClickListener; 
  12. import android.widget.ImageView; 
  13. import cn.eoe.leigo.splash.MainActivity; 
  14. import cn.eoe.leigo.splash.R; 
  15.  
  16. /**
  17. */ 
  18. public class ViewPagerAdapter extends PagerAdapter { 
  19.  
  20.     // 界面列表 
  21.     private List<View> views; 
  22.     private Activity activity; 
  23.     private static final String SHAREDPREFERENCES_NAME = "first_pref"
  24.     public ViewPagerAdapter(List<View> views, Activity activity) { 
  25.         this.views = views; 
  26.         this.activity = activity; 
  27.     } 
  28.  
  29.     // 销毁arg1位置的界面 
  30.     @Override 
  31.     public void destroyItem(View arg0, int arg1, Object arg2) { 
  32.         ((ViewPager) arg0).removeView(views.get(arg1)); 
  33.     } 
  34.  
  35.     @Override 
  36.     public void finishUpdate(View arg0) { 
  37.     } 
  38.  
  39.     // 获得当前界面数 
  40.     @Override 
  41.     public int getCount() { 
  42.         if (views != null) { 
  43.             return views.size(); 
  44.         } 
  45.         return 0
  46.     } 
  47.  
  48.     // 初始化arg1位置的界面 
  49.     @Override 
  50.     public Object instantiateItem(View arg0, int arg1) { 
  51.         ((ViewPager) arg0).addView(views.get(arg1), 0); 
  52.         if (arg1 == views.size() - 1) { 
  53.             ImageView mStartWeiboImageButton = (ImageView) arg0 
  54.                     .findViewById(R.id.iv_start_weibo); 
  55.             mStartWeiboImageButton.setOnClickListener(new OnClickListener() { 
  56.  
  57.                 @Override 
  58.                 public void onClick(View v) { 
  59.                     // 设置已经引导 
  60.                     setGuided(); 
  61.                     goHome(); 
  62.  
  63.                 } 
  64.  
  65.             }); 
  66.         } 
  67.         return views.get(arg1); 
  68.     } 
  69.  
  70.     private void goHome() { 
  71.         // 跳转 
  72.         Intent intent = new Intent(activity, MainActivity.class); 
  73.         activity.startActivity(intent); 
  74.         activity.finish(); 
  75.     } 
  76.     /**
  77.      *
  78.      * method desc:设置已经引导过了,下次启动不用再次引导
  79.      */ 
  80.     private void setGuided() { 
  81.         SharedPreferences preferences = activity.getSharedPreferences( 
  82.                 SHAREDPREFERENCES_NAME, Context.MODE_PRIVATE); 
  83.         Editor editor = preferences.edit(); 
  84.         // 存入数据 
  85.         editor.putBoolean("isFirstIn", false); 
  86.         // 提交修改 
  87.         editor.commit(); 
  88.     } 
  89.  
  90.     // 判断是否由对象生成界面 
  91.     @Override 
  92.     public boolean isViewFromObject(View arg0, Object arg1) { 
  93.         return (arg0 == arg1); 
  94.     } 
  95.  
  96.     @Override 
  97.     public void restoreState(Parcelable arg0, ClassLoader arg1) { 
  98.     } 
  99.  
  100.     @Override 
  101.     public Parcelable saveState() { 
  102.         return null
  103.     } 
  104.  
  105.     @Override 
  106.     public void startUpdate(View arg0) { 
  107.     } 
  108.  
import java.util.List;
import android.app.Activity;
import android.content.Context;
import android.content.Intent;
import android.content.SharedPreferences;
import android.content.SharedPreferences.Editor;
import android.os.Parcelable;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.ImageView;
import cn.eoe.leigo.splash.MainActivity;
import cn.eoe.leigo.splash.R;

/**
 */
public class ViewPagerAdapter extends PagerAdapter {

	// 界面列表
	private List<View> views;
	private Activity activity;
	private static final String SHAREDPREFERENCES_NAME = "first_pref";
	public ViewPagerAdapter(List<View> views, Activity activity) {
		this.views = views;
		this.activity = activity;
	}

	// 销毁arg1位置的界面
	@Override
	public void destroyItem(View arg0, int arg1, Object arg2) {
		((ViewPager) arg0).removeView(views.get(arg1));
	}

	@Override
	public void finishUpdate(View arg0) {
	}

	// 获得当前界面数
	@Override
	public int getCount() {
		if (views != null) {
			return views.size();
		}
		return 0;
	}

	// 初始化arg1位置的界面
	@Override
	public Object instantiateItem(View arg0, int arg1) {
		((ViewPager) arg0).addView(views.get(arg1), 0);
		if (arg1 == views.size() - 1) {
			ImageView mStartWeiboImageButton = (ImageView) arg0
					.findViewById(R.id.iv_start_weibo);
			mStartWeiboImageButton.setOnClickListener(new OnClickListener() {

				@Override
				public void onClick(View v) {
					// 设置已经引导
					setGuided();
					goHome();

				}

			});
		}
		return views.get(arg1);
	}

	private void goHome() {
		// 跳转
		Intent intent = new Intent(activity, MainActivity.class);
		activity.startActivity(intent);
		activity.finish();
	}
	/**
	 * 
	 * method desc:设置已经引导过了,下次启动不用再次引导
	 */
	private void setGuided() {
		SharedPreferences preferences = activity.getSharedPreferences(
				SHAREDPREFERENCES_NAME, Context.MODE_PRIVATE);
		Editor editor = preferences.edit();
		// 存入数据
		editor.putBoolean("isFirstIn", false);
		// 提交修改
		editor.commit();
	}

	// 判断是否由对象生成界面
	@Override
	public boolean isViewFromObject(View arg0, Object arg1) {
		return (arg0 == arg1);
	}

	@Override
	public void restoreState(Parcelable arg0, ClassLoader arg1) {
	}

	@Override
	public Parcelable saveState() {
		return null;
	}

	@Override
	public void startUpdate(View arg0) {
	}

}
至于MainActivity随便了。
效果如下:





所以总结一下,我们可以使用ViewPager做什么:
1.程序使用导航,外加底部圆点的效果,这个在微信示例里介绍了
2.页卡滑动,加上菜单的效果,不管是之前的支持手势也支持底部图标点击的微信,还是今天的微博。

 
代码下载连接
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值