Android使用GridView异步加载（弱引用）网络图片（支持点击查看）

最新推荐文章于 2021-11-02 12:07:45 发布

谁抢我的小口口

最新推荐文章于 2021-11-02 12:07:45 发布

阅读量1.4k

点赞数 1

分类专栏： gridview加载网络图片

本文链接：https://blog.csdn.net/qq_35840038/article/details/78782030

版权

gridview加载网络图片专栏收录该内容

0 篇文章 0 订阅

订阅专栏

Android使用GridView异步加载（弱引用）网络图片（支持点击查看）

在现在的Android开发中，越来越多的app都使用了Android的相册功能，使用相册就会用到GridView去加载图片，但是加载大量的图片的时候，会因为加载过程缓慢从而出现黑屏，而且因为图片越来越多从而引发出OOM的问题。这种情况就需要使用线程去异步加载图片并显示。

先看效果图：
这里写图片描述

**
一个GridView控件
适配器
一个异步加载的自定义类
一个加载原图片的dialog
**

activity_mail.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="activity.cc.com.demo014.MainActivity"
    android:orientation="vertical">

    <GridView
        android:id="@+id/gridview"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:numColumns="3"/>

</LinearLayout>

注：只包含一个GridView控件

MainActivity.java:

@Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        requestWindowFeature(Window.FEATURE_NO_TITLE);
        setContentView(R.layout.activity_main);

        //获取控件并实现点击事件
        gridView = (GridView) findViewById(R.id.gridview);
        gridView.setOnItemClickListener(this);

        //getDatas方法是填充datas数据
        getDatas();


        //使用adapter填充数据
        gridViewAdapter = new GridViewAdapter(this, datas, gridView);
        gridView.setAdapter(gridViewAdapter);

    }

GridViewAdapter.java:

package activity.cc.com.demo014;

import android.app.Activity;
import android.graphics.Bitmap;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.GridView;
import android.widget.ImageView;
import android.widget.TextView;

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

/**
 * Created by admin on 2017/12/11.
 */

public class GridViewAdapter extends BaseAdapter {

    List<GridViewData> datas = new ArrayList<GridViewData>();

    GridView gridview;

    Activity activity;

    LayoutInflater inflater;

    AsyncImageLoader asyncImageLoader;

    /**
     * 实例化adapter并接收传递的数据
     * @param activity
     * @param datas
     * @param gridview
     */
    public GridViewAdapter(Activity activity, List<GridViewData> datas, GridView gridview){
        this.activity = activity;
        this.datas = datas;
        this.gridview = gridview;

        //实例化LayoutInflater
        inflater = activity.getLayoutInflater();
        //实例化异步加载图片的类
        asyncImageLoader = new AsyncImageLoader();
    }

    /**
     * 这个方法是显示的图片的个数
     * @return 取决于datas的大小
     */
    @Override
    public int getCount() {
        return datas.size();
    }

    /**
     * 获取每一个item的数据
     * @param position
     * @return
     */
    @Override
    public GridViewData getItem(int position) {
        return datas.get(position);
    }

    /**
     * getItemId
     * @param position
     * @return
     */
    @Override
    public long getItemId(int position) {
        return position;
    }

    /**
     * 每加载一次系统调用一次
     * @param position
     * @param convertView
     * @param parent
     * @return
     */
    @Override
    public View getView(int position, View convertView, ViewGroup parent) {

        //当回收的view为空，重新获取
        if(convertView == null){
            convertView = inflater.inflate(R.layout.gridview_item, null);
        }
        convertView.setTag(position);
        //拿到每一个item的值
        GridViewData info = getItem(position);

        //使用异步加载图片的类加载图片并实现回调
        asyncImageLoader.loadDrawable(position, info.img_url, new AsyncImageLoader.ImageCallback() {
            @Override
            public void onImageLoad(Integer t, Bitmap bitmap) {
                View view = gridview.findViewWithTag(t);
                if(view != null){
                    Log.i("TAG", "加载成功...");
                    ImageView img_url = view.findViewById(R.id.img_url);
                    img_url.setImageBitmap(bitmap);
                }
            }

            @Override
            public void onError(Integer t) {
                View view = gridview.findViewWithTag(t);
                if(view != null){
                    Log.i("TAG", "加载失败...");
                    ImageView img_url = view.findViewById(R.id.img_url);
                    //加载中或者加载失败，默认加载app图标
                    img_url.setBackgroundResource(R.mipmap.ic_launcher);
                }
            }
        });

        TextView txt_name = convertView.findViewById(R.id.txt_name);
        txt_name.setText(info.name);

        return convertView;
    }
}

GridViewData.java:

package activity.cc.com.demo014;

/**
 * Created by admin on 2017/12/11.
 */

public class GridViewData {

    public GridViewData(String img_url, String name){
        this.img_url = img_url;
        this.name = name;
    }

    public String img_url, name;

    public String getImg_url() {
        return img_url;
    }

