Glide: How to scale image proportionally with custom height/width?

[rsaphala]

Glide Version:3.7

Integration libraries:Okhttp3

Device/Android Version: all version

Issue details / Repro steps / Use case background:

I want to resize an image such that it will fit an Imageview without any blank spaces and show the entirety of the image.

The width of the ImageView is set to match_parent and the height is 100dp. Screenshots attached below.
The image file can be of any size. Is this possible using glide?

Glide load line / GlideModule (if any) / list Adapter code (if any):

glide.load(postsData.user.profile_picture)
                    .placeholder(R.drawable.grey_placeholder)
                    .into(((PostsViewHolder) holder).imageAvatar);

Layout XML:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <ImageView
        android:scaleType="fitCenter"
        android:adjustViewBounds="true"
        android:id="@+id/backgroundProfileImage"
        android:src="@drawable/space"
        android:layout_width="match_parent"
        android:layout_height="100dp" />


</RelativeLayout>

i want to remove the blank spaces as below

this is pretty close to what i want to achieve(using scaletype:CenterCrop), but I want to show the full image. Any ideas?

[TWiStErRob]

You're asking for a scaling method that:

1. will fit an Imageview
2. without any blank spaces
3. show the entirety of the image
4. scale image proportionally

Well, that's a dream, you would need to bend space-time to do that. You have these options:

• fitCenter: 1, 3, 4
• centerCrop: 1, 2, 4
• centerInside: 3, 4 (1 for large images)
• fitXY: 1, 2, 3

As you see there's always something missing, you have to let go of one constraint, likely 3.

(_Note: any of these will exhibit 1, 2, 3, 4 if the source image matches the view perfectly, but that's an edge case._)

---

There's a trick to do 1, 2, 3, 4 though: https://youtu.be/oNuQZPTHALI at 2:08; I seem to remember LEMMiNO and ColdFusion using this technique the most.

The basic idea is to display the image fitCenter (1, 3, 4) + fill the remaining space (2) with the same image loaded centerCrop, blurred, into the background.

_If anyone knows the name of this technique I'd be grateful if they let me know._

[rsaphala]

I ended up implementing a topcrop solution for this. Thanks anyways!

[usmanfarhat]

I spent 2 hours to find out that the solution is quite simple. That we need to use adjustViewBounds="true" in the ImageView. My requirement was that I wanted to show different sized images in a RecyclerView just like facebook or 9gag app.

This is my code for ImageView. This shows the images exactly in the manner I wanted. I think this will suit your needs too.

<ImageView
            android:adjustViewBounds="true"
            android:id="@+id/imageView"
            android:scaleType="fitCenter"
            android:src="@android:drawable/ic_menu_camera"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:visibility="visible" />

[iamAliRaza]

I spent 2 hours to find out that the solution is quite simple. That we need to use adjustViewBounds="true" in the ImageView. My requirement was that I wanted to show different sized images in a RecyclerView just like facebook or 9gag app.

This is my code for ImageView. This shows the images exactly in the manner I wanted. I think this will suit your needs too.

<ImageView
            android:adjustViewBounds="true"
            android:id="@+id/imageView"
            android:scaleType="fitCenter"
            android:src="@android:drawable/ic_menu_camera"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:visibility="visible" />

It works in other scenarios. But try to upload very tall image. Capture long screen shot and upload it. Then this would not work in case of facebook they are center cropping if the image is too tall.