• 【Android 界面效果21】Android ViewPager使用详解

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


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

      1.在住布局文件里加入

    [html] view plaincopy
     
    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" >  

     2.加载要显示的页卡，

     

     

    [java] view plaincopy
     
    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);  

     

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

     

    [java] view plaincopy
     
    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的一个方法，我们还可以这样做：

     

     

    [java] view plaincopy
     
    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.     }  

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

      从上面的例子中可以看到，我们最少也是实现了上面四个方法，当然如果你想让程序更健壮或是功能更全面，你可以重写其他的方法。下面看一下第一个完整的示例代码：
      主页面Activity：
    [java] view plaincopy
     
    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.  
    40.     private void initView() { 
    41.         viewPager = (ViewPager) findViewById(R.id.viewpager); 
    42.         //pagerTitleStrip = (PagerTitleStrip) findViewById(R.id.pagertitle); 
    43.         pagerTabStrip=(PagerTabStrip) findViewById(R.id.pagertab); 
    44.         pagerTabStrip.setTabIndicatorColor(getResources().getColor(R.color.gold));  
    45.         pagerTabStrip.setDrawFullUnderline(false); 
    46.         pagerTabStrip.setBackgroundColor(getResources().getColor(R.color.azure)); 
    47.         pagerTabStrip.setTextSpacing(50); 
    48.         /* 
    49.         weibo_button=(Button) findViewById(R.id.button1); 
    50.         weibo_button.setOnClickListener(new OnClickListener() { 
    51.              
    52.             public void onClick(View v) { 
    53.                 intent=new Intent(ViewPagerDemo.this,WeiBoActivity.class); 
    54.                 startActivity(intent); 
    55.             } 
    56.         }); 
    57.         */  
    58.           
    59.         view1 = findViewById(R.layout.layout1);  
    60.         view2 = findViewById(R.layout.layout2);  
    61.         view3 = findViewById(R.layout.layout3);  
    62.   
    63.         LayoutInflater lf = getLayoutInflater().from(this);  
    64.         view1 = lf.inflate(R.layout.layout1, null);  
    65.         view2 = lf.inflate(R.layout.layout2, null);  
    66.         view3 = lf.inflate(R.layout.layout3, null);  
    67.   
    68.         viewList = new ArrayList<View>();// 将要分页显示的View装入数组中  
    69.         viewList.add(view1);  
    70.         viewList.add(view2);  
    71.         viewList.add(view3);  
    72.   
    73.         titleList = new ArrayList<String>();// 每个页面的Title数据  
    74.         titleList.add("wp");  
    75.         titleList.add("jy");  
    76.         titleList.add("jh");  
    77.   
    78.         PagerAdapter pagerAdapter = new PagerAdapter() {  
    79.   
    80.             @Override  
    81.             public boolean isViewFromObject(View arg0, Object arg1) {  
    82.   
    83.                 return arg0 == arg1;  
    84.             }  
    85.   
    86.             @Override  
    87.             public int getCount() {  
    88.   
    89.                 return viewList.size();  
    90.             }  
    91.   
    92.             @Override  
    93.             public void destroyItem(ViewGroup container, int position,  
    94.                     Object object) {  
    95.                 container.removeView(viewList.get(position));  
    96.   
    97.             }  
    98.   
    99.             @Override  
    100.             public int getItemPosition(Object object) {  
    101.   
    102.                 return super.getItemPosition(object);  
    103.             }  
    104.   
    105.             @Override  
    106.             public CharSequence getPageTitle(int position) {  
    107.   
    108.                 return titleList.get(position);//直接用适配器来完成标题的显示，所以从上面可以看到，我们没有使用PagerTitleStrip。当然你可以使用。  
    109.   
    110.             }  
    111.   
    112.             @Override  
    113.             public Object instantiateItem(ViewGroup container, int position) {  
    114.                 container.addView(viewList.get(position));  
    115.                 weibo_button=(Button) findViewById(R.id.button1);//这个需要注意，我们是在重写adapter里面实例化button组件的，如果你在onCreate()方法里这样做会报错的。  
    116.                 weibo_button.setOnClickListener(new OnClickListener() {  
    117.                       
    118.                     public void onClick(View v) {  
    119.                         intent=new Intent(ViewPagerDemo.this,WeiBoActivity.class);  
    120.                         startActivity(intent);  
    121.                     }  
    122.                 });  
    123.                 return viewList.get(position);  
    124.             }  
    125.   
    126.         };  
    127.         viewPager.setAdapter(pagerAdapter);  
    128.     }  
    129.   
    130.     @Override  
    131.     public boolean onCreateOptionsMenu(Menu menu) {  
    132.         getMenuInflater().inflate(R.menu.activity_view_pager_demo, menu);  
    133.         return true;  
    134.     }  
    135.   
    136. }  
      它的布局文件：
     
    [java] view plaincopy
     
    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)-->   
     这样就完成了一个简单的ViewPager的使用示例，看一下效果图：

     可以左右滑动页卡，但是仔细看一下，标题的效果不好，不能一次显示一个，而且标题还滑动。其实在api里面提供了一个pagerTabStrip.setTextSpacing()来设置标题的距离，但是我在这里设置了，没有效果不知道为什么，明白的朋友希望能够赐教一下。
      所以就有人使用下面这样的方法来仿微博的效果，，
      这个标题就固定了，而且可以左右滑动，也有下面的横线，来指示页卡。方法和上面的差不多，区别在于这个横线需要我们自己来做，其实就是一个图片。这个例子是网上的一篇文章，看代码：
    主Activity：
    [java] view plaincopy
     
    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 src="https://img-my.csdn.net/uploads/201211/10/1352554452_1685.jpg" alt="">  
    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.     }  
    181. }  
    它的布局文件：
    [java] view plaincopy
     
    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>  
      效果如下：



     下面使用ViewPager来实现一个程序引导的demo：
     一般来说，引导界面是出现第一次运行时出现的，之后不会再出现。所以需要记录是否是第一次使用程序，办法有很多，最容易想到的就是使用SharedPreferences来保存。步骤如下：
      1、程序进入欢迎界面，SplashActivity，在这里读取SharedPreferences里面的变量，先设置为true。进入引导界面，然后设置为false。
      2、之后每次进入欢迎界面读取SharedPreferences里面的变量，因为是false，所以不会运行引导界面了。
    代码如下：
    SplashActivity.java,欢迎界面。
    [java] view plaincopy
     
    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.  */  
    11. public class SplashActivity extends Activity {  
    12.     boolean isFirstIn = false;  
    13.   
    14.     private static final int GO_HOME = 1000;  
    15.     private static final int GO_GUIDE = 1001;  
    16.     // 延迟3秒  
    17.     private static final long SPLASH_DELAY_MILLIS = 3000;  
    18.   
    19.     private static final String SHAREDPREFERENCES_NAME = "first_pref";  
    20.   
    21.     /** 
    22.      * Handler:跳转到不同界面 
    23.      */  
    24.     private Handler mHandler = new Handler() {  
    25.   
    26.         @Override  
    27.         public void handleMessage(Message msg) {  
    28.             switch (msg.what) {  
    29.             case GO_HOME:  
    30.                 goHome();  
    31.                 break;  
    32.             case GO_GUIDE:  
    33.                 goGuide();  
    34.                 break;  
    35.             }  
    36.             super.handleMessage(msg);  
    37.         }  
    38.     };  
    39.   
    40.     @Override  
    41.     protected void onCreate(Bundle savedInstanceState) {  
    42.         super.onCreate(savedInstanceState);  
    43.         setContentView(R.layout.splash);  
    44.   
    45.         init();  
    46.     }  
    47.   
    48.     private void init() {  
    49.         // 读取SharedPreferences中需要的数据  
    50.         // 使用SharedPreferences来记录程序的使用次数  
    51.         SharedPreferences preferences = getSharedPreferences(  
    52.                 SHAREDPREFERENCES_NAME, MODE_PRIVATE);  
    53.   
    54.         // 取得相应的值，如果没有该值，说明还未写入，用true作为默认值  
    55.         isFirstIn = preferences.getBoolean("isFirstIn", true);  
    56.   
    57.         // 判断程序与第几次运行，如果是第一次运行则跳转到引导界面，否则跳转到主界面  
    58.         if (!isFirstIn) {  
    59.             // 使用Handler的postDelayed方法，3秒后执行跳转到MainActivity  
    60.             mHandler.sendEmptyMessageDelayed(GO_HOME, SPLASH_DELAY_MILLIS);  
    61.         } else {  
    62.             mHandler.sendEmptyMessageDelayed(GO_GUIDE, SPLASH_DELAY_MILLIS);  
    63.         }  
    64.   
    65.     }  
    66.   
    67.     private void goHome() {  
    68.         Intent intent = new Intent(SplashActivity.this, MainActivity.class);  
    69.         SplashActivity.this.startActivity(intent);  
    70.         SplashActivity.this.finish();  
    71.     }  
    72.   
    73.     private void goGuide() {  
    74.         Intent intent = new Intent(SplashActivity.this, GuideActivity.class);  
    75.         SplashActivity.this.startActivity(intent);  
    76.         SplashActivity.this.finish();  
    77.     }  
    78. }  
    GuideActivity.java引导界面：
    [java] view plaincopy
     
    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.  */  
    18. public class GuideActivity extends Activity implements OnPageChangeListener {  
    19.   
    20.     private ViewPager vp;  
    21.     private ViewPagerAdapter vpAdapter;  
    22.     private List<View> views;  
    23.   
    24.     // 底部小点图片  
    25.     private ImageView[] dots;  
    26.   
    27.     // 记录当前选中位置  
    28.     private int currentIndex;  
    29.   
    30.     @Override  
    31.     protected void onCreate(Bundle savedInstanceState) {  
    32.         super.onCreate(savedInstanceState);  
    33.         setContentView(R.layout.guide);  
    34.   
    35.         // 初始化页面  
    36.         initViews();  
    37.   
    38.         // 初始化底部小点  
    39.         initDots();  
    40.     }  
    41.   
    42.     private void initViews() {  
    43.         LayoutInflater inflater = LayoutInflater.from(this);  
    44.   
    45.         views = new ArrayList<View>();  
    46.         // 初始化引导图片列表  
    47.         views.add(inflater.inflate(R.layout.what_new_one, null));  
    48.         views.add(inflater.inflate(R.layout.what_new_two, null));  
    49.         views.add(inflater.inflate(R.layout.what_new_three, null));  
    50.         views.add(inflater.inflate(R.layout.what_new_four, null));  
    51.   
    52.         // 初始化Adapter  
    53.         vpAdapter = new ViewPagerAdapter(views, this);  
    54.           
    55.         vp = (ViewPager) findViewById(R.id.viewpager);  
    56.         vp.setAdapter(vpAdapter);  
    57.         // 绑定回调  
    58.         vp.setOnPageChangeListener(this);  
    59.     }  
    60.   
    61.     private void initDots() {  
    62.         LinearLayout ll = (LinearLayout) findViewById(R.id.ll);  
    63.   
    64.         dots = new ImageView[views.size()];  
    65.   
    66.         // 循环取得小点图片  
    67.         for (int i = 0; i < views.size(); i++) {  
    68.             dots[i] = (ImageView) ll.getChildAt(i);  
    69.             dots[i].setEnabled(true);// 都设为灰色  
    70.         }  
    71.   
    72.         currentIndex = 0;  
    73.         dots[currentIndex].setEnabled(false);// 设置为白色，即选中状态  
    74.     }  
    75.   
    76.     private void setCurrentDot(int position) {  
    77.         if (position < 0 || position > views.size() - 1  
    78.                 || currentIndex == position) {  
    79.             return;  
    80.         }  
    81.   
    82.         dots[position].setEnabled(false);  
    83.         dots[currentIndex].setEnabled(true);  
    84.   
    85.         currentIndex = position;  
    86.     }  
    87.   
    88.     // 当滑动状态改变时调用  
    89.     @Override  
    90.     public void onPageScrollStateChanged(int arg0) {  
    91.     }  
    92.   
    93.     // 当当前页面被滑动时调用  
    94.     @Override  
    95.     public void onPageScrolled(int arg0, float arg1, int arg2) {  
    96.     }  
    97.   
    98.     // 当新的页面被选中时调用  
    99.     @Override  
    100.     public void onPageSelected(int arg0) {  
    101.         // 设置底部小点选中状态  
    102.         setCurrentDot(arg0);  
    103.     }  
    104.   
    105. }  
    ViewPagerAdapter.java。ViewPager的适配器：
    [java] view plaincopy
     
    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.   
    109. }  
    至于MainActivity随便了。
    效果如下：




     

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

      
    Le王冬冬 博客分享地址： http://www.cnblogs.com/dongdong230/ 每个人都应做一天攻城狮
  • 相关阅读:
    Struts2+Spring3+Mybatis3开发环境搭建
    spring+struts2+mybatis
    【LeetCode】Populating Next Right Pointers in Each Node
    【LeetCode】Remove Duplicates from Sorted Array
    【LeetCode】Remove Duplicates from Sorted Array II
    【LeetCode】Binary Tree Inorder Traversal
    【LeetCode】Merge Two Sorted Lists
    【LeetCode】Reverse Integer
    【LeetCode】Same Tree
    【LeetCode】Maximum Depth of Binary Tree
  • 原文地址：https://www.cnblogs.com/dongdong230/p/4183077.html
Copyright © 2020-2023  润新知