    public void setImg_url(String img_url) {
        this.img_url = img_url;
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    @Override
    public String toString() {
        return "GridViewData{" +
                "img_url='" + img_url + '\'' +
                ", name='" + name + '\'' +
                '}';
    }
}

注：注意属性值是public。到这里图片的异步加载就结束了。下来就是单击图片实现查看原图。

MainActivity.java:

@Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
    Log.i("TAG", "" + position);
    showImageDialog(position);
}

private void showImageDialog(int position) {
    //弹出友好提示框，提示用户确认注销？
    new CommomDialog(this, position, R.style.dialog, datas.get(position).getImg_url(), new CommomDialog.OnCloseListener() {
        @Override
        public void onClick(Dialog dialog, boolean confirm) {
            if(confirm){
                dialog.dismiss();
            }
        }
    }).setTitle(datas.get(position).getName()).show();
}

CommomDialog.java:

package activity.cc.com.demo014;

import android.app.Dialog;
import android.content.Context;
import android.graphics.Bitmap;
import android.os.Bundle;
import android.text.TextUtils;
import android.util.Log;
import android.view.View;
import android.widget.ImageView;
import android.widget.TextView;

/**
 * 封装的dialog
 */
public class CommomDialog extends Dialog implements View.OnClickListener {

    private TextView textview_name;
    private ImageView image_url;

    private Context mContext;
    private String img_url;
    private OnCloseListener listener;
    private String positiveName;
    private String negativeName;
    private String title;

    int position;

    AsyncImageLoader asyncImageLoader;

    public CommomDialog(Context context) {
        super(context);
        this.mContext = context;
    }

    public CommomDialog(Context context, int themeResId, String img_url) {
        super(context, themeResId);
        this.mContext = context;
        this.img_url = img_url;
    }

    public CommomDialog(Context context, int position, int themeResId, String img_url, OnCloseListener listener) {
        super(context, themeResId);
        this.mContext = context;
        this.position = position;
        this.img_url = img_url;
        this.listener = listener;

        asyncImageLoader = new AsyncImageLoader();
    }

    protected CommomDialog(Context context, boolean cancelable, OnCancelListener cancelListener) {
        super(context, cancelable, cancelListener);
        this.mContext = context;
    }

    public CommomDialog setTitle(String title){
        this.title = title;
        return this;
    }

    public CommomDialog setPositiveButton(String name){
        this.positiveName = name;
        return this;
    }

    public CommomDialog setNegativeButton(String name){
        this.negativeName = name;
        return this;
    }

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.imgae_view);
        setCanceledOnTouchOutside(false);
        initView();
        initData();
    }

    private void initData() {
        asyncImageLoader.loadDrawable(position, img_url, new AsyncImageLoader.ImageCallback() {
            @Override
            public void onImageLoad(Integer t, Bitmap bitmap) {
                image_url.setImageBitmap(bitmap);
            }

            @Override
            public void onError(Integer t) {
                image_url.setBackgroundResource(R.mipmap.ic_launcher);
            }
        });

        textview_name.setText(title);
    }

    private void initView(){
        image_url = findViewById(R.id.image_url);
        textview_name = findViewById(R.id.textview_name);

        image_url.setOnClickListener(this);
    }

    @Override
    public void onClick(View v) {
        int temdId = v.getId();
        if(temdId == R.id.image_url){
            dismiss();
        }
//        switch (v.getId()){
//            case R.id.cancel:
//                if(listener != null){
//                    listener.onClick(this, false);
//                }
//                this.dismiss();
//                break;
//            case R.id.submit:
//                if(listener != null){
//                    listener.onClick(this, true);
//                }
//                break;
//        }
    }

    public interface OnCloseListener{
        void onClick(Dialog dialog, boolean confirm);
    }
}

imgae_view.xml

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

    <TextView
        android:id="@+id/textview_name"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:text="TextView"
        android:textColor="#000000" />

    <ImageView
        android:id="@+id/image_url"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:srcCompat="@mipmap/ic_launcher" />

</LinearLayout>

注：至此为止，功能就已经实现了。

优化：这里显示的图片是按照原尺寸显示的，如果需要固定大小并且充满布局，在ImageView控件上加上android:scaleType=”fitXY”这行代码就好。

GAME OVER！！！

点击下载源代码

CSDN貌似没有了免费下载资源的选项。所以，如果需要源代码又没有积分请留言…

谁抢我的小口口

关注

1
点赞
踩
6

收藏

觉得还不错? 一键收藏
打赏
0
评论
Android使用GridView异步加载（弱引用）网络图片（支持点击查看）

Android使用GridView异步加载（弱引用）网络图片（支持点击查看）在现在的Android开发中，越来越多的app都使用了Android的相册功能，使用相册就会用到GridView去加载图片，但是加载大量的图片的时候，会因为加载过程缓慢从而出现黑屏，而且因为图片越来越多从而引发出OOM的问题。这种情况就需要使用线程去异步加载图片并显示。先看效果图： **一个GridView控件适配器
复制链接

扫一扫