如何为类BottomSheet视图添加顶部阴影？

我需要为视图添加如图Figma设计所示的顶部阴影：

我已尝试多种方案但均无效：

• 使用BottomSheetDialog和BottomSheetFragment无效：背景需可滚动但无法实现，且无法通过样式添加阴影/elevation。
• 用CardView作为容器无济于事：常规elevation只会在视图底部显示阴影——Android默认光源在上方，无法轻松调整阴影方向。
• 尝试自定义阴影drawable方案：不适用于仅需顶部阴影的类BottomSheet视图，效果如下：
  

是否需要让设计师生成阴影drawable，就像CSS普及前的Web开发那样？恳请提供可行方向！

可行解决方案 #

方案1：自定义Drawable实现顶部阴影 #

创建仅在顶部绘制渐变阴影的自定义Drawable，精准控制阴影范围和透明度：

class TopShadowDrawable : Drawable() {
    private val paint = Paint(Paint.ANTI_ALIAS_FLAG).apply {
        style = Paint.Style.FILL
        // 阴影高度设为20dp，颜色和渐变范围可根据设计调整
        shader = LinearGradient(
            0f, 0f, 0f, 20f,
            Color.parseColor("#40000000"),
            Color.TRANSPARENT,
            Shader.TileMode.CLAMP
        )
    }

    override fun draw(canvas: Canvas) {
        canvas.drawRect(bounds.left.toFloat(), bounds.top.toFloat(), bounds.right.toFloat(), bounds.top + 20f, paint)
    }

    override fun setAlpha(alpha: Int) {
        paint.alpha = alpha
    }

    override fun setColorFilter(colorFilter: ColorFilter?) {
        paint.colorFilter = colorFilter
    }

    override fun getOpacity(): Int {
        return PixelFormat.TRANSLUCENT
    }
}

使用时直接给目标视图设置背景：

yourBottomSheetView.background = TopShadowDrawable()

方案2：添加独立阴影视图（快速实现） #

在类BottomSheet视图的顶部，新增一个固定高度的View，用渐变背景模拟阴影：

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical">

    <!-- 顶部阴影视图 -->
    <View
        android:layout_width="match_parent"
        android:layout_height="16dp"
        android:background="@drawable/top_shadow_gradient" />

    <!-- 可滚动内容区域 -->
    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <!-- 业务内容 -->
    </ScrollView>
</LinearLayout>

top_shadow_gradient.xml内容：

<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <gradient
        android:startColor="#40000000"
        android:endColor="@android:color/transparent"
        android:angle="270" />
</shape>

这种方式无需自定义代码，调整高度和渐变颜色就能快速适配设计。

方案3：Android 12+系统原生支持 #

如果项目最低适配版本为Android 12（API 31），可直接使用系统API指定阴影方向：

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.S) {
    yourBottomSheetView.shadowElevation = 20f
    yourBottomSheetView.shadowDirection = View.SHADOW_DIRECTION_TOP
}

注意该方案兼容性有限，仅适合高版本目标设备。

设计师导出Drawable的建议 #

如果代码实现的阴影无法完全匹配Figma的精细设计，让设计师导出顶部阴影的PNG/SVG是最稳妥的选择——直接将阴影图作为视图顶部背景，能100%还原设计效果，适合视觉精度要求高的场景。

内容的提问来源于stack exchange，提问作者Ambran