自定义 imageView 的投影

Question

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

左图是我有的，右图是我需要的：

我一直在修改现有代码，但没有成功。这是我目前所拥有的：

图像视图：

<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,12 0,0 1,28 38L12,38A12,12 0,0 1,0 26L0,12A12,12 0,0 1,12 0z"
      android:fillColor="#1ed760"/>
  <path
      android:pathData="M27.6,17.28a2,2 0,0 1,-0 3.439l-10.083,5.987A2,2 0,0 1,14.5 24.987L14.5,13.013a2,2 0,0 1,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>

Answer 1

为此，您应该使用 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 阴影系统会绘制更暗、更长的阴影。

自定义 imageView 的投影

Drop shadow for custom imageView

xml

android

shadow

android-imageview

layer-list