在HarmonyOS NEXT开发中Swiper嵌套的页面包含Canvas时，如何让Canvas可以响应左右滑动事件，但是不响应上下滑动？

Question

在HarmonyOS NEXT开发中Swiper嵌套的页面包含Canvas时，如何让Canvas可以响应左右滑动事件，但是不响应上下滑动？Swiper嵌套的页面包含Canvas时，如何让Canvas可以响应左右滑动事件我这边使用下面的方式给Canvas加了滑动事件监听，但是没触发：

.priorityGesture(GestureGroup(GestureMode.Exclusive, 
  SwipeGesture() 
    .onAction((event: GestureEvent) => { 
      if (event && this.klineQuotaModel) { 
      } 
    }) 
))

Answer 1

如下demo，可以触发onAction事件，且在Canvas区域滑动时，Swiper不滑动

@Component 
struct CanvasExample1 { 
  //用来配置CanvasRenderingContext2D对象的参数，包括是否开启抗锯齿，true表明开启抗锯齿。 
  private settings: RenderingContextSettings = new RenderingContextSettings(true) 
  //用来创建CanvasRenderingContext2D对象，通过在canvas中调用CanvasRenderingContext2D对象来绘制。 
  private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) 
 
  build() { 
    Column() { 
      //在canvas中调用CanvasRenderingContext2D对象。 
      Canvas(this.context) 
        .width('100%') 
        .height('100%') 
        .backgroundColor('#F5DC62') 
        .onReady(() => { 
          //可以在这里绘制内容。 
          this.context.strokeRect(50, 50, 200, 150); 
        }) 
        .priorityGesture(GestureGroup(GestureMode.Exclusive, 
          SwipeGesture() 
            .onAction((event: GestureEvent) => { 
              console.log('Canvas响应，swiper不响应') 
            }) 
        )) 
 
        .hitTestBehavior(HitTestMode.Block) 
        .width('80%') 
        .height('50%') 
 
 
      Text('Canvas') 
        .width('80%') 
        .height('50%') 
    } 
    .width('100%') 
    .height('100%') 
    .backgroundColor(Color.Red) 
  } 
} 
 
@Entry 
@Component 
struct Index47 { 
  private swiperController: SwiperController = new SwiperController() 
 
  build() { 
    Swiper(this.swiperController) { 
      Text('0') 
        .width('100%') 
        .height('100%') 
        .backgroundColor(Color.Gray) 
        .textAlign(TextAlign.Center) 
        .fontSize(30) 
 
      Text('1') 
        .width('100%') 
        .height('100%') 
        .backgroundColor(Color.Green) 
        .textAlign(TextAlign.Center) 
        .fontSize(30) 
 
      Text('2') 
        .width('100%') 
        .height('100%') 
        .backgroundColor(Color.Pink) 
        .textAlign(TextAlign.Center) 
        .fontSize(30) 
      CanvasExample1() 
    } 
    .loop(false) 
  } 
}