LazyImageLoading 到 RecyclerView + 将 LoadedImages 保存到数据库

LazyImageLoading into RecyclerView + saving LoadedImages to database

问题如问题标题所述。事实上,我想将我在记录中有 url 的图像加载到 RecyclerView 中,同时将下载的图像保存到数据库中。我正在使用 realm.ioGlide,我的 RecyclerViewAdapter 如下:

@Override
public void onBindViewHolder(MyViewHolder holder, int position) {
    final ProductModel obj = getData().get(position);
    holder.data = obj;
    holder.title.setText(obj.getTitle());
    if (obj.getImage() == null) {

        Glide
            .with(context)
            .load(obj.getImageUrl())
            .fitCenter()
            .placeholder(R.drawable.bronteel_logo)
            .into(new GlideDrawableImageViewTarget(holder.icon) {
            @Override
            protected void setResource(GlideDrawable resource) {
                // this.getView().setImageDrawable(resource); is about to be called
                super.setResource(resource);
                // here you can be sure it's already set
                ((ProductsFragment) mFragment).saveImage(obj, resource);
            }
        });

    } else {
        byte[] data = obj.getImage();
        BitmapFactory.Options options = new BitmapFactory.Options();
        options.inMutable = true;
        Bitmap bmp = BitmapFactory.decodeByteArray(data, 0, data.length, options);
        holder.icon.setImageBitmap(bmp);
    }
}

class MyViewHolder extends RecyclerView.ViewHolder implements View.OnClickListener {
    public TextView title;
    public ImageView icon;
    public ProductModel data;

    public MyViewHolder(View view) {
        super(view);
        title = (TextView) view.findViewById(R.id.textView);
        icon = (ImageView) view.findViewById(R.id.imageView);

        view.setOnClickListener(this);
    }

    @Override
    public void onClick(View view) {
        if (data.getImage() != null)
            activity.startActivity(new Intent(activity, ProductActivity.class).putExtra("id", data.getId()));
    }
}

这是我保存图片的方式:

public void saveImage(final ProductModel data, Drawable drw) {
    new AsyncImagePersister(data).execute(drw);
}

private class AsyncImagePersister extends AsyncTask<Drawable, Void, byte[]> {
        private final ProductModel data;
        AsyncImagePersister(ProductModel data) {
            this.data = data;
        }

        @Override
        protected byte[] doInBackground(Drawable... drawables) {
            ByteArrayOutputStream stream = new ByteArrayOutputStream();
            Bitmap bmp = drawableToBitmap(drawables[0]);
            bmp.compress(Bitmap.CompressFormat.PNG, 100, stream);
            return stream.toByteArray();
        }

        @Override
        protected void onPostExecute(final byte[] bytes) {
            super.onPostExecute(bytes);
            realm.executeTransaction(new Realm.Transaction() {
                @Override
                public void execute(Realm realm) {
                    data.setImage(bytes);
                }
            });
        }

        public Bitmap drawableToBitmap (Drawable drawable) {
            Bitmap bitmap = null;

            if (drawable instanceof BitmapDrawable) {
                BitmapDrawable bitmapDrawable = (BitmapDrawable) drawable;
                if(bitmapDrawable.getBitmap() != null) {
                    return bitmapDrawable.getBitmap();
                }
            }

            if(drawable.getIntrinsicWidth() <= 0 || drawable.getIntrinsicHeight() <= 0) {
                bitmap = Bitmap.createBitmap(1, 1, Bitmap.Config.ARGB_8888); // Single color bitmap will be created of 1x1 pixel
            } else {
                bitmap = Bitmap.createBitmap(drawable.getIntrinsicWidth(), drawable.getIntrinsicHeight(), Bitmap.Config.ARGB_8888);
            }

            Canvas canvas = new Canvas(bitmap);
            drawable.setBounds(0, 0, canvas.getWidth(), canvas.getHeight());
            drawable.draw(canvas);
            return bitmap;
        }
    }

但是,当第一次从互联网(使用 Glide)加载图像时,它会在不同的地方显示错误的图片,另一方面,在它获取所有图像后,保存到领域的图像位于正确的位置。

那我做错了什么?请帮忙。谢谢。

当您为此目的使用 Glide 时,您实际上不必将加载的图像保存在数据库中。 Glide 会自动高效地缓存一次加载的图片。缓存是一个复杂的系统,如果你想阅读更多关于 Glide 缓存的内容,你可以看看 here

现在,关于图像加载错误的地方 - 这不应该发生。我在你的 onBindViewHolder 中没有发现严重的错误,但因此我建议你不要在本地保存图像,你可以考虑像这样简单地使用 Glide 加载图像。

Glide
    .with(context)
    .load(obj.getImageUrl())
    .fitCenter()
    .placeholder(R.drawable.bronteel_logo)
    .into(holder.icon);

您只需要确定 obj.getImageUrl() 是否正确返回 url。

图片错位是由于视图正在回收,所以加载的位图不一定属于当前位置,另外需要考虑的是在a中使用AsyncTask RecyclerView 效果不佳,会导致 UI 延迟,最后一点,在模型中保存 byte[] 数组可能会导致 OOM 异常!

如果您想在适配器中执行一些较长的 运行 任务,请考虑使用 ServiceIntentServiceThreadHandler,所以你将一个一个地发送任务,然后一个一个地排队和执行。

关于离线访问图像: 一种选择是使用 Glide.diskCacheStrategy 方法并使用 DiskCacheStrategy.ALL 以便缓存原始图像大小,您可以使用稍后在离线模式下

第二个选项是使用 Picasso 而不是 Glide! 这样您就可以使用自定义 RequestHandler 并下载图像并将其保存在某个地方以便您以后可以访问它,考虑内存管理就在您身边,您应该处理它!

这是对您的第二个选项的提示: 创建从 RequestHandler:

扩展的 class
CustomReqHandler : RequestHandler() {

那么你应该覆盖两个方法:canHandleRequest(), load()

canHandleRequest() 中,您应该确定是否要处理当前请求,因此为这些请求定义一个自定义方案并检查这​​是否是其中之一,例如:

val scheme:String = data.uri.scheme

第二种方法是load(),它在后台线程上执行,return是一个Result对象,下载图像,将其保存在某处,然后 return Result object!