Android Glide:在加载实际图像之前显示模糊图像

时间:2016-06-21 12:47:17

标签: android android-glide

我正在开发一款向用户显示全屏图像的Android应用。从服务器获取图像。我正在使用Glide来显示图像。但是我希望在显示实际图像之前显示非常小的模糊图像。缓存图像后,应显示直接完整大小的图像。

图像显示流程如下: - 如果是第一次下载图像,请首先下载小尺寸图像,然后下载全分辨率图像。 - 如果之前已下载过图像,请直接显示全尺寸图像。

我在Glide库中找不到任何方法,它告诉我文件是否存在于缓存中。

任何想法,如何做到这一点。

8 个答案:

答案 0 :(得分:9)

Glide.with(context.getApplicationContext())
                        .load(Your Path)   //passing your url to load image.
                        .override(18, 18)  //just set override like this
                        .error(R.drawable.placeholder)
                        .listener(glide_callback)
                        .animate(R.anim.rotate_backward)
                        .centerCrop()
                        .into(image.score);

答案 1 :(得分:5)

最好你可以从这个库中获取想法或使用这个库。

在Android中使用Blur和Original图像的两种方法。

1)最初加载模糊图像服务器URL路径,并获得成功的位图缓存机制,以加载原始(大)图像服务器URL路径。

第1点是可能的,我得到了你的答案(要求你的服务器团队获得模糊图像或低质量图像使模糊,然后加载大图像)。 APK Link

Glide.with(mContext)
    .load(image.getMedium())
            .asBitmap()
            .diskCacheStrategy(DiskCacheStrategy.ALL)
            .into(new SimpleTarget<Bitmap>() {
                @Override
                public void onResourceReady(Bitmap bitmap, GlideAnimation anim) {
                    // Do something with bitmap here.
                    holder.thumbnail.setImageBitmap(bitmap);
                    Log.e("GalleryAdapter","Glide getMedium ");

                    Glide.with(mContext)
                            .load(image.getLarge())
                            .asBitmap()
                            .diskCacheStrategy(DiskCacheStrategy.ALL)
                            .into(new SimpleTarget<Bitmap>() {
                                @Override
                                public void onResourceReady(Bitmap bitmap, GlideAnimation anim) {
                                    // Do something with bitmap here.
                                    holder.thumbnail.setImageBitmap(bitmap);
                                    Log.e("GalleryAdapter","Glide getLarge ");
                                }
                            });
                }
            });

2)Facebook的Fresco是Android的新图像库。这是介绍图书馆的官方博客文章。它支持通过网络传输渐进式JPEG图像,这对于通过慢速连接显示大图像非常有用。人们可以看到图像的质量逐渐提高。

Progressive JPEGs with Facebook Fresco

答案 2 :(得分:5)

使用Glide v4:

Glide.with(context)
    .load(URL)
    .thumbnail(0.1f)
    .into(image_view)

答案 3 :(得分:1)

glide有一个直接的方法:

val thumbnailRequest = Glide.with(this)
        .load("https://picsum.photos/50/50?image=0")

Glide.with(this)
        .load("https://picsum.photos/2000/2000?image=0")
        .thumbnail(thumbnailRequest)
        .into(imageThumbnail)

来自blog

缩略图是一个动态占位符,可以从Internet加载。获取的缩略图将一直显示,直到实际请求被加载和处理为止。如果缩略图由于某种原因到达原始图像之后,则将其取消。

答案 4 :(得分:0)

使用BitmapFactory.Options.inSampleSize制作图像的下采样版本,并上传两个版本。加载样本图像(这应该花费更少的时间),当下载更大的版本时,切换到该图像。您还可以使用TransitionDrawable进行淡入淡出过渡。

答案 5 :(得分:0)

这不是一个完美的方式,但它是最简单的方法。

将placeHolder图像设为模糊并将其设置为滑行。然后它总是显示模糊图像,然后在加载实际图像后它会出现。

您可以参考此代码以使用滑行。

//crete this method into your Utils class and call this method wherever you want to use.
//you can set these placeHolder() and error() image static as well. I made it as comment inside this method, then no need to use [placeHolderUrl and errorImageUrl] parameters. remove it from this method.
public static void loadImage(final Activity context, ImageView imageView, String url, int placeHolderUrl, int errorImageUrl) {
    if (context == null || context.isDestroyed()) return;

    //placeHolderUrl=R.drawable.ic_user;
    //errorImageUrl=R.drawable.ic_error;
        Glide.with(context) //passing context 
                .load(getFullUrl(url)) //passing your url to load image.
                .placeholder(placeHolderUrl) //this would be your default image (like default profile or logo etc). it would be loaded at initial time and it will replace with your loaded image once glide successfully load image using url.
                .error(errorImageUrl)//in case of any glide exception or not able to download then this image will be appear . if you won't mention this error() then nothing to worry placeHolder image would be remain as it is.
                .diskCacheStrategy(DiskCacheStrategy.ALL) //using to load into cache then second time it will load fast.
                .animate(R.anim.fade_in) // when image (url) will be loaded by glide then this face in animation help to replace url image in the place of placeHolder (default) image.
                .fitCenter()//this method help to fit image into center of your ImageView 
                .into(imageView); //pass imageView reference to appear the image.
}

答案 6 :(得分:0)

您的服务器上必须有小尺寸和全尺寸的图像。如果您将Firebase用作后端,则可以使用Firebase Resize Image Extension。有了较小尺寸的图像URL和完整尺寸的图像URL后,可以使用Glide,如下所示:

            Glide.with(context)
            .load(fullSizeImageUrl)          
            .thumbnail(
                Glide.with(context)
                    .load(smallSizeImageUrl)
            ).into(imageView)

您将获得模糊效果,因为小尺寸图像将变得模糊

根据Glide Doc : .thumbnail() 加载并显示给定缩略图请求检索的资源(如果该资源在此请求之前完成)。最适合用于加载比全尺寸资源小的缩略图资源,并且加载速度更快。无法保证请求实际完成的顺序。但是,如果拇指请求在完整请求之后完成,则拇指资源将永远不会替换完整资源。

答案 7 :(得分:-1)

使用BitmapFactory.Options.inSamleSize加载图像的缩减采样版本。然后加载较大的图像并使用TransitionDrawable

进行淡入淡出过渡

希望这会帮助你!干杯!