HarmonyOS6 foregroundBlurStyle 通用属性使用指南
文章目录1. 核心特性2. foregroundBlurStyle 完整参数说明2.1 基础语法2.2 BlurStyle模糊强度2.3 ForegroundBlurStyleOptions可选配置3. 完整示例代码解析3.1 代码结构说明4. 运行前置条件4.1 环境配置4.2 运行方式总结1. 核心特性特性说明适用版本HarmonyOS API 10Stage 模型支持组件Image、Text、Button、Column、Row、Stack 等通用组件核心能力为组件内容添加前景模糊支持4种模糊强度、主题色模式适配类型要求参数支持数字枚举替代避免导入报错适配严格类型检查2. foregroundBlurStyle 完整参数说明2.1 基础语法foregroundBlurStyle(style:BlurStyle,options?:ForegroundBlurStyleOptions)2.2 BlurStyle模糊强度数字值枚举值说明0BlurStyle.Thin轻薄模糊最弱1BlurStyle.Light轻度模糊2BlurStyle.Regular常规模糊推荐3BlurStyle.Thick厚重模糊最强2.3 ForegroundBlurStyleOptions可选配置参数名数字值枚举值说明colorMode0ThemeColorMode.DARK深色主题模式colorMode1ThemeColorMode.LIGHT浅色主题模式默认adaptiveColor0AdaptiveColor.DEFAULT默认自适应颜色推荐adaptiveColor1AdaptiveColor.PRIMARY主色调自适应adaptiveColor2AdaptiveColor.SECONDARY次色调自适应scalenumber-模糊强度缩放比例取值范围 0~11为最大强度3. 完整示例代码解析3.1 代码结构说明以下代码实现了foregroundBlurStyle属性的多场景演示包含单组件模糊、多强度对比等核心功能使用本地图片避免网络加载问题适配 ArkTS 严格类型检查规则EntryComponentstruct ForegroundBlurStyleDemo{build(){Column(){Text(Foreground Blur Style Demo).fontSize(24).margin(15);// 核心使用本地图片 foregroundBlurStyleImage($r(app.media.bg))// 替换为你的本地图片名.width(300).height(350).foregroundBlurStyle(2,// BlurStyle.Regular (常规模糊){colorMode:1,// ThemeColorMode.LIGHTadaptiveColor:0,// AdaptiveColor.DEFAULTscale:1.0});// 多效果对比演示使用本地小图Text(Blur Style Comparison).fontSize(18).margin(10);Row({space:12}){// 无模糊Image($r(app.media.bg)).width(80).height(80);// Thin 模糊Image($r(app.media.bg)).width(80).height(80).foregroundBlurStyle(0);// Regular 模糊Image($r(app.media.bg)).width(80).height(80).foregroundBlurStyle(2);// Thick 模糊Image($r(app.media.bg)).width(80).height(80).foregroundBlurStyle(3);}}.width(100%).height(100%).justifyContent(1)// 居中显示.padding(10);}}运行效果如下4. 运行前置条件4.1 环境配置DevEco Studio 版本 ≥ 4.0。工程 API 版本配置entry/build-profile.json5{apiType:stageMode,compileSdkVersion:10,compatibleSdkVersion:10}本地图片资源将图片文件如bg.jpg/png放入entry/src/main/resources/base/media目录。4.2 运行方式优先选择API 10 远程模拟器/真机运行预览器偶有兼容性问题。运行前点击 DevEco Studio 右上角Sync Now同步资源。总结foregroundBlurStyle是 HarmonyOS API 10 新增的前景模糊属性支持4种模糊强度和主题色适配。示例代码使用本地图片避免网络加载问题可直接复用至实际项目。数字值替代枚举的写法适配严格类型检查无导入报错风险。模糊效果仅作用于组件自身内容区别于背景模糊类属性是实现视觉层次感的重要手段。如果这篇文章对你有帮助欢迎点赞、收藏、关注你的支持是持续创作的动力
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2425864.html
如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!