使用Gallery

画廊功能，在实际的开发中使用到的地方还是挺多的！

1.重写的适配器：

[java]  view plain copy print ?

1. public class GalAdapter extends BaseAdapter {  
2.   
3.     private Context context;  
4.     private List<Integer> list;  
5.   
6.     public GalAdapter(Context context, List<Integer> list) {  
7.         this.context = context;  
8.         this.list = list;  
9.     }  
10.   
11.     // 设置为一个较大的数  
12.     @Override  
13.     public int getCount() {  
14.         // TODO Auto-generated method stub  
15.         return 20;  
16.     }  
17.   
18.     @Override  
19.     public Object getItem(int position) {  
20.         // TODO Auto-generated method stub  
21.         return position;  
22.     }  
23.   
24.     @Override  
25.     public long getItemId(int position) {  
26.         // TODO Auto-generated method stub  
27.         return position;  
28.     }  
29.   
30.     @Override  
31.     public View getView(int position, View convertView, ViewGroup parent) {  
32.         // TODO Auto-generated method stub  
33.         // 实例化  
34.         ImageView img = new ImageView(context);  
35.         // 设置资源  
36.         img.setImageResource(list.get(position % list.size()));  
37.         // 设置边界对齐  
38.         img.setAdjustViewBounds(true);  
39.         // 设置布局参数  
40.         img.setLayoutParams(new Gallery.LayoutParams(LayoutParams.MATCH_PARENT,  
41.                 LayoutParams.WRAP_CONTENT));  
42.         // 设置背景资源  
43.          img.setBackgroundResource(R.drawable.BackBar);  
44.         return img;  
45.     }  
46. }  

 在getcount()中定义一个较大的数，来实现循环的效果。

2.活动界面：

[java]  view plain copy print ?

1. public class TestGallery extends Activity {  
2.     private Gallery myGallery;  
3.     private GalAdapter adapter;  
4.     private List<Integer> list;  
5.   
6.     @Override  
7.     protected void onCreate(Bundle savedInstanceState) {  
8.         // TODO Auto-generated method stub  
9.         super.onCreate(savedInstanceState);  
10.         setContentView(R.layout.acy_testgallery);  
11.         initView();  
12.     }  
13.   
14.     public void initView() {  
15.         list = new ArrayList<Integer>();  
16.         //添加资源  
17.         list.add(R.drawable.man_ad);  
18.         list.add(R.drawable.man_ad);  
19.           
20.         adapter = new GalAdapter(this, list);  
21.         myGallery = (Gallery) findViewById(R.id.g_mg);  
22.         myGallery.setAdapter(adapter);  
23.         //选中的行  
24.         myGallery.setSelection(10);  
25.         //点击效果  
26.         myGallery.setOnItemClickListener(new OnItemClickListener() {  
27.   
28.             @Override  
29.             public void onItemClick(AdapterView<?> arg0, View arg1,  
30.                     int position, long arg3) {  
31.                 // TODO Auto-generated method stub  
32.                 Toast.makeText(TestGallery.this, "you click:" + position, 500)  
33.                         .show();  
34.             }  
35.         });  
36.     }  
37. }  

3.布局：

[html]  view plain copy print ?

1. <?xml version="1.0" encoding="utf-8"?>  
2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
3.     android:layout_width="match_parent"  
4.     android:layout_height="match_parent" >  
5.   
6.     <Gallery  
7.         android:id="@+id/g_mg"  
8.         android:layout_width="match_parent"  
9.         android:layout_height="wrap_content"  
10.         android:spacing="10dp" >  
11.     </Gallery>  
12.   
13. </RelativeLayout>  

注意：

1.要实现的循环效果其实是个伪循环，它是通过设置一个比较大的数值，集合中的资源反复出现来达到视觉上的循环的。左右循环，是通过设置选中的是靠中间的资源，来实现左右滑动的。

2.但是按照这样的写法，对于画廊还存在速度控制问题，当滑动的速率过快的话，会一下滑动几张图片，给人的视觉效果不好。如果想实现跟viewpager差不多的单页滑动的效果（提一下，是可以通过自定义viewpager来实现类似画廊的效果的），可以通过自定gallery来实现。

       单页滑动：

[html]  view plain copy print ?

1. public class MyGallery extends Gallery {  
2.   
3.     public MyGallery(Context context) {  
4.         super(context);  
5.         // TODO Auto-generated constructor stub  
6.     }  
7.   
8.     public MyGallery(Context context, AttributeSet attrs, int defStyle) {  
9.         super(context, attrs, defStyle);  
10.         // TODO Auto-generated constructor stub  
11.     }  
12.   
13.     public MyGallery(Context context, AttributeSet attrs) {  
14.         super(context, attrs);  
15.         // TODO Auto-generated constructor stub  
16.     }  
17.   
18.     @Override  
19.     public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX,  
20.             float velocityY) {  
21.         // TODO Auto-generated method stub  
22.         int kEvent;  
23.         if (isScrollingLeft(e1, e2)) {  
24.             // Check if scrolling left  
25.             kEvent = KeyEvent.KEYCODE_DPAD_LEFT;  
26.         } else {  
27.             // Otherwise scrolling right  
28.             kEvent = KeyEvent.KEYCODE_DPAD_RIGHT;  
29.         }  
30.         onKeyDown(kEvent, null);  
31.         return true;  
32.     }  
33.   
34.     public boolean isScrollingLeft(MotionEvent e1, MotionEvent e2) {  
35.         return e2.getX() > e1.getX();  
36.     }  
37. }  

