在画布中使用三星S-Pen

Question

我正在开发一个Web应用程序，用户应该可以在平板电脑上签署文档。我们使用Galaxy Tab 12.2，因为S-Pen具有所需的精度。 我使用的画布用于侦听要在画布上绘制的touch事件。

        canvas.addEventListener('touchstart', handleStart);
        canvas.addEventListener('touchmove' , handleMove);

问题在于，如果用户用手指触摸画布，画布会在那里画线。

有没有办法区分S-Pen事件和＆＃39;正常＆＃39;触摸事件？

我知道在带有Internet Expoler的Surface Pro 3上，我可以处理与手指输入不同的笔输入。

Answer 1

好的，所以我找到了一个自己很好的解决方案。 SPen会在ontouch和radiusX = 0的情况下触发radiusY个事件。

用手指触发的事件总是具有半径＆gt;所以要做的就是添加

if(e.targetTouches[0].radiusX === 0)

进入事件处理程序以在我的画布上绘制。

查看此Jsfiddle

Answer 2

S-Pen应该在接近屏幕时触发onMouseOver事件（取决于浏览器和S-Pen版本），您可以通过存储全局变量{{1}来利用它并将全局isSPen = false事件设置为onMouseOver变量。尝试使用不同的浏览器，看看哪些浏览器会提供活动，通常股票浏览器总能最佳。

如果这不起作用，您可能需要在app容器中托管您的网页; Android有true可以拿起S-Pen。您可以使用全屏WebView并使用Android的JavaScript消息传递API与其进行通信：Example

希望我帮助你，祝你好运