鸿蒙UI开发——组件阴影效果

最新推荐文章于 2025-06-05 15:45:12 发布

原创

最新推荐文章于 2025-06-05 15:45:12 发布 · 963 阅读

CC 4.0 BY-SA版权

文章标签：

1、概述

ArkUI为组件提供了阴影效果的设置。我们可以通过组件的.shadow属性为组件添加阴影效果。本文对阴影效果的设置做简单介绍。

对于普通组件来说，我们可以为其设置.shadow属性，定义如下：

 // 为组件添加阴影效果。shadow(value: ShadowOptions | ShadowStyle)

其中，入参类型为ShadowOptions时，可以指定模糊半径、阴影的颜色、X轴和Y轴的偏移量。入参类型为ShadowStyle时，可指定不同阴影样式。

ShadowOptions含有的属性定义如下：

属性名	类型	说明
radius	number \| Resource	阴影模糊半径。取值范围：[0, +∞)单位：px。说明：设置小于0的值时，按值为0处理。如需使用vp单位的数值可用vp2px进行转换。如果radius为Resource类型，则传入的值需为number类型。元服务API：从API version 11开始，该接口支持在元服务中使用。
type	ShadowType	阴影类型。默认为COLOR。
color	Color \| string \| Resource\| ColoringStrategy	阴影的颜色。默认为黑色。说明：从API version 11开始，该接口支持使用ColoringStrategy实现智能取色，智能取色功能不支持在ArkTS卡片、textShadow中使用。当前仅支持平均取色和