问题

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

Device Screenshot

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>

回答1:

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

来源：https://stackoverflow.com/questions/60526167/android-material-lib-shapeableimageview-is-not-showing-preview-with-appshapeapp

标签

android

material-components-android

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