java Android Glide 占位符大小

Android Glide placeholder size

提问by TavoTevas

I have a problem with Android Glide. I am trying to quickly swap my image, they just become all placeholder size, and my placeholder image is very low size. So what I need to do?

我在使用 Android Glide 时遇到问题。我正在尝试快速交换我的图像，它们只是变成了所有占位符大小，而我的占位符图像尺寸非常小。那我需要做什么？

Maybe I need to check if it's loaded or something, but I don't know how.

也许我需要检查它是否已加载或其他什么，但我不知道如何。

Glide.with(this)
    .load(quest.get(id).getImage())
    .placeholder(R.drawable.load)
    .fitCenter()
    .crossFade()
    .into(imageView);

回答by Ashkan Ghodrat

According to thisissue on Glide GitHub page you can fix it with adding following line to your request of Glide:

根据Glide GitHub 页面上的这个问题，您可以通过在您的 Glide 请求中添加以下行来修复它：

  .dontAnimate()

That would make your full load line:

这将使您的完整负载线：

  Glide.with(context)
            .load("http://lorempixel.com/150/150")
            .placeholder(R.drawable.no_image)
            .override(100, 100)
            .dontAnimate()
            .into(imageView);

回答by Swas_99

I do it like mentioned below:

我像下面提到的那样做：

The idea is to set the scale type to as required by the place holder initially & attach listener to change the scale type again to as required by the downloaded image after the image is downloaded.

这个想法是最初将比例类型设置为占位符的要求，并在下载图像后附加侦听器以再次将比例类型更改为下载图像的要求。

//ivBuilderLogo = Target ImageView
//Set the scale type to as required by your place holder
//ScaleType.CENTER_INSIDE will maintain aspect ration and fit the placeholder inside the image view
holder.ivBuilderLogo.setScaleType(ImageView.ScaleType.CENTER_INSIDE); 

//AnimationDrawable is required when you are using transition drawables
//You can directly send resource id to glide if your placeholder is static
//However if you are using GIFs, it is better to create a transition drawable in xml 
//& use it as shown in this example
AnimationDrawable animationDrawable;
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP)
     animationDrawable=(AnimationDrawable)context.getDrawable(R.drawable.anim_image_placeholder);
else
     animationDrawable=(AnimationDrawable)context.getResources().getDrawable(R.drawable.anim_image_placeholder);
animationDrawable.start();

Glide.with(context).load(logo_url)
                   .placeholder(animationDrawable)
                   .listener(new RequestListener<String, GlideDrawable>() {
                        @Override
                        public boolean onException(Exception e, String model, Target<GlideDrawable> target, boolean isFirstResource)
                        {
                           return false;
                        }

                        //This is invoked when your image is downloaded and is ready 
                        //to be loaded to the image view
                        @Override
                        public boolean onResourceReady(GlideDrawable resource, String model, Target<GlideDrawable> target, boolean isFromMemoryCache, boolean isFirstResource)
                        {   
                        //This is used to remove the placeholder image from your ImageView 
                        //and load the downloaded image with desired scale-type(FIT_XY in this case)
                        //Changing the scale type from 'CENTER_INSIDE' to 'FIT_XY' 
                        //will stretch the placeholder for a (very) short duration,
                        //till the downloaded image is loaded
                        //setImageResource(0) removes the placeholder from the image-view 
                        //before setting the scale type to FIT_XY and ensures that the UX 
                        //is not spoiled, even for a (very) short duration
                            holder.ivBuilderLogo.setImageResource(0);
                            holder.ivBuilderLogo.setScaleType(ImageView.ScaleType.FIT_XY);
                            return false;
                        }
                    })
                    .into( holder.ivBuilderLogo);

My transition drawable (R.drawable.anim_image_placeholder) :

我的过渡可绘制（R.drawable.anim_image_placeholder）：

(not required if using a static image)

（如果使用静态图像则不需要）

<?xml version="1.0" encoding="utf-8"?>
<animation-list
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:oneshot="false">
    <item android:drawable="@drawable/loading_frame1" android:duration="100" />
    <!--<item android:drawable="@drawable/loading_frame2" android:duration="100" />-->
    <item android:drawable="@drawable/loading_frame3" android:duration="100" />
    <!--<item android:drawable="@drawable/loading_frame4" android:duration="100" />-->
    <item android:drawable="@drawable/loading_frame5" android:duration="100" />
    <!--<item android:drawable="@drawable/loading_frame6" android:duration="100" />-->
    <item android:drawable="@drawable/loading_frame7" android:duration="100" />
    <!--<item android:drawable="@drawable/loading_frame8" android:duration="100" />-->
    <item android:drawable="@drawable/loading_frame9" android:duration="100" />
    <!--<item android:drawable="@drawable/loading_frame10" android:duration="100" />-->
</animation-list>

回答by Shaahin Sh

What I did in this regard was to use override() to enforce image size. If you have a gridview and you need to have two images in each row, this is how you find the screen size in pixels to calculate the correct width and height of the image:

我在这方面所做的是使用 override() 来强制执行图像大小。如果你有一个 gridview 并且你需要在每一行中有两个图像，这就是你如何找到以像素为单位的屏幕大小来计算图像的正确宽度和高度：

    WindowManager wm = (WindowManager) context.getSystemService(Context.WINDOW_SERVICE);
    Display display = wm.getDefaultDisplay();
    Point size = new Point();
    display.getSize(size);
    placeholderWidth = size.x / 2 ;
    placeholderHeight = size.x * 3 / 2 ; // based on the image's height to width ratio

Once the desired width and height for each image is in hand, it's easy to use override:

一旦掌握了每个图像所需的宽度和高度，就可以轻松使用覆盖：

    Glide.with(context)
            .load(url)
            .placeholder(R.drawable.loading)
            .override(placeholderWidth,placeholderHeight)                
            .into(viewHolder.imageViewHolder);

回答by Alex Sarapin

If I correctly understand your problem, you need to load images, but they must have width and height bigger than your placeholder image. To solve your problem you first should read documentation for Glide. I can't see your ImageView definition in the xml file, but i think that you use wrap_content attribute for width and height. If I am right there is your bottleneck. Before image loading is started, Glide gets exact ImageView width and height. After that it loads image from the network and at the same time resize it according to the one of the ImageView attributes(width or height). Thats why you get small images after loading. To solve your problem just set width or height of the ImageView in value that you expect to see. Other side of the image will be automatically calculated by the Glide logic.

如果我正确理解您的问题，您需要加载图像，但它们的宽度和高度必须大于占位符图像。要解决您的问题，您首先应该阅读 Glide 的文档。我在 xml 文件中看不到您的 ImageView 定义，但我认为您使用 wrap_content 属性来表示宽度和高度。如果我是对的，那就是你的瓶颈。在图像加载开始之前，Glide 会获取准确的 ImageView 宽度和高度。之后，它从网络加载图像，同时根据 ImageView 属性之一（宽度或高度）调整其大小。这就是为什么你在加载后得到小图像的原因。要解决您的问题，只需在您希望看到的值中设置 ImageView 的宽度或高度。图像的另一面将由 Glide 逻辑自动计算。