Glide: CenterCrop Scaling issue with placeholder

[camillebeaumont]

Glide Version: 3.7.0

Device/Android Version: Nexus 6 6.0.1, Emulator Nexus 5X 6.0, Samsung SM-T230 4.4.2 (I suppose any devices)

Issue details / Repro steps / Use case background:

I see many issues with centerCrop problems. None of them seem to correspond with this. I've a recyclerView with Cardview. Each card contains text + image. Image is matching parent width and fix height. ScaleType (centerCrop) is define in XML.

The problem is that there is distortion for all images on first load. Then on refresh (for example, scrolling down to recycle views or quit and relaunch activity, image are correctly scaled. I found that the distortion come from adding a placeholder. If I remove the placeholder line, there is no problem.

            Glide.with(context)
                    .load(item.getPhoto())
                    .placeholder(R.drawable.same_size_placeholder) 
                    .diskCacheStrategy(DiskCacheStrategy.SOURCE)
                    .into(holder.getPicture());

To investigate further, I make a sample with images all the same size, and make a placeholder with the exact same size but the distortion is still present. (I use a grid-pattern image to see correctly the issue). (See attached and github)

Please correctly kill app and clear cache to test it.

When commenting placeholder line, Glide work perfectly. (For simplification, I use images in drawable but it the same with url)
https://github.com/camillebeaumont/GlidePlaceholderTest

First loading:

After Refresh:

[TWiStErRob]

Naming it same_size_placeholder won't make it the same size, you actually have to resize it ;)
The problem is that the input images (even after cropping) have a different aspect ratio than the placeholder drawable. Glide doesn't apply centerCrop to the placeholder and the enabled-by-default crossFade animation using Android's TransitionDrawable doesn't support different aspects: #363.

You can either use .dontAnimate() or change .placeholder(X) to .thumbnail(Glide.with(context).load(X).centerCrop()) to force a transformation. This may leave a little delay during the list first showing, but after that it should be the same as .placeholder() until the memory cache keeps that image.

[camillebeaumont]

My bad! I commit the wrong file...

Thanks for the tip, didn't think I could be a Android issue. Thanks for the .dontAnimate() fix, it work as a charm :)

[TWiStErRob]

Give a spin for the thumbnail version as well, because in that case the animation should work correctly. It's nicer on the eye.

[dishantkawatra]

Glide.with(mActivity)
.load(imageUrl)
.apply(new RequestOptions().dontTransform().placeholder(placeholder))
.into(imageView);

Glide version 4.8.0 after this code i solved my issue

[MahdiAbbasian]

Naming it same_size_placeholder won't make it the same size, you actually have to resize it ;)
The problem is that the input images (even after cropping) have a different aspect ratio than the placeholder drawable. Glide doesn't apply centerCrop to the placeholder and the enabled-by-default crossFade animation using Android's TransitionDrawable doesn't support different aspects: #363.

You can either use .dontAnimate() or change .placeholder(X) to .thumbnail(Glide.with(context).load(X).centerCrop()) to force a transformation. This may leave a little delay during the list first showing, but after that it should be the same as .placeholder() until the memory cache keeps that image.

Thank you so much my issue with this solution solved.