PixiJS - 并非所有的 touchend 事件都会触发（在 displayObject 之外）

Question

Pixijs (3.0.8) 支持多点触控，如他们的演示所示，我已经为我的手机上的触摸设置了 start、move 和 end 侦听器设备。

触摸记录在 canvas 内的一个正方形上，我将其称为 interactiveArea，但触摸结束事件也会在离开该区域时触发。这种行为适用于单个鼠标光标。

然而，当使用更多手指时，触摸标识符 0、1 和 2，只有第一个 touchEnd 在区域外触发。所以我在 interactiveArea 内按住 3 个手指，然后将它们全部移出。然后我放开1，然后是其他的。我不会收到事件 0 和 2 的 touchEnds 通知，我必须重新注册 3 次触摸并正确放手才能触发 2 的触摸端！

关于如何检测所有触摸端而不是让它在第一个触摸端停止的任何提示？我也尝试过使用 setTimeout hack，但这确实不适合我的用例。

Edit 我做了一个基本的代码笔来演示 touchendoutside 如何只被触发一次。 https://codepen.io/Thomaswithaar/pen/EygRjM 请务必在移动设备上访问笔，因为它是关于触摸而不是鼠标交互。两根手指按住红色方块然后移开再放开只会触发一个touchendoutside事件

Answer 1

查看PIXI源码，Interaction Manager确实存在bug。下面是处理触摸结束事件的方法：

InteractionManager.prototype.processTouchEnd = function ( displayObject, hit )
{
    if(hit)
    {
        this.dispatchEvent( displayObject, 'touchend', this.eventData );

        if( displayObject._touchDown )
        {
            displayObject._touchDown = false;
            this.dispatchEvent( displayObject, 'tap', this.eventData );
        }
    }
    else
    {
        if( displayObject._touchDown )
        {
            displayObject._touchDown = false;
            this.dispatchEvent( displayObject, 'touchendoutside', this.eventData );
        }
    }
};

您可以在 else 语句中看到，当 displayObject._touchDown 为真时，将调度 touchendoutside 事件。但是在你松开第一根手指后，它会将标志设置为 false。这就是为什么您只收到一次该事件。

我在这里打开了一个问题： https://github.com/pixijs/pixi.js/issues/2662

并在此处提供了修复： https://github.com/karmacon/pixi.js/blob/master/src/interaction/InteractionManager.js 此解决方案删除标志并改用计数器。我还没有测试过，所以请告诉我它是否有效。

PixiJS - 并非所有的 touchend 事件都会触发（在 displayObject 之外）

PixiJS - Not all touchend events triggering (outside of displayObject)

pixi.js