[ShapeableImageView] Using Glide and cross fade transitions fails sometimes

[juancamilo87]

Description: When loading a ShapeableImageView with Glide and applying a cross fade transition makes the ShapeableImageView to sometimes not make the corners properly. Worth mentioning is that the ShapeableImageView was inside a RecyclerView. Something that might help finding the issue is that the issue is much more prevalent in version 1.2.0. In that one almost never does the ImageView show the correct shape. But in 1.3.0 it only happens sometimes.

Expected behavior: The corners should appear as expected.

Source code:

• Loading:

val view: ShapeableImageView
val url: String
val placeHolder: Drawable
Glide.with(view)
        .load(url)
        .placeholder(placeholder)
        .error(placeholder)
        .fallback(placeholder)
        .transition(DrawableTransitionOptions.withCrossFade(200))
        .into(view)

• ShapeableImageView:

    <com.google.android.material.imageview.ShapeableImageView
            android:id="@+id/img"
            android:layout_width="52dp"
            android:layout_height="52dp"
            android:scaleType="centerCrop"
            app:shapeAppearanceOverlay="@style/ShapeAppearance.App.RoundedCorner"
            app:srcUrl="@{url}"
            app:placeholder="@{@drawable/placeholder}"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintBottom_toBottomOf="parent"
            app:flow_verticalBias="0"
            app:layout_constraintStart_toStartOf="parent" />

• ShapeAppearance:

    <style name="ShapeAppearance.App.RoundedCorner" parent="">
        <item name="cornerSize">8dp</item>
    </style>

Android API version: 30

Material Library version: 1.3.0 and 1.2.0.

Device: Pixel 4