How to choose the scaleType of ImageView

Question

I have a RecyclerView displaying a bunch of images as thumbnails. The width and height of the images can vary, some are 1280x720 and some are 4128x2322.

When I choose scaleType="center" for the ImageView in the XML layout, then my 4128x2322 images are shown perfectly (they occupy the whole screen as expected), but the 1280x720 images are displayed in a very cringe way (you can not see the image as a whole, only a part of it as if someone has zoomed in).

When I choose scaleType="centerInside", then the 1280x720 images are shown perfectly (the whole image is shown and it looks like a real thumbnail image like the ones we know from apps like YouTube) but the 4128x2322 images are shrinked and that is not looking good.

What is the typical way to solve this problem so that my ImageView can adjust its width and height in a most appropriate way based on what the width and height are.

For the sake of completeness, here is my image_list_item.xml layout file:

<layout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools">

    <data>
        <variable
            name="image"
            type="com.celik.abdullah.learningdifferentscaletypesforimageview.Image" />

    </data>

    <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:weightSum="100">

        <FrameLayout
            android:id="@+id/image_container"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            android:scaleType = "center">

            <ImageView
                android:id="@+id/thumbnail"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:scaleType="center"
                tools:src="@mipmap/ic_launcher_round"
                app:imageSrc="@{image.imageUrl}" />

        </FrameLayout>


    </androidx.constraintlayout.widget.ConstraintLayout>
</layout>

The ImageView is wrapped into a FrameLayout because I wanted to have some icons on top of it later. But that's unimportant for this question.

Answer 1

Please add android:scaleType="fitXY" in ImageView Tag...

               <ImageView
                android:id="@+id/thumbnail"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:scaleType="fitXY"
                tools:src="@mipmap/ic_launcher_round"
                app:imageSrc="@{image.imageUrl}" />