鸿蒙NEXT开发【前景属性设置】ArkTS组件通用属性

foregroundEffect

foregroundEffect(options: ForegroundEffectOptions)

设置组件的前景属性。

元服务API： 从API version 12开始，该接口支持在元服务中使用。

系统能力： SystemCapability.ArkUI.ArkUI.Full

参数：

参数名	类型	必填	说明
options	[ForegroundEffectOptions]	是	设置组件前景属性包括：模糊半径。

ForegroundEffectOptions12+

前景效果参数。

元服务API： 从API version 12开始，该接口支持在元服务中使用。

系统能力： SystemCapability.ArkUI.ArkUI.Full

名称	类型	必填	说明
radius	number	是	模糊半径，取值范围：[0, +∞)，默认为0。仅在组件范围内生效，与其他接口连用时超出组件范围的效果无法生效。

示例

通过foregroundEffect接口设置前景属性

// xxx.ets
@Entry
@Component
struct Index {
  build() {
    Row() {
      Image($r('app.media.icon'))
          .width(100)
          .height(100)
          .foregroundEffect({ radius: 20 })
    }
    .width('100%')
    .height('100%')
    .justifyContent(FlexAlign.Center)
  }
}

效果图如下：

radius表示模糊半径，数值越大越模糊