HarmonyOS 5.0 应用开发——全屏模态框

bindContentCover(isShow: boolean, builder: CustomBuilder, type?: ModalTransition): T;

@State isshow: boolean = false //控制模态框出现和消失  // 图片转场动画private anim: TransitionEffect = TransitionEffect.OPACITY.animation({ curve: curves.springMotion() })

@Buildergencover() {//构建模态框界面  Column() {    Image(this.img).width('100%').onClick(() => {      this.isshow = false    })      // 出现和小时动画      .transition(this.anim)      //一镜到底      .geometryTransition('img')
  }  .width('100%')  .height('100%')  .justifyContent(FlexAlign.Center)  .padding(5)  .backgroundColor('rgba(0,0,0,0.5)')}

Image(this.img)  .width('60%')  .border({    width: 2,    color: Color.Black,    radius: 10,    style: BorderStyle.Dotted  })    // 一镜到底  .geometryTransition('img')    // 全屏模态框  .bindContentCover(this.isshow, this.gencover(), ModalTransition.ALPHA)  .onClick(() => {    this.isshow = true  })

import { curves } from '@kit.ArkUI';
@Entry@Componentstruct Contentcover {  @State img: Resource = $r('app.media.yangmi1')//图片资源  @State isshow: boolean = false  // 图片转场动画  private anim: TransitionEffect = TransitionEffect.OPACITY.animation({ curve: curves.springMotion() })
  @Builder  gencover() {//构建模态框界面    Column() {      Image(this.img).width('100%').onClick(() => {        this.isshow = false      })        // 出现和小时动画        .transition(this.anim)        //一镜到底        .geometryTransition('img')
    }    .width('100%')    .height('100%')    .justifyContent(FlexAlign.Center)    .padding(5)    .backgroundColor('rgba(0,0,0,0.5)')  }
  build() {    Column() {      Image(this.img)        .width('60%')        .border({          width: 2,          color: Color.Black,          radius: 10,          style: BorderStyle.Dotted        })          // 一镜到底        .geometryTransition('img')          // 全屏模态框        .bindContentCover(this.isshow, this.gencover(), ModalTransition.ALPHA)        .onClick(() => {          this.isshow = true        })    }    .height('100%')    .width('100%')    .justifyContent(FlexAlign.Center)  }}