Android编程滑动效果之Gallery+GridView实现图片预览功能(附demo源码下载)

本文实例讲述了android编程滑动效果之gallery+gridview实现图片预览功能。分享给大家供大家参考，具体如下：

android系统自带一个gridview和gallery两个控件，gridview网格显示，gallery单个浏览，两者结合起来可以真正实现gallery浏览图片效果。

本示例通过gridview和gallery两个控件，模仿实现一个完整的仿gallery图像集的图片浏览效果。效果图如下：

1、gridview

首先，自定义一个gridimageadapter图片适配器，用于填充gridview控件的图片

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

gridview = (gridview) findviewbyid(r.id.mygrid);
gridimageadapter = new gridimageadapter(this);
gridview.setadapter(gridimageadapter);
gridview.setonitemclicklistener(listener); // 设置点击监听事件

最后，设置gridview控件的点击监听事件

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

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

mygallery galllery = (mygallery) findviewbyid(r.id.mygallery);
intent intent = getintent();
position = intent.getintextra("position", 0); // 获取gridviewactivity传来的图片位置position
imageadapter imgadapter=new imageadapter(this);
galllery.setadapter(imgadapter); // 设置图片imageadapter
galllery.setselection(position); // 设置当前显示图片
  animation an= animationutils.loadanimation(this,r.anim.scale ); // gallery动画
  galllery.setanimation(an);

此时，如果细心可以注意到，我们的gallery也是自己定义的mygallery，具体定义如下：

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

<?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相关内容感兴趣的读者可查看本站专题：《android开发动画技巧汇总》、《android开发入门与进阶教程》及《android控件用法总结》。

希望本文所述对大家android程序设计有所帮助。