javascript - 钛合金静态和动态绘图/绘画

Question

我正在开发一个应用程序(适用于 iOS 和 Android)，其中我需要允许用户从图库中选择照片并通过在图像上绘图来圈出某些项目。一旦用户完成绘制，系统就会提示他在弹出窗口中为该项目命名。命名项目后，该项目将添加到项目表中，并且箭头会自动连接圆圈和项目。照片和项目都有单独的表格。

我使用Ti.Paint进行绘图，但它只支持通过手指动态(手动)绘图。该模块没有任何方法以编程方式绘制直线、圆形等形状。此外，它不提供触摸事件，因此我无法检测用户何时停止绘图。然后我使用了Ti.Canvas，但它只支持静态绘图，即用户不能用手指动态绘图，而且它只支持iOS。我在两天内尝试了很多触摸事件来做到这一点，但没有成功。这是我使用 Ti.Canvas 进行触摸绘图的代码:

      canvas.addEventListener('touchstart',function(e) {
          canvas.begin();
          canvas.beginPath();
          canvas.moveTo(e.x,e.y);
      })

      canvas.addEventListener('touchmove',function(e) {
          canvas.lineTo(e.x,e.y);
          canvas.stroke();
      })

      canvas.addEventListener('touchend',function(e) {
          canvas.commit();
      })

但不幸的是这不起作用。有人可以告诉我如何解决这个问题吗？是否存在一些模块或库支持静态(编程)和手动(通过触摸)绘图。我将非常感激。谢谢。

Answer 1

我知道我有一个使用 touchend 的例子。在这个示例代码中，在 IOS 和 Android 上的操作可能不一样，有一个 touchend 的示例。 http://developer.appcelerator.com/blog/2010/05/building-an-advanced-transaction-ui-with-titanium.html

Ti.Paint 模块的源代码已可用，您可以向其中添加所需的功能。 https://github.com/appcelerator/titanium_modules/tree/master/paint

如果您不想走这条路，有一个 Canvas 模块可以让您创建线条，尽管我还没有测试过它。这似乎是 IOS 特定的。 https://github.com/appcelerator/titanium_modules/tree/master/canvas/mobile/ios

对于Android，看起来有一个模块。 https://marketplace.appcelerator.com/apps/5941?494596078

所以你有一些选择可以考虑。