HarmonyOS 鸿蒙Next page 如何设置为透明背景？
HarmonyOS 鸿蒙Next page 如何设置为透明背景？
我需要在 page 中装载 flutter 的 component ，作为一种弹框显示，page 可以设置为透明背景么？还是有其他更好的方案？flutter component 需要感知到一些生命周期。
2 回复
可以从路由方面入手，
router路由模式请参考下面demo：
// Page1.ets
import window from '@ohos.window';
@Entry
@Component
struct Page2 {
@State message: string = 'page Page2';
onPageHide() {
console.log("pageHide")
}
build() {
Row() {
Column() {
Text(this.message)
.fontSize(50)
.fontWeight(FontWeight.Bold)
Button("pageB").onClick(() => {
let windowStege: window.WindowStage = AppStorage.get("windowStage") as window.WindowStage;
windowStege.createSubWindow("hello", (err, win) => {
win.setUIContent('pages/Page2');
win.showWindow();
})
})
}
.width('100%')
}
.height('100%')
.backgroundColor(Color.Pink)
}
}
// Page2.ets
import window from '@ohos.window';
@Entry
@Component
struct Index {
@State message: string = 'page Index';
aboutToAppear() {
window.findWindow("hello").setWindowBackgroundColor("#00000000")
}
onBackPress() {
window.findWindow("hello").destroyWindow().then((res) => {
console.log("destroyWindow success")
}).catch(() => {
console.log("destroyWindow fail")
})
return true
}
build() {
Row() {
Column() {
Text(this.message)
.fontSize(50)
.fontWeight(FontWeight.Bold)
}
.width('100%')
.backgroundColor(Color.Red)
}
.alignItems(VerticalAlign.Top)
.height('100%')
.backgroundColor("#80ffffff")
}
}
NavDestination支持Dialog类型页面：
NavDestinationMode.STANDARD: 标准类型
NavDestinationMode.DIALOG: 默认透明。
更多关于HarmonyOS 鸿蒙Next page 如何设置为透明背景？的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html
HarmonyOS 鸿蒙Next中，要将page设置为透明背景，可以通过以下几种方式实现：
方法一：直接设置backgroundColor属性
在ArkUI框架中，可以通过修改页面的backgroundColor属性来设置透明背景。例如，在页面的.ets文件中，可以使用类似backgroundColor(’#80FFFFFF’)的代码，其中’80’表示透明度，'FFFFFF’表示白色。你可以根据需要调整透明度值和颜色值。
方法二：使用子窗口并设置其透明度
另一种方法是通过设置子窗口的方式来实现透明背景。首先，创建一个子窗口，并在创建时指定其UI内容。然后，通过setWindowBackgroundColor方法将子窗口的背景色设置为透明（’#00000000’）。这种方式适用于需要更复杂布局和透明效果的场景。
注意事项
- 透明度的设置可能会受到系统主题、窗口管理器等因素的影响，因此在实际应用中可能需要进行适当的调整。
- 如果在设置透明背景时遇到问题，可以检查代码是否正确实现了上述方法，并确保使用的HarmonyOS版本支持这些功能。
如果问题依旧没法解决请联系官网客服，官网地址是：https://www.itying.com/category-93-b0.html
