这篇文章主要介绍了Android编程滑动效果之Gallery+GridView实现图片预览功能,结合实例形式分析了Android通过GridView和Gallery两个控件模仿Gallery图像集图片预览功能,并附带demo源码供读者下载参考,需要的朋友可以参考下
正文
Android编程滑动效果之Gallery+GridView实现图片预览功能(附demo源码下载)
本文实例讲述了android编程滑动效果之gallery+gridview实现图片预览功能。分享给大家供大家参考，具体如下：
android系统自带一个gridview和gallery两个控件，gridview网格显示，gallery单个浏览，两者结合起来可以真正实现gallery浏览图片效果。
本示例通过gridview和gallery两个控件，模仿实现一个完整的仿gallery图像集的图片浏览效果。效果图如下：
1、gridview
首先，自定义一个gridimageadapter图片适配器，用于填充gridview控件的图片
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
|
public class gridimageadapter extends baseadapter { private context mcontext; drawable btndrawable; public gridimageadapter(context context) { mcontext = context; resources resources = context.getresources(); btndrawable = resources.getdrawable(r.drawable.bg); } @override public int getcount() { return imagesource.mthumbids.length; } @override public object getitem(int position) { return position; } @override public long getitemid(int position) { return position; } @override public view getview(int position, view convertview, viewgroup parent) { imageviewext imageview; int space; if (convertview == null) { imageview = new imageviewext(mcontext); if (imagecol == 5) { space = dm.heightpixels / imagecol - 6; imageview.setlayoutparams(new gridview.layoutparams(space, space)); } else { space = dm.widthpixels / imagecol - 6; imageview.setlayoutparams(new gridview.layoutparams( space, space)); } imageview.setadjustviewbounds(true); imageview.setscaletype(imageview.scaletype.center_crop); // 缩放图片使其长和宽一样 imageview.setpadding(3, 3, 3, 3); } else { imageview = (imageviewext) convertview; } imageview.setimageresource(imagesource.mthumbids[position]); return imageview; }} |
然后，用gridimageadapter填充gridview
|
1
2
3
4
|
gridview = (gridview) findviewbyid(r.id.mygrid);gridimageadapter = new gridimageadapter(this);gridview.setadapter(gridimageadapter);gridview.setonitemclicklistener(listener); // 设置点击监听事件 |
最后，设置gridview控件的点击监听事件
|
1
2
3
4
5
6
7
8
9
|
adapterview.onitemclicklistener listener = new adapterview.onitemclicklistener() { @override public void onitemclick(adapterview<?> arg0, view arg1, int position, long id) { intent intent = new intent(); intent.setclass(gridviewactivity.this, galleryactivity.class); intent.putextra("position", position); startactivity(intent); }}; |
2、gallery
完成了gridview的图片显示、监听事件后，现在点击图片，会启动一个activity来显示当前点击的图片，此时显示图片的控件便是gallery
首先，同gridview一样，自定义一个imageadapter图片适配器，用来填充gallery
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
|
public class imageadapter extends baseadapter { private context mcontext; private int mpos; public imageadapter(context context) { mcontext = context; } public void setownposition(int ownposition) { this.mpos = ownposition; } public int getownposition() { return mpos; } @override public int getcount() { return imagesource.mthumbids.length; } @override public object getitem(int position) { mpos=position; return position; } @override public long getitemid(int position) { mpos=position; return position; } @override public view getview(int position, view convertview, viewgroup parent) { mpos=position; imageview imageview = new imageview(mcontext); imageview.setbackgroundcolor(0xff000000); imageview.setscaletype(imageview.scaletype.fit_center); imageview.setlayoutparams(new mygallery.layoutparams(layoutparams.match_parent, layoutparams.match_parent)); imageview.setimageresource(imagesource.mthumbids[position]); return imageview; }} |
然后，用imageadapter填充gallery
|
1
2
3
4
5
6
7
8
|
mygallery galllery = (mygallery) findviewbyid(r.id.mygallery);intent intent = getintent();position = intent.getintextra("position", 0); // 获取gridviewactivity传来的图片位置positionimageadapter imgadapter=new imageadapter(this);galllery.setadapter(imgadapter); // 设置图片imageadaptergalllery.setselection(position); // 设置当前显示图片 animation an= animationutils.loadanimation(this,r.anim.scale ); // gallery动画 galllery.setanimation(an); |
此时，如果细心可以注意到，我们的gallery也是自己定义的mygallery，具体定义如下：
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
|
public class mygallery extends gallery { boolean isfirst = false; boolean islast = false; public mygallery(context context) { super(context); } public mygallery(context context, attributeset paramattributeset) { super(context, paramattributeset); } /** 是否向左滑动（true - 向左滑动； false - 向右滑动） */ private boolean isscrollingleft(motionevent e1, motionevent e2) { return e2.getx() > e1.getx(); } @override public boolean onfling(motionevent e1, motionevent e2, float distancex, float distancey) { imageadapter ia = (imageadapter) this.getadapter(); int p = ia.getownposition(); // 获取当前图片的position int count = ia.getcount(); // 获取全部图片的总数count int kevent; if (isscrollingleft(e1, e2)) { if (p == 0 && isfirst) { toast.maketext(this.getcontext(), "已是第一页", toast.length_short).show(); } else if (p == 0) { isfirst = true; } else { islast = false; } kevent = keyevent.keycode_dpad_left; } else { if (p == count - 1 && islast) { toast.maketext(this.getcontext(), "已到最后一页", toast.length_short).show(); } else if (p == count - 1) { islast = true; } else { isfirst = false; } kevent = keyevent.keycode_dpad_right; } onkeydown(kevent, null); return true; }} |
galleryactivity的布局文件gallery.xml
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
|
<?xml version="1.0" encoding="utf-8"?><linearlayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:gravity="center" android:orientation="horizontal" android:padding="10dip" > <relativelayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="#000000" android:padding="2dip" > <com.homer.gridgallery.mygallery android:id="@+id/mygallery" android:layout_width="fill_parent" android:layout_height="fill_parent" android:spacing="16dp" /> </relativelayout></linearlayout> |
完整实例代码点击此处。
希望本文所述对大家android程序设计有所帮助。
发表评论