即使使用自定义 FabricJS 构建也无法使用触摸手势

【问题标题】：Can't use touch gestures even with custom FabricJS builds即使使用自定义 FabricJS 构建也无法使用触摸手势
【发布时间】：2022-04-26 11:14:29
【问题描述】：

我一直在尝试让 FabricJs 画布与多点触控平移和缩放一起使用，但无济于事。我尝试了无数的自定义构建，但该事件没有任何可处理的触摸信息。这是我使用的代码：

              let fabricCanvas = new fabric.Canvas('myCanvas', {
                width: canvasContainer.current.offsetWidth,
                height: canvasContainer.current.offsetHeight,
                isDrawingMode: true
              })
              fabricCanvas.on({
                'touch:gesture': function(e) {
                  console.log(e) // returns empty object wen fired with fabricCanvas.fire("touch:gesture")
                }
              });
              fabricCanvas.fire("touch:gesture") // I can only make the listener fire, by doing this

如何使提供的手势正常工作？

【问题讨论】：

标签： fabricjs

【解决方案1】：

如果您查看库代码，当isDrawingMode 为真时，会有一行阻止手势事件被触发。

在/src/mixins/canvas_gestures.mixin.js

__onTransformGesture: function(e, self) {

      if (this.isDrawingMode || !e.touches || e.touches.length !== 2 || 'gesture' !== self.gesture) {
        return;
      }

      var target = this.findTarget(e);
      if ('undefined' !== typeof target) {
        this.__gesturesParams = {
          e: e,
          self: self,
          target: target
        };

        this.__gesturesRenderer();
      }

      this.fire('touch:gesture', {
        target: target, e: e, self: self
      });
    },

我也在尝试将手势与绘图模式一起使用，但不知道为什么它会阻止绘图模式上的手势。

目前，我正在尝试使用带有修改源代码的自定义构建。

或者你可以尽量不使用isDrawingMode，使用鼠标事件来实现freedraw

【讨论】：