Android GridView 实现照片墙功能加载多图

文章内容摘取自
Android照片墙应用实现,再多的图片也不怕崩溃

功能说明

用一个 GridView 控件当作“墙”,然后随着 GridView 的滚动将一张张照片贴在“墙”上,这些照片可以是手机本地中存储的,也可以是从网络上下载的。

疑问

图片资源何时应该释放(如何对图片进行更好的回收)?因为随着 GridView 的滚动,加载的图片可能会越来越多,如果没有一种合理的机制对图片进行释放,那么当图片达到一定上限时,程序就必然会崩溃。

如何防止由于图片过多导致程序崩溃?主要的核心算法就是使用 Android v4 包中提供的 LruCache 类。

示例

PhotoWallAdapter 是整个照片墙程序中最关键的一个类。

public class PhotoWallAdapter extends ArrayAdapter<String> implements OnScrollListener {  

    /** 
     * 记录所有正在下载或等待下载的任务。 
     */  
    private Set<BitmapWorkerTask> taskCollection;  

    /** 
     * 图片缓存技术的核心类,用于缓存所有下载好的图片,在程序内存达到设定值时会将最少最近使用的图片移除掉。 
     */  
    private LruCache<String, Bitmap> mMemoryCache;  

    /** 
     * GridView的实例 
     */  
    private GridView mPhotoWall;  

    /** 
     * 第一张可见图片的下标 
     */  
    private int mFirstVisibleItem;  

    /** 
     * 一屏有多少张图片可见 
     */  
    private int mVisibleItemCount;  

    /** 
     * 记录是否刚打开程序,用于解决进入程序不滚动屏幕,不会下载图片的问题。 
     */  
    private boolean isFirstEnter = true;  

    public PhotoWallAdapter(Context context, int textViewResourceId, String[] objects,  
            GridView photoWall) {  
        super(context, textViewResourceId, objects);  
        mPhotoWall = photoWall;  
        taskCollection = new HashSet<BitmapWorkerTask>();  
        // 获取应用程序最大可用内存  
        int maxMemory = (int) Runtime.getRuntime().maxMemory();  
        int cacheSize = maxMemory / 8;  
        // 设置图片缓存大小为程序最大可用内存的1/8  
        mMemoryCache = new LruCache<String, Bitmap>(cacheSize) {  
            @Override  
            protected int sizeOf(String key, Bitmap bitmap) {  
                return bitmap.getByteCount();  
            }  
        };  
        mPhotoWall.setOnScrollListener(this);  
    }  

    @Override  
    public View getView(int position, View convertView, ViewGroup parent) {  
        final String url = getItem(position);  
        View view;  
        if (convertView == null) {  
            view = LayoutInflater.from(getContext()).inflate(R.layout.photo_layout, null);  
        } else {  
            view = convertView;  
        }  
        final ImageView photo = (ImageView) view.findViewById(R.id.photo);  
        // 给ImageView设置一个Tag,保证异步加载图片时不会乱序  
        photo.setTag(url);  
        setImageView(url, photo);  
        return view;  
    }  

    /** 
     * 给ImageView设置图片。首先从LruCache中取出图片的缓存,设置到ImageView上。如果LruCache中没有该图片的缓存, 
     * 就给ImageView设置一张默认图片。 
     *  
     * @param imageUrl 
     *            图片的URL地址,用于作为LruCache的键。 
     * @param imageView 
     *            用于显示图片的控件。 
     */  
    private void setImageView(String imageUrl, ImageView imageView) {  
        Bitmap bitmap = getBitmapFromMemoryCache(imageUrl);  
        if (bitmap != null) {  
            imageView.setImageBitmap(bitmap);  
        } else {  
            imageView.setImageResource(R.drawable.empty_photo);  
        }  
    }  

    /** 
     * 将一张图片存储到LruCache中。 
     *  
     * @param key 
     *            LruCache的键,这里传入图片的URL地址。 
     * @param bitmap 
     *            LruCache的键,这里传入从网络上下载的Bitmap对象。 
     */  
    public void addBitmapToMemoryCache(String key, Bitmap bitmap) {  
        if (getBitmapFromMemoryCache(key) == null) {  
            mMemoryCache.put(key, bitmap);  
        }  
    }  

    /** 
     * 从LruCache中获取一张图片,如果不存在就返回null。 
     *  
     * @param key 
     *            LruCache的键,这里传入图片的URL地址。 
     * @return 对应传入键的Bitmap对象,或者null。 
     */  
    public Bitmap getBitmapFromMemoryCache(String key) {  
        return mMemoryCache.get(key);  
    }  

