HarmonyOS 鸿蒙Next分段按钮支持沉浸光感视效材质吗
HarmonyOS 鸿蒙Next分段按钮支持沉浸光感视效材质吗
如题,我注意到系统应用已经使用上了带有沉浸光感效果的分段按钮如图,我目前的开发环境使用了API23,请问segmentbuttonV2有相关的参数可以实现吗?

更多关于HarmonyOS 鸿蒙Next分段按钮支持沉浸光感视效材质吗的实战教程也可以访问 https://www.itying.com/category-93-b0.html
尊敬的开发者,您好,SegmentButton当前不支持沉浸光感视效,您可以参考:双边边缘流光-视效-UI Design Kit(UI设计套件)-应用框架 - 华为HarmonyOS开发者 实现背景边缘流光的特效,示例代码如下:
import { SegmentButtonV2Items, TabSegmentButtonV2 } from '@kit.ArkUI';
import { hdsEffect } from '@kit.UIDesignKit';
@Entry
@ComponentV2
struct TabSegmentButtonV2Example {
@Local textItems: SegmentButtonV2Items = new SegmentButtonV2Items([
{ text: '手机' },
{ text: '平板' },
]);
@Local textSelectedIndex: number = 0;
@Local controller: hdsEffect.ShaderEffectController = new hdsEffect.ShaderEffectController();
build() {
Scroll() {
Column({ space: 12 }) {
TabSegmentButtonV2({
items: this.textItems,
selectedIndex: this.textSelectedIndex!!,
})
.borderRadius(20)
.visualEffect(new hdsEffect.HdsEffectBuilder()
.shaderEffect({
effectType: hdsEffect.EffectType.DUAL_EDGE_FLOW_LIGHT,
animation: {
duration: 10000,
iterations: -1,
autoPlay: true,
onFinish: () => {
console.info('Succeeded in finishing');
}
},
controller: this.controller
})
.buildEffect())
.clip(true);
}
.constraintSize({ minHeight: '100%' })
.justifyContent(FlexAlign.Start)
.padding(16);
}
.backgroundImage($r('app.media.img'))
.backgroundImageSize({
width: '100%',
height: '100%'
})
.width('100%')
.height('100%');
}
}
您看下如上demo是否满足您的需求,如果还是不能满足您的需求,麻烦您提供如下信息:
请问您是在什么样的业务场景中使用该能力,交互流程是怎样的,在哪一个环节遇到了问题?方便说明能力不满足可能带来的影响:什么时间用到?是否高频?有无三方库可以做到?若提供该能力,是否会造成大工作量返工?请您注意提供的内容不要包含您或第三方的非公开信息,如给您带来不便,敬请谅解。
更多关于HarmonyOS 鸿蒙Next分段按钮支持沉浸光感视效材质吗的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html
目前不要把系统应用里的所有沉浸光感效果都等同于 SegmentButtonV2 已开放参数。就你这个场景,SegmentButtonV2 如果没有暴露 systemMaterialEffect 或类似材质参数,就不能直接通过一个属性打开同款效果。
可行做法一般有两种:
-
如果只是接近视觉效果,用外层容器做半透明背景、blur/backdropBlur、边缘高光,再把 SegmentButton 放进去。
-
如果必须和系统组件一致,优先等 HDS/ArkUI 后续开放对应参数,不建议深度魔改内部结构。
另外要注意系统应用可能使用了未公开组件或内部样式,不一定能在三方应用里 1:1 复刻。
这个效果没有官方组件,如果想实现的话,需要通过hdsTabs沉浸光感魔改,或者等到鸿蒙7.0发布。
官方没提到这个组件的沉浸式光感适配,建议采用backgroundBlurStyle实现毛玻璃效果看看效果呢~
支持。HarmonyOS NEXT 分段按钮可通过 backgroundEffect 属性设置光感材质,或在 VisualEffect 中启用沉浸光感视效,实现动态光照与模糊效果。
鸿蒙Next的 SegmentButton 组件本身支持沉浸光感视效。在 API 23 中,通过设置 fontUIConfig 参数下的 fill 属性为 BlendStyle 即可实现类似系统应用的磨砂半透明效果。例如将 fill 指定为 BlendStyle.EFFECT_STYLE,按钮背景就会呈现光感视效;若需自定义颜色,可使用 BlendStyle.color 配合透明度。无需额外自定义绘制。

