自定义imageView的阴影

如何解决自定义imageView的阴影

我创建了一个简单的播放图标。我将SVG文件导入了Android Studio，并将其作为imageView进行了来源。但是，不幸的是，我无法移走我的Adope XD文档中的下拉阴影。无论哪种情况，我都试图通过代码复制下拉阴影效果。但是我没有成功。

左边的图像就是我需要的，右边的图像就是我需要的：

我一直在弄乱现有代码，但没有成功。这是我到目前为止的内容：

imageView：

<ImageView
    android:id="@+id/thumbnail_next"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center_vertical"
    android:background="@drawable/background_drop_shadow"
    app:srcCompat="@drawable/ic_next_button_image_select" />

ic_next_button_image_select（导入的SVG）：

<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="40dp"
    android:height="38dp"
    android:viewportWidth="40"
    android:viewportHeight="38">
  <path
      android:pathData="M12,0L28,0A12,12 0,0 1,40 12L40,26A12,28 38L12,38A12,0 26L0,12A12,12 0z"
      android:fillColor="#1ed760"/>
  <path
      android:pathData="M27.6,17.28a2,2 0,-0 3.439l-10.083,5.987A2,14.5 24.987L14.5,13.013a2,3.021 -1.72Z"
      android:fillColor="#090909"/>
</vector>

background_drop_shadow（我找到并尝试使用的代码）：

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- Drop Shadow Stack -->
    <item>
        <shape>
            <padding android:top="1dp" android:right="1dp" android:bottom="1dp" android:left="1dp" />
            <stroke android:color="#02000000" android:width="1dp"  />
            <corners android:radius="8dp" />
        </shape>
    </item>
    <item>
        <shape>
            <padding android:top="1dp" android:right="1dp" android:bottom="1dp" android:left="1dp" />
            <stroke android:color="#05000000" android:width="1dp" />
            <corners android:radius="7dp" />
        </shape>
    </item>
    <item>
        <shape>
            <padding android:top="1dp" android:right="1dp" android:bottom="1dp" android:left="1dp" />
            <stroke android:color="#10000000" android:width="1dp" />
            <corners android:radius="6dp" />
        </shape>
    </item>
    <item>
        <shape>
            <padding android:top="1dp" android:right="1dp" android:bottom="1dp" android:left="1dp" />
            <stroke android:color="#15000000" android:width="1dp" />
            <corners android:radius="5dp" />
        </shape>
    </item>
    <item>
        <shape>
            <padding android:top="1dp" android:right="1dp" android:bottom="1dp" android:left="1dp" />
            <stroke android:color="#20000000" android:width="1dp" />
            <corners android:radius="4dp" />
        </shape>
    </item>
    <item>
        <shape>
            <padding android:top="1dp" android:right="1dp" android:bottom="1dp" android:left="1dp" />
            <stroke android:color="#25000000" android:width="1dp" />
            <corners android:radius="3dp" />
        </shape>
    </item>
    <item>
        <shape>
            <padding android:top="1dp" android:right="1dp" android:bottom="1dp" android:left="1dp" />
            <stroke android:color="#30000000" android:width="1dp" />
            <corners android:radius="3dp" />
        </shape>
    </item>

    <!-- Background -->
    <item>
        <shape>
            <solid android:color="@android:color/transparent" />
            <corners android:radius="3dp" />
        </shape>
    </item>
</layer-list>

解决方法

要实现此目的，您应该使用CardView。所以会是这样：

<FrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#687199"
    >

    <androidx.cardview.widget.CardView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        app:cardBackgroundColor="@android:color/transparent"
        app:cardCornerRadius="40dp"
        app:cardElevation="16dp"
        >

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:srcCompat="@drawable/test"
            />
    </androidx.cardview.widget.CardView>

</FrameLayout>

您只需要使用app:cardElevation和app:cardCornerRadius来获得所需的阴影。

此外，请记住，当对象靠近屏幕底部时，Android阴影系统会绘制更深和更长的阴影。