RecyclerView是谷歌最新的代替ListView和GridView一款超赞控件,可以随意变成ListView,GridView,和瀑布流的样式,也许是才出来不久,苦恼的是它的监听事件有点麻烦,需要自己动手重写方法,后面代码里会体现出来。Glide是一款高效图片处理的第三包,比较其他的图片处理第三方包要高效,好用很多,自己可以上网查查了解了解。PhotoView是一款支持放大缩小图片浏览的第三方包,用法都很简单。
先看看效果图:
主界面的瀑布流照片墙:
然后点击某一张图片,进入大图:
然后两点手势缩放图片,最后点击图片,退回到原图
activity代码:
public class RecyclerViewGridImageActivity extends Activity {
private RecyclerView mRecyclerView;
private MyRecyclerViewAdapter adapter;
private String[] URLs = new String[]{
"http://pic3.nipic.com/20090617/1242397_083514091_2.jpg",
"http://pic28.nipic.com/20130422/12457151_164027506188_2.jpg",
"http://pic4.nipic.com/20091120/805653_183746006558_2.jpg",
"http://pic7.nipic.com/20100606/4899050_135353003843_2.jpg",
"http://pic4.nipic.com/20091218/3557379_083034065299_2.jpg",
"http://pic4.nipic.com/20090924/3308315_095324041734_2.jpg",
"http://pica.nipic.com/2008-01-18/2008118212025258_2.jpg",
"http://pica.nipic.com/2007-11-15/20071115103157516_2.jpg",
"http://pic6.nipic.com/20100427/4365846_231110093316_2.jpg",
"http://a2.att.hudong.com/79/22/01000000000000119062273272179.jpg",
"http://img4.duitang.com/uploads/item/201209/20/20120920165508_EuenZ.jpeg",
"http://img5.duitang.com/uploads/item/201207/25/20120725171947_CV3ZA.jpeg",
"http://pic24.nipic.com/20121029/3822951_090444696000_2.jpg",
"http://d.3987.com/lyzr_130620/004.jpg",
"http://pic14.nipic.com/20110527/2531170_101932834000_2.jpg",
"http://pica.nipic.com/2008-01-12/200811215275498_2.jpg",
"http://pica.nipic.com/2007-07-15/200771515512480_2.jpg",
"http://pic3.nipic.com/20090514/2639204_233912087_2.jpg",
"http://img4.chinaface.com/original/212dlz514BUdSEyhs4mJrrPXe1a4E.jpg",
"http://image.tianjimedia.com/uploadImages/2011/306/EQ2E3ZUPNMNV.jpg",
"http://h.hiphotos.baidu.com/image/pic/item/0b55b319ebc4b7452c1b0e16cdfc1e178a821526.jpg",
"http://a.hiphotos.baidu.com/image/pic/item/9f510fb30f2442a751a29476d543ad4bd01302b0.jpg",
"http://e.hiphotos.baidu.com/image/pic/item/f2deb48f8c5494eec48c66ca29f5e0fe98257eb2.jpg",
"http://f.hiphotos.baidu.com/image/pic/item/1e30e924b899a901f19c32e519950a7b0308f5bc.jpg",
"http://e.hiphotos.baidu.com/image/pic/item/63d0f703918fa0eca4042edf229759ee3c6ddb25.jpg",
"http://h.hiphotos.baidu.com/image/pic/item/a1ec08fa513d2697f631428f51fbb2fb4216d806.jpg",
"http://b.hiphotos.baidu.com/image/pic/item/ac4bd11373f08202034236d14ffbfbedaa641b0f.jpg",
"http://e.hiphotos.baidu.com/image/pic/item/58ee3d6d55fbb2fbafb52bfa4b4a20a44723dcb8.jpg",
"http://a.hiphotos.baidu.com/image/pic/item/c8177f3e6709c93d08d97a679a3df8dcd1005472.jpg",
"http://h.hiphotos.baidu.com/image/pic/item/bd3eb13533fa828b01fbafb2ff1f4134960a5a82.jpg",
"http://b.hiphotos.baidu.com/image/pic/item/8326cffc1e178a82689d65adf403738da977e81e.jpg",
"http://h.hiphotos.baidu.com/image/pic/item/9825bc315c6034a8d141851dce1349540823768e.jpg",
"http://h.hiphotos.baidu.com/image/pic/item/72f082025aafa40f7c884d31af64034f79f0198b.jpg",
"http://a.hiphotos.baidu.com/image/pic/item/d53f8794a4c27d1eaa8358171fd5ad6edcc438bf.jpg",
"http://d.hiphotos.baidu.com/image/pic/item/902397dda144ad344a35e454d4a20cf430ad855e.jpg",
"http://a.hiphotos.baidu.com/image/pic/item/728da9773912b31be0f04c498318367adab4e136.jpg",
"http://d.hiphotos.baidu.com/image/pic/item/5bafa40f4bfbfbed88e0cfa07cf0f736aec31fb7.jpg",
"http://c.hiphotos.baidu.com/image/pic/item/8d5494eef01f3a299fff02c79b25bc315c607c80.jpg",
"http://pic7.nipic.com/20100522/1263764_002013845527_2.jpg",
"http://a2.att.hudong.com/12/26/19300000362045133857269184471_950.jpg",
"http://pic.nipic.com/2008-03-01/2008319174451_2.jpg",
"http://pic23.nipic.com/20120824/8218020_193654254129_2.jpg",
"http://pic24.nipic.com/20121010/4388163_025151474144_2.jpg",
"http://pic11.nipic.com/20100803/4038389_093502059852_2.jpg",
"http://d.3987.com/mlxw_130629/002.jpg",
"http://pic.sayingfly.com/Photo/UpLoadFiles/2008-7-24/20087249442527.jpg",
"http://pic12.nipic.com/20110223/2709576_111836168000_2.jpg",
"http://pic14.nipic.com/20110609/2531170_055926229173_2.jpg",
"http://d.3987.com/dgblcsyjgqbz_20130314/001.jpg",
"http://pic.yesky.com/imagelist/06/47/985202_5664.jpg",
"http://pic19.nipic.com/20120324/3484432_092618805000_2.jpg"
};
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.myrecyclerviw_layout);
mRecyclerView = (RecyclerView) findViewById(R.id.myrecycler_layout);
adapter = new MyRecyclerViewAdapter(this, URLs);
mRecyclerView.setAdapter(adapter);
//瀑布流样式,在adapter里要添加随机高度
mRecyclerView.setLayoutManager(new StaggeredGridLayoutManager(3, StaggeredGridLayoutManager.VERTICAL));
mRecyclerView.addItemDecoration(new DividerGridItemDecoration(this));
//GridView样式,在adapter中不要随机高度
// mRecyclerView.setLayoutManager(new GridLayoutManager(this,4));
// mRecyclerView.addItemDecoration(new DividerGridItemDecoration(this));
//ListView样式,在adapter中不要随机高度
// mRecyclerView.setLayoutManager(new LinearLayoutManager(this));
// mRecyclerView.addItemDecoration(new DividerItemDecoration(this,DividerItemDecoration.VERTICAL_LIST));
// 设置item动画
mRecyclerView.setItemAnimator(new DefaultItemAnimator());
adapter.setOnItemClickLitener(new MyRecyclerViewAdapter.OnItemClickLitener() {
@Override
public void onItemClick(View view, int position) {
Intent intent = new Intent(RecyclerViewGridImageActivity.this, ShowImageActivity.class);
String url = URLs[position];
intent.putExtra("URL", url);
startActivity(intent);
}
@Override
public void onItemLongClick(View view, int position) {
Toast.makeText(RecyclerViewGridImageActivity.this, "长按事件", Toast.LENGTH_SHORT).show();
}
});
}
}
myrecyclerviw_layout:
public class MyRecyclerViewAdapter extends RecyclerView.Adapter {
private String[] URLs;
private LayoutInflater mInflater;
private List mHeights;
private Context mContext;
public interface OnItemClickLitener
{
void onItemClick(View view, int position);
void onItemLongClick(View view , int position);
}
private OnItemClickLitener mOnItemClickLitener;
public void setOnItemClickLitener(OnItemClickLitener mOnItemClickLitener)
{
this.mOnItemClickLitener = mOnItemClickLitener;
}
public MyRecyclerViewAdapter(Context context, String[] urls) {
URLs = urls;
mContext = context;
mInflater = LayoutInflater.from(context);
//设置随机高度
mHeights = new ArrayList();
for (int i = 0; i < URLs.length; i++) {
mHeights.add((int) (100 + Math.random() * 300));
}
}
@Override
public MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
MyViewHolder holder = new MyViewHolder(mInflater.inflate(
R.layout.recyclerview_item, parent, false));
return holder;
}
@Override
public void onBindViewHolder(final MyViewHolder holder, final int position) {
//设置随机高度
ViewGroup.LayoutParams lp = holder.imageView.getLayoutParams();
lp.height = mHeights.get(position);
holder.imageView.setLayoutParams(lp);
Glide.with(mContext)
.load(URLs[position])
.centerCrop()
.placeholder(R.mipmap.ic_launcher)
.diskCacheStrategy(DiskCacheStrategy.ALL)
.into(holder.imageView);
// 如果设置了回调,则设置点击事件
if (mOnItemClickLitener != null)
{
holder.itemView.setOnClickListener(new OnClickListener()
{
@Override
public void onClick(View v)
{
int pos = holder.getLayoutPosition();
mOnItemClickLitener.onItemClick(holder.itemView, pos);
}
});
holder.itemView.setOnLongClickListener(new OnLongClickListener()
{
@Override
public boolean onLongClick(View v)
{
int pos = holder.getLayoutPosition();
mOnItemClickLitener.onItemLongClick(holder.itemView, pos);
// removeData(pos);
return false;
}
});
}
}
@Override
public int getItemCount() {
return URLs.length;
}
// public void addData(int position)
// {
// mDatas.add(position, "Insert One");
// notifyItemInserted(position);
// }
//
//
public void removeData(int position)
{
// mDatas.remove(position);//List或ArrayList才有添加移除方法
notifyItemRemoved(position);
}
class MyViewHolder extends ViewHolder {
ImageView imageView;
public MyViewHolder(View view) {
super(view);
imageView = (ImageView) view.findViewById(R.id.id_num);
}
}
}
recyclerview_item:
点击某张图片进入的Activity:
public class ShowImageActivity extends Activity {
private PhotoView mImageView;
private ProgressBar mProgressBar;
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.photoview_layout);
mImageView = (PhotoView) findViewById(R.id.iv_photo);
mProgressBar = (ProgressBar) findViewById(R.id.photoview_progressbar);
Intent intent = getIntent();
if (intent != null) {
String url = intent.getStringExtra("URL");
Glide.with(this)
.load(url)
.listener(new RequestListener() {
@Override
public boolean onException(Exception e, String s, Target target, boolean b) {
return false;
}
@Override
public boolean onResourceReady(GlideDrawable glideDrawable, String s, Target target, boolean b, boolean b1) {
mProgressBar.setVisibility(View.GONE);
return false;
}
})
.diskCacheStrategy(DiskCacheStrategy.ALL)
.into(mImageView);
}
mImageView.setOnPhotoTapListener(new PhotoViewAttacher.OnPhotoTapListener() {
@Override
public void onPhotoTap(View view, float x, float y) {
finish();
}
});
}
}
photoview_layout:
需要下载最新版的glide-3.6.1.jar
需要下载PhotoView第三方源码,然后导入它的library,如上图;