五、旋轉(zhuǎn)手勢（RotationGesture）

1. RotationGesture(value?:{fingers?:number; angle?:number})

旋轉(zhuǎn)手勢用于觸發(fā)旋轉(zhuǎn)手勢事件，觸發(fā)旋轉(zhuǎn)手勢的最少手指數(shù)量為2指，最大為5指，最小改變度數(shù)為1度，擁有兩個可選參數(shù)：

fingers：非必選參數(shù)，用于聲明觸發(fā)旋轉(zhuǎn)手勢所需要的最少手指數(shù)量，最小值為2，最大值為5，默認值為2。

angle：非必選參數(shù)，用于聲明觸發(fā)旋轉(zhuǎn)手勢的最小改變度數(shù)，單位為deg，默認值為1。

以在Text組件上綁定旋轉(zhuǎn)手勢實現(xiàn)組件的旋轉(zhuǎn)為例，可以通過在旋轉(zhuǎn)手勢的回調(diào)函數(shù)中獲取旋轉(zhuǎn)角度，從而實現(xiàn)組件的旋轉(zhuǎn)：

// xxx.ets
@Entry
@Component
struct Index {
  @State angle: number = 0;
  @State rotateValue: number = 0;

  build() {
    Column() {
      Text('RotationGesture angle:' + this.angle).fontSize(28)
        // 在組件上綁定旋轉(zhuǎn)布局，可以通過修改旋轉(zhuǎn)角度來實現(xiàn)組件的旋轉(zhuǎn)
        .rotate({ angle: this.angle })
        .gesture(
          RotationGesture()
            .onActionStart((event: GestureEvent) => {
              console.info('RotationGesture is onActionStart');
            })
              // 當旋轉(zhuǎn)手勢生效時，通過旋轉(zhuǎn)手勢的回調(diào)函數(shù)獲取旋轉(zhuǎn)角度，從而修改組件的旋轉(zhuǎn)角度
            .onActionUpdate((event: GestureEvent) => {
              this.angle = this.rotateValue + event.angle;
              console.info('RotationGesture is onActionEnd');
            })
              // 當旋轉(zhuǎn)結(jié)束抬手時，固定組件在旋轉(zhuǎn)結(jié)束時的角度
            .onActionEnd(() => {
              this.rotateValue = this.angle;
              console.info('RotationGesture is onActionEnd');
            })
            .onActionCancel(() => {
              console.info('RotationGesture is onActionCancel');
            })
        )
    }
    .height(200)
    .width(250)
  }
}

六、滑動手勢（SwipeGesture）

1. SwipeGesture(value?:{fingers?:number; direction?:SwipeDirection; speed?:number})

滑動手勢用于觸發(fā)滑動事件，當滑動速度大于100vp/s時可以識別成功，擁有三個可選參數(shù)：

fingers：非必選參數(shù)，用于聲明觸發(fā)滑動手勢所需要的最少手指數(shù)量，最小值為1，最大值為10，默認值為1。

direction：非必選參數(shù)，用于聲明觸發(fā)滑動手勢的方向，此枚舉值支持邏輯與（&）和邏輯或（|）運算。默認值為SwipeDirection.All。

speed：非必選參數(shù)，用于聲明觸發(fā)滑動的最小滑動識別速度，單位為vp/s，默認值為100。

以在Column組件上綁定滑動手勢實現(xiàn)組件的旋轉(zhuǎn)為例：

// xxx.ets
@Entry
@Component
struct Index {
  @State rotateAngle: number = 0;
  @State speed: number = 1;

  build() {
    Column() {
      Column() {
        Text("SwipeGesture speed\n" + this.speed)
        Text("SwipeGesture angle\n" + this.rotateAngle)
      }
      .border({ width: 3 })
      .width(300)
      .height(200)
      .margin(100)
      // 在Column組件上綁定旋轉(zhuǎn)，通過滑動手勢的滑動速度和角度修改旋轉(zhuǎn)的角度
      .rotate({ angle: this.rotateAngle })
      .gesture(
        // 綁定滑動手勢且限制僅在豎直方向滑動時觸發(fā)
        SwipeGesture({ direction: SwipeDirection.Vertical })
          // 當滑動手勢觸發(fā)時，獲取滑動的速度和角度，實現(xiàn)對組件的布局參數(shù)的修改
          .onAction((event: GestureEvent) => {
            this.speed = event.speed;
            this.rotateAngle = event.angle;
          })
      )
    }
  }
}

?

說明：當SwipeGesture和PanGesture同時綁定時，若二者是以默認方式或者互斥方式進行綁定時，會發(fā)生競爭。SwipeGesture的觸發(fā)條件為滑動速度達到100vp/s，PanGesture的觸發(fā)條件為滑動距離達到5vp，先達到觸發(fā)條件的手勢觸發(fā)?？梢酝ㄟ^修改SwipeGesture和PanGesture的參數(shù)以達到不同的效果。?文章來源地址http://www.zghlxwxcb.cn/news/detail-708331.html

到了這里，關(guān)于HarmonyOS/OpenHarmony(Stage模型）應(yīng)用開發(fā)單一手勢（三）的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！