您的位置:首页 > 理论基础 > 计算机网络

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

2017-12-12 17:14 591 查看

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);

}


GridVi
4000
ewAdapter.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
a146
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貌似没有了免费下载资源的选项。所以,如果需要源代码又没有积分请留言…
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: 
相关文章推荐