如何在Android Studio中创建带模糊投影的自适应尺寸按钮
Android 实现适配任意尺寸的极淡模糊按钮阴影
完全可以实现这类视觉上极淡、几乎不易察觉的按钮柔化阴影,且方案可自动适配任意按钮尺寸、圆角样式,无需针对不同规格按钮单独制作资源。对应效果参考:
推荐实现方案
优先选用 Material Components 库的 MaterialButton 实现,组件原生支持阴影自动匹配控件轮廓,参数调整自由度高,可覆盖Android 5.0及以上版本的适配需求。
- 第一步:在Module级
build.gradle中引入Material依赖:
注意项目App主题需继承implementation 'com.google.android.material:material:1.11.0'Theme.MaterialComponents系列主题,否则阴影相关属性无法生效。 - 第二步:布局文件中直接使用MaterialButton,通过以下属性控制阴影表现:
上述属性说明:<com.google.android.material.button.MaterialButton android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="示例按钮" android:backgroundTint="@color/white" app:cornerRadius="12dp" app:elevation="2dp" app:shadowColor="#0D000000" app:shadowRadius="8dp" app:pressedTranslationZ="0dp" android:stateListAnimator="@null" />android:backgroundTint:替换为实际需要的按钮底色app:cornerRadius:替换为按钮实际圆角值app:elevation:控件Z轴基础高度,数值越小阴影越贴近按钮app:shadowColor:阴影颜色,示例中0D前缀对应5%透明度纯黑,如需更淡的阴影可继续降低alpha值,比如08对应3%透明度app:shadowRadius:阴影模糊半径,数值越大阴影边缘越柔和弥散app:pressedTranslationZ、android:stateListAnimator:不需要按压时阴影变化动效时按示例配置即可
调参与适配说明
- 要实现几乎无感知的淡阴影,核心是调低
shadowColor的透明度,将alpha值控制在3%-10%区间即可,不要靠过度缩小elevation实现淡阴影,否则阴影会失去模糊弥散的质感。 - 该方案下阴影会自动适配按钮尺寸:无论按钮是自适应内容的wrap_content、固定宽高还是撑满布局的match_parent,阴影都会自动贴合按钮轮廓、匹配圆角大小,不会出现拉伸变形问题。
- 不推荐使用写死内边距的layer-list、固定尺寸的9-patch图实现阴影,这类方案在按钮尺寸变化时会出现边角错位、阴影拉伸问题,适配成本极高。
无依赖兼容方案
如果项目不想引入Material组件,可给原生控件设置android:elevation属性,通过自定义ViewOutlineProvider控制阴影轮廓,但该方案无法直接自定义阴影颜色,不同系统版本上阴影深浅、模糊度表现差异较大,很难调出统一的极淡阴影效果,非必要不选用。
内容的提问来源于stack exchange,提问作者Oleh Prukhnytskyi
相关产品推荐
相关产品推荐

