想要实现一个宽度充满屏幕的dialog弹窗，应该怎么实现？

想要实现一个宽度充满屏幕的dialog弹窗，应该怎么实现，文档上没找到相应属性。

HarmonyOS

zxjiu

2024-10-11 10:26:32

浏览

回答 1

待解决

回答 1

按赞同

按时间

put_get

全局弹窗示例代码:

//1.全局开启沉浸式模式  
let windowClass: window.Window = windowStage.getMainWindowSync(); // 获取应用主窗口  
let isLayoutFullScreen = true;  
try {  
  let promise = windowClass.setWindowLayoutFullScreen(isLayoutFullScreen);  
  promise.then(() => {  
    console.info('Succeeded in setting the window layout to full-screen mode.');  
  }).catch((err: BusinessError) => {  
    console.error('Failed to set the window layout to full-screen mode. Cause:' + JSON.stringify(err));  
  });  
} catch (exception) {  
  console.error('Failed to set the window layout to full-screen mode. Cause:' + JSON.stringify(exception));  
}  
  
//2.自定义弹窗  
@CustomDialog  
export struct CustomerDialog {  
  controller: CustomDialogController  
  
  build() {  
    Column() {  
      Text("提示")  
      Row() {  
        Button('取消', {  
          type: ButtonType.Normal  
        })  
          .width(100)  
          .height(30)  
          .attributeModifier(new TextBodyModifier())  
          .onClick(() => {  
  
          })  
          .fontColor(0x666666)  
          .borderRadius({  
            bottomLeft: 8,  
            bottomRight: 8  
          })  
        Button('确定', {  
          type: ButtonType.Normal  
        })  
          .width(100)  
          .height(30)  
          .attributeModifier(new TextBodyModifier())  
          .onClick(() => {  
          })  
          .fontColor(0x333333)  
          .borderRadius({  
            bottomLeft: 8,  
            bottomRight: 8  
          })  
      }.justifyContent(FlexAlign.SpaceAround)  
    }  
    .width(280)  
    .height(280)  
    .borderRadius(8)  
    .backgroundColor(Color.White)  
    .alignItems(HorizontalAlign.Center)  
    .justifyContent(FlexAlign.SpaceEvenly)  
  }  
}  
private controller: CustomDialogController = new CustomDialogController({  
  builder: CustomerDialog({  
  }),  
  alignment: DialogAlignment.Center,  
  autoCancel: false,  
  customStyle: true,  
  cancel: () => {  
    router.back()  
  }