Flutter：InkWell和GestureDetector有什么区别？

Question

我完全是 Flutter 的新手，并发现了 InkWell 和 GestureDetector。它们看起来几乎相同。官方文档没有提供它们之间的深入比较。

1. 问题1： InkWell 和 GestureDetector 有什么区别？

2. 问题2： 何时使用哪个？

- sphoenix

Answer 1

区别：

1. 它们都提供许多共同的功能，例如onTap、onLongPress等。主要区别在于GestureDetector提供了更多的控制，如拖动等；另一方面，它不包括涟漪效果的轻触，而InkWell提供。

2. 您可以根据自己的需求使用其中任何一个，如果需要涟漪效果，则选择InkWell，如果需要更多的控制，则选择GestureDetector，甚至可以结合使用两者。

---

涟漪效果（使用InkWell）：

InkWell(
  onTap: () {},
  child: Ink(
    width: 200,
    height: 200,
    color: Colors.blue,
  ),
)

- CopsOnRoad

---

所以我猜如果我们想要效果和额外的事件，我们需要两个。 - Dani

怎么样同时拥有涟漪效果和更多的控制呢？ - Davoud Badamchi

主要的区别在于可访问性。如果您提供类似于GestsureDetector -> Semantics(value: changingBooleanValue) -> 自定义小部件，Talkback和VoiceOver不会被触发，而不是Inkwell。 - Sn1cKa

Answer 2

视觉差异

其他答案都是正确的。这是对应的视觉表示。

- MBK

---

需要将此内容添加到Flutter文档中。 - Teoman shipahi

Answer 3

我将尝试提及它们的功能差异。

GestureDetector 类非常广泛。您可以使用它检测用户与屏幕或小部件的每种交互类型，包括捏合、滑动、触摸以及自定义手势。

InkWell 仅能检测有限数量的手势，但可以为小部件装饰提供方式。

颜色：splashColor，focusColor，hoverColor...

边框：borderRadius，customBorder，...

希望这对你有所帮助！

- biniyam112

Answer 4

InkWell 使子组件的整个区域成为热点，易于接收用户交互。然而，GestureDetector 不会将子组件的整个区域作为热点，例如 padding 区域不是热点。因此，使用 GestureDetector 经常会导致用户交互失败。

- enarcee

---

谢谢这个。有一段时间，我一直在想为什么按小部件（如图标）会那么困难。这证实了我的猜测。我现在已经把所有东西都切换到InkWell了。 - Lebohang Mbele

Answer 5

手势检测器

手势检测器用于检测应用程序上用户的手势。它是一个非可视化小部件。在手势检测器内，放置另一个小部件，手势检测器将捕获所有这些事件（手势）并相应地执行任务。

InkWell

InkWell是材料小部件的矩形区域，通过显示剪裁的涟漪来响应触摸事件。材料小部件负责显示触摸事件发生时显示的墨水效果。材料指的是涟漪反应被绘制的区域。

简单来说，如果您想要涟漪效果，请使用InkWell，如果需要更多控制，请使用GestureDetector

- Anand

Answer 6

对我来说，它们之间的重要区别是：InkWell必须有Material小部件作为祖先，而GestureDetector不需要Material小部件作为祖先。

- I Made Mudita

Answer 7

我使用Inkwell的最好原因是其波浪模式效果，可以让用户感受到程序的动态。但在需要更多控制的情况下，我会使用Gesture。

- mohammad mahdi heydari

---

你的回答可以通过提供更多支持性信息来改进。请[编辑]以添加进一步的细节，例如引用或文档，以便他人可以确认你的答案是正确的。您可以在帮助中心中找到有关编写良好答案的更多信息。 - Community