HarmonyOS 组件旋转后,平移方向出错

组件旋转后,组件的x, y轴还是原来的方向。代码:

import json from '@ohos.util.json'

@Entry
@Component
struct Index {
  @State imageWidth: number = 0
  @State imageHeight: number = 0
  @State offsetX: number = 0
  @State offsetY: number = 0
  @State positionX: number = 0
  @State positionY: number = 0
  @State angle: number = 0
  @State rotateValue: number = 0
  @State scaleValue: number = 1
  @State pinchValue: number = 1
  @State pinchX: number = 0
  @State pinchY: number = 0
  @State centerX: number = 0
  @State centerY: number = 0

  aboutToAppear(): void {

  }

  build() {
    Column() {
      Text('标题栏')
        .width('100%')
        .height(50)
        .textAlign(TextAlign.Center)

      Column() {
        Image($r('app.media.img'))
          .width(200)
          .height(200)
          .scale({ x: this.scaleValue, y: this.scaleValue, z: 1 })
          .translate({ x: this.offsetX, y: this.offsetY, z: 0 })
          .rotate({
            angle: this.angle,
          })
          .gesture(GestureGroup(GestureMode.Parallel,
            PanGesture()
              .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
                console.info('Pan end')
              }),

            RotationGesture()
              .onActionUpdate((event: GestureEvent) => {
                if (event) {
                  this.angle = this.rotateValue + event.angle

                }
              })
              .onActionEnd((event: GestureEvent) => {
                this.rotateValue = this.angle
                console.error(`${json.stringify(event)}`)
                console.error(`${this.rotateValue}`)
                console.info('Rotation end')
              })
          )
          )
      }.width(500).height(500)

    }
  }
}

HarmonyOS
4天前
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
zbw_apple

可以将gesture组合手势放在父组件进行规避,代码如下:

import json from '@ohos.util.json'

@Entry
@Component
struct Index {
  @State imageWidth: number = 0
  @State imageHeight: number = 0
  @State offsetX: number = 0
  @State offsetY: number = 0
  @State positionX: number = 0
  @State positionY: number = 0
  @State angle: number = 0
  @State rotateValue: number = 0
  @State scaleValue: number = 1
  @State pinchValue: number = 1
  @State pinchX: number = 0
  @State pinchY: number = 0
  @State centerX: number = 0
  @State centerY: number = 0

  aboutToAppear(): void {

  }

  build() {
    Column() {
      Text('标题栏')
        .width('100%')
        .height(50)
        .textAlign(TextAlign.Center)

      Column() {
        Image($r('app.media.app_icon'))
          .width(200)
          .height(200)
          .scale({ x: this.scaleValue, y: this.scaleValue, z: 1 })
          .translate({ x: this.offsetX, y: this.offsetY })
          .rotate({
            angle: this.angle,
          })

      }.width(500).height(500)
      .gesture(GestureGroup(GestureMode.Parallel,
        PanGesture()
          .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
            console.info('Pan end')
          }),

        RotationGesture()
          .onActionUpdate((event: GestureEvent) => {
            if (event) {
              this.angle = this.rotateValue + event.angle

            }
          })
          .onActionEnd((event: GestureEvent) => {
            this.rotateValue = this.angle
            console.error(`${json.stringify(event)}`)
            console.error(`${this.rotateValue}`)
            console.info('Rotation end')
          })
      )
      )
    }
  }
}
分享
微博
QQ
微信
回复
4天前
相关问题
HarmonyOS 平移动画
16浏览 • 1回复 待解决
Tabs组件选中下划线需要平移动效
1731浏览 • 1回复 待解决
求助,自定义组件到底哪里出错了?
1969浏览 • 1回复 待解决
Automaticallt generate signature出错
311浏览 • 1回复 待解决
SparkSQL整合mongodb出错
5713浏览 • 1回复 待解决
HarmonyOS 设备自动旋转
38浏览 • 1回复 待解决
如何实现一个组件不停地旋转
2261浏览 • 1回复 待解决
mysql + amoeba3.0.5 提示出错
2422浏览 • 0回复 待解决
windows中安装hpm出错
7493浏览 • 1回复 待解决