命中-仅测试文本颤动

Question

我目前正在与其他一些人在一个项目中，我们想要跟踪字母，单词等。所以我们有字体的地方，字母看起来像这样(尼拉姆跟踪字体)

​

​

我们试图实现的是检测用户的绘制是否发生在字母内部，在我们将其更改为以下内容之前，这是一个Text-Widget。

目前我们发现的唯一方法是获取字母，将它们从外部转换为它们的路径，因为没有颤动函数来实现这一点。在我们有了路径之后，我们就可以对字母的内部进行重新着色。

在代码中，我们检查添加到字母内部的颜色(以及字母内部的路径，即箭头和虚线)。

Listener(
          onPointerMove: (PointerEvent details) {
            final RenderBox boxYellow =
                _keyYellow.currentContext.findRenderObject();
            final result = BoxHitTestResult();
            Offset localYellow = boxYellow.globalToLocal(details.position);
            if (boxYellow.hitTest(result, position: localYellow)) {
              print("HIT...YELLOW ");
            }
            final RenderBox boxRed = _keyRed.currentContext.findRenderObject();
            final resultRed = BoxHitTestResult();
            Offset localRed = boxRed.globalToLocal(details.position);
            if (boxRed.hitTest(resultRed, position: localRed) !=
                boxYellow.hitTest(result, position: localYellow)) {
              print("HIT...RED ");
            }
          },
          child: CustomPaint(
            key: _keyYellow,
            size: Size(197.67,
                271.03), //You can Replace [WIDTH] with your desired width for Custom Paint and height will be calculated automatically
            painter: RPSCustomPainter(),
          ),
        ),

由于这对于27个字母(2倍于小写字母和大写字母)和10个数字(0..9)来说是非常繁琐的，我们想知道是否有更好/更智能/更简单的方法来实现这种命中测试。由于潜在的问题是每个文本窗口小部件都有自己的矩形边界框，而且命中测试不能被修改为只对文本本身起作用，所以如果你命中文本框而不是“纯”文本，它将始终返回true。

​

​

Answer 1

这是可以做到的，尽管相当复杂。基本上，您要做的是在RenderRepaintBoundary中包装显示文本的区域，然后当用户点击时，您可以在该边界内找到已按下的点。

此时，您可以调用RenderRepaintBoundary:toImage来获取图像的字节，然后使用image包对其进行解码，并从您检测到的点获取字节。将这些字节转换为颜色，这样就可以了！

实际上有一个包可以用来做这件事-- pixel color picker。但是，由于您的文本是静态的(我假设)，并且您可能需要对其进行大量的命中测试，因此我建议您采用其中的一些代码(当然，使用适当的许可=D)，并根据您的特定需求调整它-这样您就可以做一些事情，比如缓存图像，这样您只需要生成/解析它一次(因为这可能是昂贵的)。