Android端实现Neumorphic Design拟态按钮的效果问题咨询
Android Neumorphic拟态按钮效果调整方案
- 补全双阴影配置
拟态设计核心是左上亮阴影+右下暗阴影的组合效果,你当前仅配置了亮部阴影颜色,缺少暗部阴影参数,需要新增app:neumorph_shadowColorDark属性,暗部阴影色选择比背景色深2-3个色阶的低饱和灰即可,参考值#D1D9D1,同时可以将亮部阴影色调整为更浅的#FFFFFF,强化明暗对比。 - 移除inset参数、增加高度配置
你当前设置的app:neumorph_inset="5dp"是凹陷形态的参数,凸起按钮不需要该配置,删除后新增app:neumorph_elevation="10dp"控制按钮的凸起高度,数值可根据视觉效果在8-12dp区间调整。 - 调整阴影柔和度与偏移
新增阴影模糊半径和偏移参数,让阴影效果更自然贴合参考图:
app:neumorph_shadowBlurRadius="12dp" app:neumorph_shadowOffsetX="2dp" app:neumorph_shadowOffsetY="4dp"
调整后的完整参考代码如下:
<soup.neumorphism.NeumorphCardView android:id="@+id/card_tranfer" android:layout_width="@dimen/_90sdp" android:layout_height="@dimen/_85sdp" android:padding="0dp" android:layout_marginStart="@dimen/_11sdp" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" app:neumorph_backgroundColor="#EFF0EF" app:neumorph_shapeType="flat" app:neumorph_cornerFamily="rounded" app:neumorph_cornerSize="18dp" app:neumorph_shadowColorLight="#FFFFFF" app:neumorph_shadowColorDark="#D1D9D1" app:neumorph_elevation="10dp" app:neumorph_shadowBlurRadius="12dp" app:neumorph_shadowOffsetX="2dp" app:neumorph_shadowOffsetY="4dp" >
如果需要实现参考图中按压状态的凹陷效果,可设置app:neumorph_shapeType="pressed",也可以配合点击事件动态切换shapeType属性实现交互反馈。
内容的提问来源于stack exchange,提问作者Taha alam
相关产品推荐
相关产品推荐

