Android通过ViewPager实现左右滑动切换图片

三里屯摇滚

Android通过ViewPager实现左右滑动切换图片

想开发像人人网相册打开单张图片时候能左右滑动切换图片的效果，开始通过FlipperView实现，不能跟手拖动，效果不好，而且需要自己写很多代码来控制FlipperView中的View。后来发现Android 3.0之后的SDK中提供了android-support-v4包用以实现版本兼容，让老版本系统下的应用通过加入jar包实现扩展，得到新版的各种技术优势，例如Fragment等。



ViewPager是android-support-v4.jar包中的一个系统控件，继承自ViewGroup，专门用以实现左右滑动切换View的效果，使用时需要首先在Project->properties->Java Build Path->Libraries->Add External Jars中加入sdk目录下的extras/android/support/v4/android-support-v4.jar（如果找不到，则需要用sdk manager下载android support package）。加入这个jar包之后就可以使用ViewPager类了。



ViewPager的使用类似于ListView，需要有对应的Adapter进行数据绑定，实现图片切换仅需要继承PaperAdapter就可以了。继承后需要重写如下四个方法。

1. instantiateItem(ViewGroup, int)
   
2. destroyItem(ViewGroup, int, Object)
   
3. getCount()
   
4. isViewFromObject(View, Object)

复制代码

类似于BaseAdapter，其中instantiateItem方法用来得到每个View，destroyItem用以控制当某个View不需要的时候的回收处理。isViewFromObject用来实现判断View和Object是否为同一个View。


Java代码

1. import java.io.FileNotFoundException;   
   
2. import java.util.List;   
   
3.   
   
4. import android.content.Context;   
   
5. import android.graphics.Bitmap;   
   
6. import android.net.Uri;   
   
7. import android.support.v4.view.PagerAdapter;   
   
8. import android.support.v4.view.ViewPager;   
   
9. import android.view.View;   
   
10. import android.view.ViewGroup;   
    
11. import android.widget.ImageView;   
    
12.   
    
13. public class TestAdapter extends PagerAdapter {   
    
14.   
    
15.     private List<String> mPaths;   
    
16.       
    
17.     private Context mContext;   
    
18.       
    
19.     public TestAdapter(Context cx) {   
    
20.         mContext = cx.getApplicationContext();   
    
21.     }   
    
22.       
    
23.     public void change(List<String> paths) {   
    
24.         mPaths = paths;   
    
25.     }   
    
26.       
    
27.     @Override  
    
28.     public int getCount() {   
    
29.         // TODO Auto-generated method stub   
    
30.         return mPaths.size();   
    
31.     }   
    
32.   
    
33.     @Override  
    
34.     public boolean isViewFromObject(View view, Object obj) {   
    
35.         // TODO Auto-generated method stub   
    
36.         return view == (View) obj;   
    
37.     }   
    
38.   
    
39.     @Override  
    
40.     public Object instantiateItem (ViewGroup container, int position) {   
    
41.         ImageView iv = new ImageView(mContext);   
    
42.         try {   
    
43.             Bitmap bm = ImageFile.getBitmapSample(mContext, Uri.parse(mPaths.get(position)), 320, 480);//载入bitmap   
    
44.             iv.setImageBitmap(bm);   
    
45.         } catch (FileNotFoundException e) {   
    
46.             // TODO Auto-generated catch block   
    
47.             e.printStackTrace();   
    
48.         } catch (OutOfMemoryError e) {   
    
49.             // TODO Auto-generated catch block   
    
50.             e.printStackTrace();   
    
51.         }   
    
52.         ((ViewPager)container).addView(iv, 0);   
    
53.         return iv;   
    
54.     }   
    
55.       
    
56.     @Override  
    
57.     public void destroyItem (ViewGroup container, int position, Object object) {   
    
58.         container.removeView((View)object);   
    
59.     }   
    
60. }  
    
61. 
    
62. import java.io.FileNotFoundException;
    
63. import java.util.List;
    
64. 
    
65. import android.content.Context;
    
66. import android.graphics.Bitmap;
    
67. import android.net.Uri;
    
68. import android.support.v4.view.PagerAdapter;
    
69. import android.support.v4.view.ViewPager;
    
70. import android.view.View;
    
71. import android.view.ViewGroup;
    
72. import android.widget.ImageView;
    
73. 
    
74. public class TestAdapter extends PagerAdapter {
    
75. 
    
76.         private List<String> mPaths;
    
77.        
    
78.         private Context mContext;
    
79.        
    
80.         public TestAdapter(Context cx) {
    
81.                 mContext = cx.getApplicationContext();
    
82.         }
    
83.        
    
84.         public void change(List<String> paths) {
    
85.                 mPaths = paths;
    
86.         }
    
87.        
    
88.         @Override
    
89.         public int getCount() {
    
90.                 // TODO Auto-generated method stub
    
91.                 return mPaths.size();
    
92.         }
    
93. 
    
94.         @Override
    
95.         public boolean isViewFromObject(View view, Object obj) {
    
96.                 // TODO Auto-generated method stub
    
97.                 return view == (View) obj;
    
98.         }
    
99. 
    
100.         @Override
     
101.         public Object instantiateItem (ViewGroup container, int position) {
     
102.                 ImageView iv = new ImageView(mContext);
     
103.                 try {
     
104.                         Bitmap bm = ImageFile.getBitmapSample(mContext, Uri.parse(mPaths.get(position)), 320, 480);//载入bitmap
     
105.                         iv.setImageBitmap(bm);
     
106.                 } catch (FileNotFoundException e) {
     
107.                         // TODO Auto-generated catch block
     
108.                         e.printStackTrace();
     
109.                 } catch (OutOfMemoryError e) {
     
110.                         // TODO Auto-generated catch block
     
111.                         e.printStackTrace();
     
112.                 }
     
113.                 ((ViewPager)container).addView(iv, 0);
     
114.                 return iv;
     
115.         }
     
116.        
     
117.         @Override
     
118.         public void destroyItem (ViewGroup container, int position, Object object) {
     
119.                 container.removeView((View)object);
     
120.         }
     
121. }

复制代码

Xml代码

1. <android.support.v4.view.ViewPager  
   
2.     android:id="@+id/pager"  
   
3.     android:layout_width="fill_parent"  
   
4.     android:layout_height="fill_parent" />  
   
5. 
   
6.     <android.support.v4.view.ViewPager
   
7.         android:id="@+id/pager"
   
8.         android:layout_width="fill_parent"
   
9.         android:layout_height="fill_parent" />

复制代码

Activity:
Java代码

1. @Override  
   
2. public void onCreate(Bundle savedInstanceState) {   
   
3.     super.onCreate(savedInstanceState);   
   
4.     setContentView(R.layout.main);   
   
5.     mViewPager = (ViewPager)findViewById(R.id.pager);   
   
6.     mAdapter = new TestAdapter(this);   
   
7.     mViewPager.setAdapter(mAdapter);   
   
8.     mAdapter.change(getList());   
   
9. }   
   
10.   
    
11. private List<String> getList() {   
    
12.     List<String> list = new ArrayList<String>();   
    
13.     list.add("file:///sdcard/Sunset.jpg");   
    
14.     list.add("file:///sdcard/Winter.jpg");   
    
15.     list.add("file:///sdcard/Water lilies.jpg");   
    
16.     list.add("file:///sdcard/Blue hills.jpg");   
    
17.     return list;   
    
18. }  

复制代码

向上吧少年

谢谢分享