在实现过的过程中，有些童鞋是直接让onfling（）返回false，来达到单页的效果的，这样会存在灵敏度的问题，需要滑动比较长一段的距离，才能切图片。

还有些童鞋在onscroll()控制滑动的距离来控制滑动的页数，有兴趣的可以试试！

3.在画廊下面显示一排点，来显示是第几张图片。实现的原理是在gallery中添加一个layout，在里面放置一排的点，当gallery滑动的时候，就改变小点的背景图片。

首先是布局：

[html]  view plain copy print ?

1. <RelativeLayout  
2.         android:id="@+id/layout_title"  
3.         android:layout_width="match_parent"  
4.         android:layout_height="wrap_content" >  
5.   
6.         <com.tinyevent.view.MyGallery  
7.             android:id="@+id/gal_title"  
8.             android:layout_width="wrap_content"  
9.             android:layout_height="wrap_content"  
10.             android:spacing="10dp" >  
11.         </com.tinyevent.view.MyGallery>  
12.   
13.         <LinearLayout  
14.             android:layout_width="match_parent"  
15.             android:layout_height="wrap_content"  
16.             android:layout_below="@id/gal_title"  
17.             android:gravity="center"  
18.             android:orientation="horizontal" >  
19.   
20.             <ImageView  
21.                 android:id="@+id/img_one"  
22.                 android:layout_width="wrap_content"  
23.                 android:layout_height="wrap_content"  
24.                 android:background="@drawable/point_white" />  
25.   
26.             <ImageView  
27.                 android:id="@+id/img_two"  
28.                 android:layout_width="wrap_content"  
29.                 android:layout_height="wrap_content"  
30.                 android:layout_marginLeft="10dp"  
31.                 android:background="@drawable/point_white" />  
32.   
33.             <ImageView  
34.                 android:id="@+id/img_three"  
35.                 android:layout_width="wrap_content"  
36.                 android:layout_height="wrap_content"  
37.                 android:layout_marginLeft="10dp"  
38.                 android:background="@drawable/point_white" />  
39.   
40.             <ImageView  
41.                 android:id="@+id/img_four"  
42.                 android:layout_width="wrap_content"  
43.                 android:layout_height="wrap_content"  
44.                 android:layout_marginLeft="10dp"  
45.                 android:background="@drawable/point_white" />  
46.   
47.             <ImageView  
48.                 android:id="@+id/img_five"  
49.                 android:layout_width="wrap_content"  
50.                 android:layout_height="wrap_content"  
51.                 android:layout_marginLeft="10dp"  
52.                 android:background="@drawable/point_white" />  
53.         </LinearLayout>  
54.     </RelativeLayout>  

然后再gallery中监听滑动事件：

[html]  view plain copy print ?

1. // 画廊下的滚动小点  
2.         gallery.setOnItemSelectedListener(new OnItemSelectedListener() {  
3.   
4.             @Override  
5.             public void onItemSelected(AdapterView<?> arg0, View arg1,  
6.                     int position, long arg3) {  
7.                 // TODO Auto-generated method stub  
8.                 restoreLinearImg();  
9.                 if (0 == position % 5) {  
10.                     oneImg.setBackgroundResource(R.drawable.point_black);  
11.                 } else if (1 == position % 5) {  
12.                     twoImg.setBackgroundResource(R.drawable.point_black);  
13.                 } else if (2 == position % 5) {  
14.                     threeImg.setBackgroundResource(R.drawable.point_black);  
15.                 } else if (3 == position % 5) {  
16.                     fourtImg.setBackgroundResource(R.drawable.point_black);  
17.                 } else {  
18.                     fiveImg.setBackgroundResource(R.drawable.point_black);  
19.                 }  
20.   
21.             }  
22.   
23.             @Override  
24.             public void onNothingSelected(AdapterView<?> arg0) {  
25.                 // TODO Auto-generated method stub  
26.   
27.             }  
28.         });  

当滑动图片的时候，就动态改变小点的背景图片，如果你想加入动画的话，估计也行（当然，我没试过！）。

封装了一个将所有的点重置为白色的方法：

[html]  view plain copy print ?

1. /**  
2.      * 所有画廊下的滚动小点恢复白色点  
3.      */  
4.     public void restoreLinearImg() {  
5.         oneImg.setBackgroundResource(R.drawable.point_white);  
6.         twoImg.setBackgroundResource(R.drawable.point_white);  
7.         threeImg.setBackgroundResource(R.drawable.point_white);  
8.         fourtImg.setBackgroundResource(R.drawable.point_white);  
9.         fiveImg.setBackgroundResource(R.drawable.point_white);  
10.     }  

虽然跟软件的引导功能很相似，可是实现的方法是不一样的。

转载地址：http://blog.csdn.net/yueqinglkong/article/details/21159227