    @Override  
    public void onScrollStateChanged(AbsListView view, int scrollState) {  
        // 仅当GridView静止时才去下载图片,GridView滑动时取消所有正在下载的任务  
        if (scrollState == SCROLL_STATE_IDLE) {  
            loadBitmaps(mFirstVisibleItem, mVisibleItemCount);  
        } else {  
            cancelAllTasks();  
        }  
    }  

    @Override  
    public void onScroll(AbsListView view, int firstVisibleItem, int visibleItemCount,  
            int totalItemCount) {  
        mFirstVisibleItem = firstVisibleItem;  
        mVisibleItemCount = visibleItemCount;  
        // 下载的任务应该由onScrollStateChanged里调用,但首次进入程序时onScrollStateChanged并不会调用,  
        // 因此在这里为首次进入程序开启下载任务。  
        if (isFirstEnter && visibleItemCount > 0) {  
            loadBitmaps(firstVisibleItem, visibleItemCount);  
            isFirstEnter = false;  
        }  
    }  

    /** 
     * 加载Bitmap对象。此方法会在LruCache中检查所有屏幕中可见的ImageView的Bitmap对象, 
     * 如果发现任何一个ImageView的Bitmap对象不在缓存中,就会开启异步线程去下载图片。 
     *  
     * @param firstVisibleItem 
     *            第一个可见的ImageView的下标 
     * @param visibleItemCount 
     *            屏幕中总共可见的元素数 
     */  
    private void loadBitmaps(int firstVisibleItem, int visibleItemCount) {  
        try {  
            for (int i = firstVisibleItem; i < firstVisibleItem + visibleItemCount; i++) {  
                String imageUrl = Images.imageThumbUrls[i];  
                Bitmap bitmap = getBitmapFromMemoryCache(imageUrl);  
                if (bitmap == null) {  
                    BitmapWorkerTask task = new BitmapWorkerTask();  
                    taskCollection.add(task);  
                    task.execute(imageUrl);  
                } else {  
                    ImageView imageView = (ImageView) mPhotoWall.findViewWithTag(imageUrl);  
                    if (imageView != null && bitmap != null) {  
                        imageView.setImageBitmap(bitmap);  
                    }  
                }  
            }  
        } catch (Exception e) {  
            e.printStackTrace();  
        }  
    }  

    /** 
     * 取消所有正在下载或等待下载的任务。 
     */  
    public void cancelAllTasks() {  
        if (taskCollection != null) {  
            for (BitmapWorkerTask task : taskCollection) {  
                task.cancel(false);  
            }  
        }  
    }  

    /** 
     * 异步下载图片的任务。 
     *  
     * @author guolin 
     */  
    class BitmapWorkerTask extends AsyncTask<String, Void, Bitmap> {  

        /** 
         * 图片的URL地址 
         */  
        private String imageUrl;  

        @Override  
        protected Bitmap doInBackground(String... params) {  
            imageUrl = params[0];  
            // 在后台开始下载图片  
            Bitmap bitmap = downloadBitmap(params[0]);  
            if (bitmap != null) {  
                // 图片下载完成后缓存到LrcCache中  
                addBitmapToMemoryCache(params[0], bitmap);  
            }  
            return bitmap;  
        }  

        @Override  
        protected void onPostExecute(Bitmap bitmap) {  
            super.onPostExecute(bitmap);  
            // 根据Tag找到相应的ImageView控件,将下载好的图片显示出来。  
            ImageView imageView = (ImageView) mPhotoWall.findViewWithTag(imageUrl);  
            if (imageView != null && bitmap != null) {  
                imageView.setImageBitmap(bitmap);  
            }  
            taskCollection.remove(this);  
        }  

        /** 
         * 建立HTTP请求,并获取Bitmap对象。 
         *  
         * @param imageUrl 
         *            图片的URL地址 
         * @return 解析后的Bitmap对象 
         */  
        private Bitmap downloadBitmap(String imageUrl) {  
            Bitmap bitmap = null;  
            HttpURLConnection con = null;  
            try {  
                URL url = new URL(imageUrl);  
                con = (HttpURLConnection) url.openConnection();  
                con.setConnectTimeout(5 * 1000);  
                con.setReadTimeout(10 * 1000);  
                bitmap = BitmapFactory.decodeStream(con.getInputStream());  
            } catch (Exception e) {  
                e.printStackTrace();  
            } finally {  
                if (con != null) {  
                    con.disconnect();  
                }  
            }  
            return bitmap;  
        }  
    }  
} 

