RecyclerView+Glide+PhotoView

最新推荐文章于 2024-04-19 00:01:35 发布

雨田先生0502

最新推荐文章于 2024-04-19 00:01:35 发布

阅读量5.7k

点赞数 3

分类专栏： android

本文链接：https://blog.csdn.net/huanglei201502/article/details/49178501

版权

android 专栏收录该内容

113 篇文章 0 订阅

订阅专栏

<span style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255);">RecyclerView是谷歌最新的代替ListView和GridView一款超赞控件，可以随意变成ListView,GridView,和瀑布流的样式，也许是才出来不久，苦恼的是它的监听事件有点麻烦，需要自己动手重写方法，后面代码里会体现出来。Glide是一款高效图片处理的第三包，比较其他的图片处理第三方包要高效，好用很多，自己可以上网查查了解了解。PhotoView是一款支持放大缩小图片浏览的第三方包，用法都很简单。</span>

先看看效果图：

主界面的瀑布流照片墙：

然后点击某一张图片，进入大图：

然后两点手势缩放图片，最后点击图片，退回到原图

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：

<?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:orientation="vertical">

    <android.support.v7.widget.RecyclerView
        android:id="@+id/myrecycler_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

    </android.support.v7.widget.RecyclerView>
</LinearLayout>

Adapter代码：

public  class MyRecyclerViewAdapter extends RecyclerView.Adapter<MyRecyclerViewAdapter.MyViewHolder> {

    private String[] URLs;
    private LayoutInflater mInflater;
    private List<Integer> 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<Integer>();
        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：

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="3dp">
    <ImageView
        android:id="@+id/id_num"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:scaleType="centerCrop"/>
</FrameLayout>
点击某张图片进入的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<String, GlideDrawable>() {
                        @Override
                        public boolean onException(Exception e, String s, Target<GlideDrawable> target, boolean b) {

                            return false;
                        }

                        @Override
                        public boolean onResourceReady(GlideDrawable glideDrawable, String s, Target<GlideDrawable> 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:
<pre name="code" class="html"><?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <uk.co.senab.photoview.PhotoView
        android:id="@+id/iv_photo"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:clickable="true" />

    <ProgressBar
        android:id="@+id/photoview_progressbar"
        style="@android:style/Widget.ProgressBar.Large"
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_gravity="center"
        android:indeterminateDuration="3000"
        />
</FrameLayout>

最后带上我的项目要添加的第三方包：



需要下载最新版的glide-3.6.1.jar

需要下载PhotoView第三方源码，然后导入它的library，如上图；

雨田先生0502

关注

3
点赞
踩
5

收藏

觉得还不错? 一键收藏
2
评论
RecyclerView+Glide+PhotoView

RecyclerView是谷歌最新的代替ListView和GridView一款超赞控件，可以随意变成ListView,GridView,和瀑布流的样式，也许是才出来不久，苦恼的是它的监听事件有点麻烦，需要自己动手重写方法，后面代码里会体现出来。Glide是一款高效图片处理的第三包，比较其他的图片处理第三方包要高效，好用很多，自己可以上网查查了解了解。PhotoView是一款支持放大缩小图片浏览的第
复制链接

扫一扫

专栏目录