鸿蒙应用示例：仿钉钉日历新建日程

@Entry@Componentstruct Page02 {  @State offsetX: number = 0;  @State offsetY: number = 0;  @State positionX: number = 0;  @State positionY: number = 0;  @State @Watch('containerHeightChanged') containerHeight: number = 50;  @State originalHeight: number = 50;
  containerHeightChanged() {    if (this.containerHeight < 50) {      this.containerHeight = 50    }  }
  build() {    Column() {      RelativeContainer() {        Rect()          .fill("#2fd164")          .borderColor("#39bd66")          .borderWidth(1)          .borderRadius(5)          .clip(true)          .width("100%")          .height("100%")
        Text("再次点击新建日程")          .fontColor(Color.White)          .margin({ top: 30, left: 130 })          .fontSize(15)          .alignRules({            center: { anchor: "__container__", align: VerticalAlign.Top },            middle: { anchor: "__container__", align: HorizontalAlign.Start }          })
        Stack() {          Circle({ height: 5, width: 5 })            .fill(Color.White)            .stroke(Color.White)            .strokeWidth(2)        }        .hitTestBehavior(HitTestMode.Block)        .padding(20)        .margin({ left: 60 })        .alignRules({          center: { anchor: "__container__", align: VerticalAlign.Top },          middle: { anchor: "__container__", align: HorizontalAlign.Start }        })        .gesture(PanGesture({          fingers: 1,          direction: PanDirection.Vertical,          distance: 1        }).onActionUpdate((event: GestureEvent) => {          if (event) {            this.offsetY = this.positionY + event.offsetY;            this.containerHeight = this.originalHeight - event.offsetY;          }        }).onActionEnd(() => {          this.positionX = this.offsetX;          this.positionY = this.offsetY;          this.originalHeight = this.containerHeight;        })        )
        Stack() {          Circle({ height: 5, width: 5 })            .fill(Color.White)            .stroke(Color.White)            .strokeWidth(2)        }        .hitTestBehavior(HitTestMode.Block)        .padding(20)        .margin({ right: 60 })        .alignRules({          center: { anchor: "__container__", align: VerticalAlign.Bottom },          middle: { anchor: "__container__", align: HorizontalAlign.End }        })        .gesture(PanGesture({          fingers: 1,          direction: PanDirection.Vertical,          distance: 2        }).onActionUpdate((event: GestureEvent) => {          this.containerHeight = this.originalHeight + event.offsetY;        }).onActionEnd(() => {          this.originalHeight = this.containerHeight;        })        )      }      .height(this.containerHeight)      .width("80%")      .translate({ x: this.offsetX, y: this.offsetY })      .gesture(PanGesture({        fingers: 1,        direction: PanDirection.Vertical,        distance: 1      }).onActionUpdate((event: GestureEvent) => {        if (event) {          this.offsetX = this.positionX + event.offsetX;          this.offsetY = this.positionY + event.offsetY;        }      }).onActionEnd(() => {        this.positionX = this.offsetX;        this.positionY = this.offsetY;      })      )    }    .height('100%')    .width('100%')  }}