HarmonyOS 二级页面左滑关闭问题

二级页面如何防止被从屏幕边缘滑动关闭掉?

HarmonyOS
2024-10-16 10:12:39
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
Heiang

onwilldismiss参考文档:https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/ts-methods-custom-dialog-box-V5

参考这个demo:

import promptAction from '@ohos.promptAction';  
@Component  
export struct Test1 {  
  @State message: string = 'Hello World';  
  onBackPress() {  
    console.info('IndexComponent onBackPress');  
    return true;  
  }  
  build() {  
    NavDestination(){  
      Row() {  
        Column() {  
          Text(this.message)  
            .fontSize(50)  
            .fontWeight(FontWeight.Bold)  
        }  
        .width('100%')  
      }  
      .height('100%')  
    }.onBackPressed(()=>{  
      promptAction.showToast({message:'123'})  
      return false  
    })  
  }  
}  
@Entry  
@Component  
struct Index {  
  @Provide('pageInfos') pageInfos: NavPathStack = new NavPathStack()  
  @State textValue: string = '输入'  
  // 显隐控制设置为不占用  
  @State visible: Visibility = Visibility.None  
  @Builder  
  PageMap(name: string) {  
    if (name === 'pageOne') {  
      Test1()  
    }  
  }  
  onBackPress() {  
    console.info('IndexComponent onBackPress');  
    return true;  
  }  
  build() {  
    Navigation(this.pageInfos) {  
      Column() {  
        Stack() {  
          Row() {  
            Column() {  
              Text('我是第一个页面')  
                .fontSize(30)  
                .fontWeight(FontWeight.Bold)  
              Button('按钮')  
                .onClick(() => {  
                  //用于检测点击事件是否透传到原来的页面,我测了一下是没有透传的,符合dialog规范  
                  console.log("hit me!")  
                  if (this.visible == Visibility.Visible) {  
                    this.visible = Visibility.None  
                  } else {  
                    this.visible = Visibility.Visible  
                  }  
                })  
                .backgroundColor(0x777474)  
                .fontColor(0x000000)  
            }  
            .height('100%')  
            .width('100%')  
            .justifyContent(FlexAlign.Start)  
            .alignItems(HorizontalAlign.Center)  
          }  
          .height('100%')  
          .backgroundColor('#FFF')  
          //这里开始是构造弹窗效果主要需要修改的地方,首先是加了一个半透明灰色的蒙层效果  
          Text('')  
            .onClick(() => {  
              if (this.visible == Visibility.Visible) {  
                this.visible = Visibility.None  
              } else {  
                this.visible = Visibility.Visible  
              }  
            })  
            .width('100%')  
            .height('100%')// 透明度可以自己调节一下  
            .opacity(0.5)  
            .backgroundColor(Color.Black)  
            .visibility(this.visible)  
          Column() {  
            // 这个可以调节对话框效果,栅格布局,xs,sm,md,lg分别为四种规格  
            // 下面的breakpoints是用来区别当前属于哪个类型的断点  
            // gridRow里的栅格数量为总数,gridCol里的就是偏移和假Dialog所占据的栅格数  
            GridRow({  
              columns: { xs: 1, sm: 4, md: 8, lg: 12 },  
              breakpoints: { value: ["400vp", "600vp", "800vp"],  
                reference: BreakpointsReference.WindowSize },  
            }) {  
              GridCol({  
                span: { xs: 1, sm: 2, md: 4, lg: 8 },  
                offset: { xs: 0, sm: 1, md: 2, lg: 2 }  
              }) {  
                // 这里放的就是原Dialog里的column里的东西,稍微改改应该就可以用了  
                Column() {  
                  Text('安全隐私').fontSize(20).margin({ top: 10, bottom: 10 })  
                  Text('是否跳转到隐私详情页面?').fontSize(16).margin({ bottom: 10 })  
                  Flex({ justifyContent: FlexAlign.SpaceAround }) {  
                    Button('取消')  
                      .onClick(() => {  
                        if (this.visible == Visibility.Visible) {  
                          this.visible = Visibility.None  
                        } else {  
                          this.visible = Visibility.Visible  
                        }  
                      }).backgroundColor(0xffffff).fontColor(Color.Black)  
                    Button('确定')  
                      .onClick(() => {  
                        this.pageInfos.pushPath({ name: 'pageOne' })  
                      }).backgroundColor(0xffffff).fontColor(Color.Red)  
                  }.margin({ bottom: 10 })  
                }  
                .backgroundColor(0xffffff)  
                .visibility(this.visible)  
                .clip(true)  
                .borderRadius(20)  
              }  
            }  
          }.width('100%') //设置弹窗宽度  
        }  
      }.width('100%').margin({ top: 5 })  
    }.navDestination(this.PageMap)  
  }  
}
分享
微博
QQ
微信
回复
2024-10-16 15:55:36
相关问题
HarmonyOS 点击tabs如何跳转到二级页面
406浏览 • 1回复 待解决
Navigation二级导航嵌套
1241浏览 • 1回复 待解决
HarmonyOS 页面禁止
229浏览 • 1回复 待解决
HarmonyOS 需要二级联动的demo
299浏览 • 1回复 待解决
二级浮层的出场动画实现
750浏览 • 1回复 待解决
HarmonyOS list 字体显示异常
18浏览 • 1回复 待解决
【JS】如何实现删除功能?
3453浏览 • 1回复 待解决