Glide和RecyclerView异步下载

最新推荐文章于 2024-02-27 21:27:15 发布

原创最新推荐文章于 2024-02-27 21:27:15 发布 · 584 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#android

android 学习专栏收录该内容

230 篇文章

订阅专栏

本文介绍如何利用Glide框架在RecyclerView中进行异步图片下载，避免图片错乱现象。通过添加依赖、注册权限、设置数据源、主界面及适配器的实现，展示了一个简洁的解决方案。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

说明，大家以后碰到那种异步下载图片，listview和recycleview东西的时候，尽量用框架来进行图片下载，这样不会错乱，可以解决图片错乱问题

效果图：

1.添加依赖：

implementation 'com.github.bumptech.glide:glide:4.8.0'

2.清单文件注册权限：

<uses-permission android:name="android.permission.INTERNET" />

3.图片数组类，这个项目中需要从json解析获得，我们这里直接写成本地的

public class ImageUrl {

    public final static String[] URLS = new String[]{
            "http://img5.imgtn.bdimg.com/it/u=3145007504,1640049631&fm=26&gp=0.jpg",
            "http://img1.imgtn.bdimg.com/it/u=3685953603,2625433640&fm=26&gp=0.jpg",
            "http://img0.imgtn.bdimg.com/it/u=800343242,3353694310&fm=26&gp=0.jpg",
            "http://img2.imgtn.bdimg.com/it/u=1153634257,3514236209&fm=26&gp=0.jpg",
            "http://img1.imgtn.bdimg.com/it/u=3180500984,3436556865&fm=26&gp=0.jpg",
            "http://img2.imgtn.bdimg.com/it/u=51838034,1216139298&fm=26&gp=0.jpg",
            "http://img1.imgtn.bdimg.com/it/u=4049594896,766281637&fm=26&gp=0.jpg",
            "http://img0.imgtn.bdimg.com/it/u=4263687427,893555643&fm=26&gp=0.jpg"
    };

}

4.主界面：

package com.example.administrator.testz;


import android.annotation.SuppressLint;
import android.app.Activity;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.os.Bundle;
import android.support.v7.widget.DefaultItemAnimator;
import android.support.v7.widget.GridLayoutManager;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.OrientationHelper;
import android.support.v7.widget.RecyclerView;
import android.widget.Toast;

import java.util.ArrayList;
import java.util.List;

public class TwoActivity extends Activity {
    //参考网址   https://blog.youkuaiyun.com/dmk877/article/details/50816933
    private RecyclerView recyclerView;
    private MyRecyclerAdapter recycleAdapter;

    @SuppressLint("NewApi")
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_two);

        recyclerView = (RecyclerView) findViewById(R.id.recy_list);
        recycleAdapter = new MyRecyclerAdapter(TwoActivity.this);


        LinearLayoutManager layoutManager = new LinearLayoutManager(this);
        //设置布局管理器
        recyclerView.setLayoutManager(new GridLayoutManager(this, 3));
        //设置为垂直布局，这也是默认的
        layoutManager.setOrientation(OrientationHelper.VERTICAL);
        //设置Adapter
        recyclerView.setAdapter(recycleAdapter);
        //设置增加或删除条目的动画
        recyclerView.setItemAnimator(new DefaultItemAnimator());

        recycleAdapter.setOnItemClickListener(new MyRecyclerAdapter.OnItemClickListener() {

            @Override
            public void onLongClick(int position) {
                Toast.makeText(TwoActivity.this, "onLongClick事件您点击了第：" + position + "个Item", Toast.LENGTH_SHORT).show();
            }

            @Override
            public void onClick(int position) {
                Toast.makeText(TwoActivity.this, "onClick事件您点击了第：" + position + "个Item", Toast.LENGTH_SHORT).show();
            }
        });

    }


}

5.适配器，主要的下载图片代码，位于这个地方，但是我们用了glide，所以下载图片只有一句代码

package com.example.administrator.testz;

import android.content.Context;
import android.graphics.Bitmap;
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;

import com.bumptech.glide.Glide;

import java.util.List;

/**
 * Created by wrs on 2019/5/28,18:38
 * projectName: Testz
 * packageName: com.example.administrator.testz
 */

public class MyRecyclerAdapter extends RecyclerView.Adapter<MyRecyclerAdapter.MyViewHolder> {
    private OnItemClickListener mOnItemClickListener;
    private Context mContext;
    private LayoutInflater inflater;

    public MyRecyclerAdapter(Context context) {
        this.mContext = context;
        inflater = LayoutInflater.from(mContext);
    }

    @Override
    public int getItemCount() {
        return ImageUrl.URLS.length;
    }

    //重写onCreateViewHolder方法，返回一个自定义的ViewHolder
    @Override
    public MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        View view = inflater.inflate(R.layout.item_home, parent, false);
        MyViewHolder holder = new MyViewHolder(view);
        return holder;
    }

    class MyViewHolder extends RecyclerView.ViewHolder {
        ImageView iv;

        public MyViewHolder(View view) {
            super(view);
            iv = (ImageView) view.findViewById(R.id.iv_item_adapter);
        }
    }

    public interface OnItemClickListener {
        void onClick(int position);

        void onLongClick(int position);
    }

    public void setOnItemClickListener(OnItemClickListener onItemClickListener) {
        this.mOnItemClickListener = onItemClickListener;
    }

    //填充onCreateViewHolder方法返回的holder中的控件
    @Override
    public void onBindViewHolder(MyViewHolder holder, final int position) {
//        holder.iv.setImageBitmap(mDatas.get(position));
        Glide.with(mContext).load(ImageUrl.URLS[position]).into(holder.iv);

        if (mOnItemClickListener != null) {
            holder.itemView.setOnClickListener(new View.OnClickListener() {

                @Override
                public void onClick(View v) {
                    mOnItemClickListener.onClick(position);
                }
            });

            holder.itemView.setOnLongClickListener(new View.OnLongClickListener() {
                @Override
                public boolean onLongClick(View v) {
                    mOnItemClickListener.onLongClick(position);
                    return false;
                }
            });
        }
    }
}

看看布局吧，这个例子一共两个布局，都很简单

布局1：主界面

<?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/recy_list"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:dividerHeight="1dp" />

</LinearLayout>

布局2：item布局

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="150dp">

    <ImageView
        android:id="@+id/iv_item_adapter"
        android:layout_width="120dp"
        android:layout_height="120dp"
        android:scaleType="fitXY"
          />

    <TextView
        android:id="@+id/textView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="TextView" />
</LinearLayout>