首先在 PhotoWallAdapter 的构造函数中,初始化 LruCache 类,并设置其最大缓存容量为程序最大可用内存的1/8,接着为 GrildView 注册一个滚动监听器。

public MyAdapter(@NonNull Context context, int resource, @NonNull String[] objects,
                     GridView photoWall) {
        super(context, resource, objects);
        ...
        mPhotoWall = photoWall;
        // 获得应用程序最大可用内存
        int maxMemory = (int) Runtime.getRuntime().maxMemory();
        int cacheSize = maxMemory / 8;
        // 设置图片缓存大小为程序最大可用内存的 1/8
        mLruCache = new LruCache<String, Bitmap>(cacheSize) {
            @Override
            protected int sizeOf(String key, Bitmap value) {
                return value.getByteCount();
            }
        };
        mPhotoWall.setOnScrollListener(this);
    }

然后在 getView() 方法中,为每个 ImageView 设置一个唯一的 Tag,这个 Tag 的作用是为了后面能够准确精准地找回这个 ImageView,防止异步加载图片时由于 convertView 复用机制导致出现乱序。

@Override
    public View getView(int position, @Nullable View convertView, @NonNull ViewGroup parent) {
        final String url = getItem(position);
        View view;
        if (convertView == null) {
            view = LayoutInflater.from(getContext()).inflate(R.layout.item_photo_layout, parent);
        } else {
            view = convertView;
        }
        final ImageView photo = view.findViewById(R.id.photo);
        // 给 ImageView 设置一个 Tag,防止异步加载图片乱序
        photo.setTag(url);
        setImageView(url, photo);
        return view;
    }

之后调用 setImageView() 方法为 ImageView 设置一张图片,这个方法首先会从 LruCache 缓存中查找是否已经缓存了这张图片,如果成功找到则将缓存中的图片显示在 ImageView 上,否则就显示一张默认的空图片。

private void setImageView(String imgUrl, ImageView imageView) {
        // 从缓存中查找图片,如果成功找到则将图片显示在 ImageView 上,否则显示一张默认的空图片
        Bitmap bitmap = getBitmapFromLurCache(imgUrl);
        if (bitmap != null) {
            imageView.setImageBitmap(bitmap);
        } else {
            imageView.setImageResource(R.drawable.empty_photo_name);
        }
    }

    // 从缓存中查找图片
    private Bitmap getBitmapFromLurCache(String url) {
        return mLruCache.get(url);
    }

下载图片在 GridView 的滚动监听器中进行。在 onScrollStateChanged() 方法中,我们对 GridView 的状态进行判断,如果当前 GridView 是静止的,则调用 loadBitmaps() 方法去下载图片。如果 GridView 正在滚动,则取消掉所有下载任务,这样可以保证 GridView 滚动的流畅性。

 @Override
    public void onScrollStateChanged(AbsListView view, int scrollState) {
        // 仅当 GridView 静止时才去下载图片,GridView 滑动时取消所有正在下载的任务
        if (scrollState == SCROLL_STATE_IDLE) {
            loadBitmaps(mFirstVisibleItem, mVisibleItemCount);
        } else {
            cancelAllTask();
        }
    }

loadBitmaps() 方法会在 LruCache 中检查屏幕中所有可见的 ImageView 的 Bitmap 对象,如果发现任何一个 ImageView 的 Bitmap 对象不存在缓存中,就会开启异步线程去下载图片。

private void loadBitmaps(int firstVisibleItem, int visibleItemCount) {
        for (int i = firstVisibleItem; i < firstVisibleItem + visibleItemCount; i++) {
            String imageUrl = Images.imageThumbUrls[i];
            Bitmap bitmap = getBitmapFromMemoryCache(imageUrl);
            if (bitmap == null) {
                BitmapWorkerTask task = new BitmapWorkerTask();
                taskCollection.add(task);
                task.execute(imageUrl);
            } else {
                ImageView imageView = mPhotoWall.findViewWithTag(imageUrl);
                if (imageView != null && bitmap != null) {
                    imageView.setImageBitmap(bitmap);
                }
            }
        }
    }

由于我们使用了 LruCache 来缓存图片,所以不需要担心内存溢出的情况,当 LruCache 中存储图片的总大小达到容量上限的时候,会自动把最近最少使用的图片从缓存中移除。

在实际项目中还会配合适当的本地缓存来达到更好的展示效果。

文章只是作为个人记录学习使用,如有不妥之处请指正,谢谢。

文章内容摘取自
Android照片墙应用实现,再多的图片也不怕崩溃

猜你喜欢

转载自blog.csdn.net/modurookie/article/details/80292292