在CustomDialog中打开新的页面,CustomDialog会自动消失

在CustomDialog中打开新的页面,CustomDialog会自动消失,如何解决。

代码描述:

ActionSheetExample.ets:

import { CustomDialogExample } from'…/view/CustomDialogExample'; 
import { UIContext } from '@ohos.arkui.UIContext'; 
import common from '@ohos.app.ability.common'; 
import { DialogManager } from '…/view/DialogManager'; 
 
@Entry 
@Component 
struct ActionSheetExample { 
  @State textValue: string = '' 
  @State inputValue: string = 'click me' 
  @State angle: number = 0 
 
  dialogController: CustomDialogController | null = new CustomDialogController({ 
    builder: CustomDialogExample(), 
    autoCancel: true, 
    alignment: DialogAlignment.Bottom, 
    openAnimation: { duration: 0 }, 
    closeAnimation: { duration: 0 }, 
    offset: { dx: 0, dy: 0 }, 
    // maskColor: ‘rgba(0, 0, 0, 0)’, 
    customStyle: true 
  }) 
 
  constructor() { 
    super() 
  } 
 
  build() { 
    Column() { 
      Text('rotate').width('90%').fontColor(0xCCCCCC).padding(15).fontSize(14) 
      Row() 
        .rotate({ 
          x: 0, 
          y: 0, 
          z: 1, 
          angle: this.angle 
        })// 组件以矢量(0,0,1)为旋转轴,绕中心点顺时针旋转300度 
        .width(100) 
        .height(50) 
        .backgroundColor(0xAFEEEE) 
        .onClick(() => { 
          animateTo({ curve: Curve.Ease, onFinish: () => { 
          }, duration: 300 }, () => { 
            this.angle += 180 
          }) 
        }) 
 
      Button(this.inputValue) 
        .onClick(() => { 
          if (this.dialogController != null) { 
            this.dialogController.open() 
          } 
        }).backgroundColor(0x317aff) 
        .margin(20) 
      Button('打开CallerPage').onClick(() => { 
        let context = getContext(this) as common.UIAbilityContext 
        context.startAbility({ 
          bundleName: "com.example.myapplication", 
          abilityName: "CallerAbility", 
        }).catch((err: Error) => { 
          console.log(err.message) 
        }) 
      }) 
    }.width('100%').margin({ top: 5 }) 
  } 
}

CustomDialogExample.ets

import common from '@ohos.app.ability.common'; 
import router from '@ohos.router'; 
 
@CustomDialog 
@Preview 
export struct CustomDialogExample { 
  @State dialogHeight: number = 0 
  controller?: CustomDialogController 
  initOffsetY: number = 0; 
  datas: Array<number> = [1, 2] 
  initHeight: number = 60 * this.datas.length + 90 
  topBorderRadius: number = 20; 
  closeFlag: boolean = false; 
  open = () => { 
    this.moveTo(this.initHeight) 
  } 
  close = () => { 
    this.moveTo(0).then(() => { 
      this.controller?.close() 
    }) 
  } 
  moveTo = (height: number) => { 
    return new Promise<void>((res) => { 
      animateTo({ curve: Curve.Ease, onFinish: res, duration: 300 }, () => { 
        this.dialogHeight = height 
      }) 
    }) 
  } 
 
  // 阻尼函数 
  damping(x: number, max: number) { 
    let y = Math.abs(x); 
    y = 0.82231 * max / (1 + 4338.47 / Math.pow(y, 1.14791)); 
    return Math.round(x < 0 ? -y : y); 
  } 
 
  build() { 
    Column() { 
      Column() { 
        Column() { 
          Row() { 
            Text('Title') 
          } 
          .width('100%') 
          .height(30) 
            .justifyContent(FlexAlign.Center) 
 
          Scroll() { 
            Column() { 
              ForEach(this.datas, () => { 
                Column() { 
                  Image($r('app.media.startIcon')) 
                    .width(50) 
                    .height(50) 
                } 
                .onClick(()=>{ 
                  // let context = getContext(this) as common.UIAbilityContext 
                  // context.startAbility({ 
                  //   bundleName: "com.example.myapplication", 
                  //   abilityName: "CallerAbility", 
                  // }).catch((err: Error) => { 
                  //   console.log(err.message) 
                  // }) 
                  router.pushUrl({ 
                    url:'pages/Index' 
                  }) 
                }) 
                .width('100%') 
                .margin({ top: 10 }) 
                .justifyContent(FlexAlign.Center) 
              }) 
            } 
 
          } 
 
        } 
        .layoutWeight(1) 
 
        Row() { 
          Button('取消') 
            .onClick(() => { 
              this.close() 
            }).width('100%').backgroundColor(0xffffff).fontColor(Color.Black) 
        } 
        .backgroundColor(Color.Red) 
        .width('100%') 
        .height(50) 
      } 
      .justifyContent(FlexAlign.SpaceBetween) 
      .height(this.dialogHeight) 
      .width('100%') 
      .backgroundColor(Color.White) 
      .onAppear(this.open) 
      .zIndex(2) 
      .borderRadius({ topLeft: this.topBorderRadius, topRight: this.topBorderRadius }) 
 
      Column() 
        .width('100%') 
        .height('100%') 
        .backgroundColor(0x33000000) 
        .position({ x: 0, y: 0 }) 
        .zIndex(1) 
    } 
    .width('100%') 
    .height('100%') 
    .justifyContent(FlexAlign.End) 
    // .borderRadius({ topLeft: 40, topRight: 40, bottomLeft: 0, bottomRight: 0 }) 
  } 
}
HarmonyOS
2024-06-05 20:24:00
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
hm_yxd

通过使用Stack替代CustomDialog,再控制Stack的显隐即可达到效果。

分享
微博
QQ
微信
回复
2024-06-06 21:12:50
相关问题
customDialog焦点透传
358浏览 • 1回复 待解决
CustomDialog如何实现半模态详情页效果
645浏览 • 1回复 待解决
MongoDB如何创建一个数据库?
2516浏览 • 1回复 待解决
LocalStorageLink修饰变量自动保存
560浏览 • 1回复 待解决
【ets】switch开关打开后会自动关闭
2245浏览 • 1回复 待解决
弹窗跳转到页面后返回弹窗不消失
478浏览 • 1回复 待解决