如何在Android(XML)中实现Adobe XD设计的Material Design阴影效果

首先你需要先从Adobe XD设计稿中提取目标按钮（搜索按钮、仅素食按钮）的阴影核心参数，选中对应元素后在右侧效果面板可直接读取：

• X轴偏移：阴影横向偏移量，单位一般为dp
• Y轴偏移：阴影纵向偏移量，单位一般为dp
• 模糊值：阴影的虚化程度
• 阴影颜色：包含透明度通道的色值

实现方案1：系统原生elevation实现（适配Android 5.0+，覆盖绝大多数场景） #

这是最简单的实现方式，XD参数和安卓原生属性的换算规则如下：

• XD模糊值 ÷ 2 = 安卓elevation属性值
• XD的X/Y偏移直接对应安卓的translationX/translationY属性值
• XD的阴影色直接赋值给安卓shadowColor属性（Android 9及以上支持）

示例布局代码（以XD提取参数：Y偏移2dp、模糊8dp、阴影色#33000000、按钮圆角8dp为例）：

<Button
    android:id="@+id/search_btn"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="搜索"
    android:backgroundTint="#FFFFFF"
    android:cornerRadius="8dp"
    <!-- 阴影核心配置 -->
    android:elevation="4dp"
    android:translationY="2dp"
    android:shadowColor="#33000000"
    />

如果需要适配Android 9以下设备修改阴影颜色，额外添加outlineAmbientShadowColor和outlineSpotShadowColor两个属性，取值和XD阴影色保持一致即可。 #

实现方案2：1:1精确匹配（全版本适配，无系统版本差异） #

如果原生elevation的效果和设计稿有偏差，可以用自定义layer-list drawable实现完全可控的阴影效果，没有系统版本兼容问题。
示例：在res/drawable目录下新建btn_shadow_background.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- 底层阴影层 -->
    <item>
        <shape android:shape="rectangle">
            <solid android:color="#33000000"/>
            <corners android:radius="8dp"/>
        </shape>
    </item>
    <!-- 上层按钮填充层，通过item偏移实现XD的X/Y偏移效果 -->
    <item
        android:top="2dp"
        android:bottom="0dp"
        android:left="0dp"
        android:right="0dp">
        <shape android:shape="rectangle">
            <solid android:color="#FFFFFF"/>
            <corners android:radius="8dp"/>
        </shape>
    </item>
</layer-list>

直接将上述drawable设置为按钮的android:background属性即可，你可以根据XD的实际参数调整阴影颜色、偏移量、圆角大小，直到和设计稿完全对齐。 #

调试技巧 #

你可以将Adobe XD的设计稿截图导入Android Studio的Layout Inspector中，和运行中的应用界面做叠层对比，微调参数即可快速达到100%还原效果。

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