ShapeableImageView - Changing height results in cut-off corners when applying new ShapeAppearanceModel

Question

My app needs to support multiple corner radius/aspect ratio combination presets which may be displayed in different orders depending on the user profile being displayed. For example, preset A has corner radii of 42dp, 42dp, 120dp, 0dp and an aspect ratio of 1:1.5, whereas preset B has a corner radius of 60dp for all corners and an aspect ratio of 1:1.2.

I am using ShapeableImageViews and setting the corner radius like so:

shapeAppearanceModel = shapeAppearanceModel
                .toBuilder()
                .setTopLeftCorner(CornerFamily.ROUNDED, context.dpToPx(topLeft.roundToInt()).toFloat())
                .setTopRightCorner(CornerFamily.ROUNDED, context.dpToPx(topRight.roundToInt()).toFloat())
                .setBottomRightCorner(CornerFamily.ROUNDED, context.dpToPx(bottomRight.roundToInt()).toFloat())
                .setBottomLeftCorner(CornerFamily.ROUNDED, context.dpToPx(bottomLeft.roundToInt()).toFloat())
                .build()

I have tried setting the views' constraint dimension ratios like so:

(parent as? ConstraintLayout)?.let {
                val constraintSet = ConstraintSet()
                constraintSet.clone(it)
                constraintSet.setDimensionRatio(id, "1:$ratio")
                constraintSet.applyTo(it)
            }

and also setting the height of the views directly like so:

val params = layoutParams as ConstraintLayout.LayoutParams
params.height = (ratio * screenWidth).roundToInt()
layoutParams = params

The result is that when both the ShapeAppearanceModel and ConstraintDimensionRatio/height of the ShapeableImageView are changed, some of the corners are cut off and/or the view is otherwise distorted or displayed incorrectly.

The views always display correctly on first launch no matter the corner radii or height/dimension ratio, only after changing these attributes on the same view does the bug occur. Changing only the corner radii without changing the height/dimension ratio works perfectly fine. I have tried calling invalidate() on the views before changing the height and have tried changing these attributes in different orders to no avail. Can anyone help me here? Thanks

Answer 1

Just had to use android:scaleType="centerCrop".