我如何从云存储中下载类似Whatsapp的图像

Question

我想从云存储中下载类似WhatsApp的图像，就像当用户在Recyclerview中时，他看到的图像质量低下，但是当他单击图像时，它以全分辨率下载时，当前我正在使用滑行库下载图像。

当前我正在做的是，但是它以完整分辨率下载图像到recyclerview中。

 if (user.getImageURL().equals("default")) {
                profile_image.setImageResource(R.drawable.user2);
            } else {
                //and this
                Glide.with(getApplicationContext()).load(user.getImageURL()).into(profile_image);
            }

Answer 1

使用Glide中的CustomTarget传递图像视图的尺寸，以便Glide可以将图像缩小到指定的大小。

Glide.with(this)
    .load(IMAGE_URL)
    .into(object : CustomTarget<Drawable>(targetImageWidth, targetImageHeight) {
        override fun onLoadCleared(placeholder: Drawable?) {
            // called when imageView is cleared. If you are referencing the bitmap 
            // somewhere else too other than this imageView clear it here
        }

        override fun onResourceReady(resource: Drawable, transition: Transition<in Drawable>?) {
            image.setImageDrawable(resource)
        }
    })

但是，如果您只知道目标容器的一个尺寸而又不知道图像的长宽比，该怎么办？您是否被迫使用原始图像尺寸？事实证明，可能有解决此问题的方法。在这种情况下，只需将您不知道的其他尺寸设置为1，Glide会自动按比例缩小图像。
imageView.viewTreeObserver.addOnGlobalLayoutListener {
    Glide.with(this)
            .load(TargetActivity.IMAGE_URL)
            .into(object : CustomTarget<Drawable>(imageView.width, 1) {
                // imageView width is 1080, height is set to wrap_content
                override fun onLoadCleared(placeholder: Drawable?) {
                    // clear resources
                }

                override fun onResourceReady(resource: Drawable, transition: Transition<in Drawable>?) {
                    // bitmap will have size 1080 x 805 (original: 1571 x 1171)
                    imageView.setImageDrawable(resource)
                }
            })
}

Answer 2

最简单的方法是，每当用户上传图像并首先显示低质量图像时，就创建该图像的低质量版本。

1. 在上载时创建Firebase云功能触发器，它将获取上载的文件并创建其低质量版本并将其上载到存储。为此提供了一个官方样本here
2. 仅将低质量图像加载到recyclerview中的图像中。当用户点击图像时，将其全屏显示，并使用滑行来加载完整图像，并设置滑行的缩略图选项来加载低质量图像，直到从互联网加载完整图像为止。使用Glide 4.11，它将看起来像这样-

Glide.with(view)
  .load(fullImageReference)
  .thumbnail(
     Glide.with(view)
          .load(lowImageReference)
  .into(imageView)