HarmonyOS bindContentCover的背景颜色透明度

页面需要pop弹出一个全屏的日历,全屏时的背景能看到上个页面的模糊图,透明度为0.2。但是没找到bindContentCover的背景颜色透明度设置在哪。

用了 .opacity(0.2)这个属性会导致整个页面全部透明了,现在只想让背景透明,其他控件不透明。

怎么才能实现透明背景颜色的效果。

HarmonyOS
1天前
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
Heiang

如果想实现背景透明,其他控件不透明的效果,这边有两个推荐:

方案一:使用半模态转场 bindSheet 来实现,示例代码如下:

.bindSheet($$this.isShow, this.playLottieBuilder(), {
  height: -1,
  backgroundColor: '#80000000',
  onWillAppear: () => {console.log("BindSheet onWillAppear.")},
  onAppear: () => {console.log("BindSheet onAppear.")},
  onWillDisappear: () => {console.log("BindSheet onWillDisappear.")},
  onDisappear: () => {console.log("BindSheet onDisappear.")}
})

方案二:将 this.playLottieBuilder()的组件抽离成一个页面(TestOpenPage),将这个页面作为一个子窗口加载然后将子窗口设置为透明背景这样来实现背景半透明效果,伪代码如下:

1、EntryAbility.ts
export default class EntryAbility extends UIAbility {
  …
  onWindowStageCreate(windowStage: window.WindowStage): void {
    …
    AppStorage.setOrCreate("windowStage", windowStage)//保存windowStage
    …
  }
  …
}
2、rightPage.ets
import { window } from '@kit.ArkUI';
Text('弹出日历')
  .height(50)
  .onClick(() => {
    let windowStage_: window.WindowStage = AppStorage.get("windowStage") as window.WindowStage;
    windowStage_.createSubWindow("subWindow", (err, win) => { //创建透明子窗口并打开
      win.setUIContent('pages/TestOpenPage');
      win.showWindow();
    })
  })
3、TestOpenPage.ets
import { window } from '@kit.ArkUI';

@Entry
@Component
struct TestOpenPage {
  @State message: string = 'TestOpenPage';

  aboutToAppear() {
    window.findWindow("subWindow").setWindowBackgroundColor("#99000000")//设置子窗口背景透明
  }

  onBackPress() {//关闭子窗口
    window.findWindow("subWindow").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)
      }
      .height(300)
      .width('100%')
      .backgroundColor(Color.White)
    }
    .backgroundColor("#00000000")//组件背景,可以修改为#00000000透明
    .height('100%')
  }
}
分享
微博
QQ
微信
回复
1天前
相关问题
HarmonyOS 如何设置背景透明度
24浏览 • 1回复 待解决
HarmonyOS 如何设置颜色透明度
770浏览 • 1回复 待解决
HarmonyOS color颜色怎么指定透明度
794浏览 • 1回复 待解决
自定义颜色透明度如何实现?
389浏览 • 1回复 待解决
SideBarContainer如何设置透明度
2360浏览 • 1回复 待解决
背景透明度问题解决方案
618浏览 • 1回复 待解决
HarmonyOS 如何实现透明度渐变效果
23浏览 • 1回复 待解决
设置子窗口透明度未生效
1746浏览 • 1回复 待解决
HarmonyOS Image UI 如何设置图片透明度
31浏览 • 1回复 待解决
如何将背景颜色设置为透明
2676浏览 • 1回复 待解决