如何向 TextSpan 添加多个手势识别器？答案

【问题标题】：How to add multiple gesture recognizers to TextSpan?如何向 TextSpan 添加多个手势识别器？
【发布时间】：2020-02-09 02:00:16
【问题描述】：

我想将 TapGestureRecognizer 和 LongPressGestureRecognizer 添加到 TextSpan。现在我可以添加任何一个，但不能同时添加。

我查看了 GestureDetector 类并想用它包装 TextSpan，但 RichText 元素只接受 TextSpan 而不是小部件。

这就是我现在拥有的：

TextSpan(
    text: "some text",
    recognizer: TapGestureRecognizer()
    ..onTap = () { print('tapped'); }
)

我想在该代码的某处添加..onLongPress。

最后，两个手势都应该在单个文本跨度上工作。

【问题讨论】：

标签： flutter

【解决方案1】：

您可以使用 WidgetSpan 设置您的跨度并通过 GestureDetector 检测 TapGestureRecognizer 和 LongPressGestureRecognizer

 TextSpan(
          children: <InlineSpan>[
            TextSpan(text: 'Flutter is'),
            WidgetSpan(
                child: GestureDetector(
                  onTap: () {
                    
                  },
                  onLongPress: () {
                    
                  },
                  child: Text(' Hello World! '),
                )
            ),
            TextSpan(text: 'the best!'),
          ],
        )

【讨论】：

【解决方案2】：

似乎不可能将多个 GestureRecognizer 添加到 TextSpan，但对于您的情况，这是一种解决方法，仅使用 TapGestureRecognizer 并使用 onTapUp 和 onTapDown 来检测点击并模拟长点击，使用定时器：

TapGestureRecognizer _tapGestureRecognizer;
Timer _timer;

@override
void initState() {
  super.initState();
  _initRecognizer();
}

_initRecognizer() {
  _tapGestureRecognizer = TapGestureRecognizer();
  _tapGestureRecognizer.onTapUp = (_) {
    if (_timer != null && _timer.isActive) {
      print('Tap');
      _timer.cancel();
    }
  };
  _tapGestureRecognizer.onTapDown = (_) {
    _timer = Timer(Duration(seconds: 1), () {
      print('Long Tap');
    });
  };
}

@override
void dispose() {
  if (_timer != null) {
    _timer.cancel();
    _timer = null;
  }
  super.dispose();
}

@override
Widget build(BuildContext context) {
  return Scaffold(
    backgroundColor: Colors.grey,
    appBar: AppBar(),
    body: Padding(
      padding: EdgeInsets.all(16.0),
      child: RichText(
        text: TextSpan(
          children: [
            TextSpan(
              text: "This is some text.",
              recognizer: _tapGestureRecognizer,
              style: Theme.of(context).textTheme.title,
            ),
            TextSpan(
              text:
              "Another piece of text. Another piece of text. Another piece of text. Another piece of text.",
              style: Theme.of(context).textTheme.title,
            ),
          ],
        ),
      ),
    ),
  );
}

【讨论】：