Android material lib ShapeableImageView is not showing preview with app:shapeAppearanceOverlay

user_1053190 0
Viewed 4842

There is a problem using ShapeableImageView material component and set shapeAppearanceOverlay to make it a circle image. It doesn't show up in viewport. Seems like we set the visibility to GONE. However, it shows perfectly on the device.

Is there any way to fix it? or since it is still in 1.2.0-alpha05 so under development or a known bug?

Viewport Screenshot

enter image description here

Device Screenshot

enter image description here

Material Library

implementation 'com.google.android.material:material:1.2.0-alpha05'

XML Code

<com.google.android.material.imageview.ShapeableImageView
    android:id="@+id/v_blog_card_avatar"
    android:layout_width="40dp"
    android:layout_height="40dp"
    android:src="@drawable/splash_background"
    android:scaleType="centerCrop"
    app:shapeAppearanceOverlay="@style/ImageCircleTheme"
    app:layout_constraintTop_toBottomOf="@+id/v_blog_card_divider"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintBottom_toBottomOf="parent"
    android:layout_marginBottom="16dp"
    android:layout_marginStart="16dp"/>

Style

<style name="ImageCircleTheme">
    <item name="cornerFamily">rounded</item>
    <item name="cornerSize">50%</item>
</style>
material-components-android android
1 Answers

Try this,

style.xml :

<resources>
    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.MaterialComponents.Light.DarkActionBar">
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>

   <!-- ShapeableImageView theme. (note that the parent matches the Base App theme) -->
    <style name="ShapeAppearance.ImageView" parent="Theme.MaterialComponents.Light.DarkActionBar">
        <item name="cornerFamily">rounded</item>
        <item name="cornerSize">50%</item>
    </style>

</resources>

my_layout.xml :

<com.google.android.material.imageview.ShapeableImageView
        android:id="@+id/sivAdvImage"
        android:layout_width="0dp"
        android:layout_height="150dp"
        android:src="@drawable/test_image"
        android:scaleType="centerCrop"
        app:shapeAppearance="@style/ShapeAppearance.ImageView"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

works with: com.google.android.material:material:1.3.0-alpha03

user_97197940
Related