如何实现模态转场操作过程？

import { AlertDialog } from '@ohos.arkui.advanced.Dialog'  
import matrix4 from '@ohos.matrix4'  
import { curves } from '@kit.ArkUI'  
import { TestComponent } from './TestComponent'  
  
@Entry  
@Preview  
@Component  
struct Index {  
  @State @Watch("onShowThisComponentChange") showThisComponent: boolean = false  
  onShowThisComponentChange() {  
    console.log("xxx", `onShowThisComponentChange = ${this.showThisComponent}`)  
  }  
  
  build() {  
    Stack() {  
      Button("Open TestComponent by Modal")  
        .onClick(() => {  
          this.showThisComponent = !this.showThisComponent  
        })  
      if(this.showThisComponent){  
        TestComponent({  
          showThisComponent: this.showThisComponent  
        })  
          .transition(  
            TransitionEffect.translate({ y: 1000 }).animation({ curve: curves.springMotion(0.6, 0.8) })  
          )  
      }  
    }  
    .alignContent(Alignment.Center)  
    // .bindContentCover(this.showThisComponent, this.testComponent(), ModalTransition.NONE)  
    .height("100%")  
    .width("100%")  
    .backgroundColor(Color.Orange)  
  }  
}