Android 滑动效果基础篇（四）—— Gallery + GridView

2022-11-02 15:25:23

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

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

1、GridView

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

然后，用GridImageAdapter填充GridView

最后，设置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

码农公寓