Flutter：如何在手势检测器中禁用 onTap 一段时间？答案

【问题标题】：Flutter: How to disable onTap for a while in gesture detector?Flutter：如何在手势检测器中禁用 onTap 一段时间？
【发布时间】：2019-04-06 08:56:48
【问题描述】：

我在自定义无状态视图中有一个GestureDetector。当onTap 触发时，我会显示一个显示一些信息的小吃店。当用户快速进行多次点击时，它会一直显示小吃店。

source code

GestureDetector(
  onTap: () {  
    Clipboard.setData(new ClipboardData(text: idText));
    Scaffold.of(context).showSnackBar(SnackBar
      (content: Text('ID copied')));
  },
  child: Icon(Icons.content_copy,),
}

我想禁用 onTap 几秒钟，然后才能再次单击它。

【问题讨论】：

标签： dart flutter

【解决方案1】：

创建一个bool 标志并定义一个方法：

bool _enabled = true; 

void _onTap () {
  // Disable GestureDetector's 'onTap' property.  
  setState(() => _enabled = false);
  
  // Enable it after 1s.
  Timer(Duration(seconds: 1), () => setState(() => _enabled = true));
  
  // Rest of your code...          
}

用法：

GestureDetector(
  onTap: _enabled ? _onTap: null,
  child: Icon(Icons.content_copy),
)

【讨论】：

【解决方案2】：

用AbsorbPointer包装它

var shouldAbsorb = true;

AbsorbPointer(
    absorbing: shouldAbsorb,
    child: GestureDetector(
      onTap: () {
        Navigator.of(context).pop();
      },
      child: Container(
        color: Colors.red,
      ),
    ),
  )

【讨论】：

【解决方案3】：

我个人使用GestureDetector的另外两种方法：

onTapDown: 当用户按下你的小部件时。

onTapUp: 当用户离开小部件时。

onTap: 是当点击向下和向上点击时。如果用户滑动手指太多，Flutter 可以将其视为取消点击。

onTapCancel: 当用户取消时。

bool pressing = false;

GestureDetector(
  // when user is pressing
  onTapDown: (details) {
    setState(() {
      pressing = true;
    });
  },
  // when user leaved
  onTapUp: (details) {
    setState(() {
      pressing = false;
    });
  },
  // when user leaved
  onTapCancel: () {
    setState(() {
      pressing = false;
    });
  }
  // the action to do when user tap
  onTap: () {
    // code...
  }
);

这里是文档：Flutter GestureDetector Documentation

【讨论】：

【解决方案4】：

除了 CopsOnRoad 的回答

Future 也可以这样做

setState(() => _enabled = true);
await Future.delayed(Duration(seconds: 1));
setState(() => _enabled = false);

【讨论】：