Flutter 容器不响应手势答案

【问题标题】：Flutter container doesn't respond to gesturesFlutter 容器不响应手势
【发布时间】：2020-04-01 13:06:39
【问题描述】：

如果我有设置宽度/高度手势检测器的空容器不起作用，但如果我添加颜色之类的东西，它就会开始工作。

测试应用：

    import 'package:flutter/material.dart';

void main() => runApp(new MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: 'Flutter Demo',
      theme: new ThemeData(primarySwatch: Colors.blue,
      ),
      home: new MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => new _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;

  click(){
    _counter++;
    print('Clicked times: $_counter');
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text(widget.title),
      ),
      body: new Center(
        child: new GestureDetector(
          onTap: click,
          child: new Container(
            width: 50.0,
            height: 50.0,
            //color: Colors.transparent,
          ),
        ),
      )
    );
  }
}

预期的行为是手势检测器在我设置为子约束。这是所有人都可能发生的事情小部件和其他检测器。

简单的用例示例 - 我想拖动一些可以让说宽度/高度 4.0，但它太小了，所以我可以将它嵌入到较大的 emptyContainer，宽度/高度为 16.0，居中对齐并且可以拖动那个。

解决方法：添加透明色。

日志

医生总结（要查看所有详细信息，请运行 flutter doctor -v）：[✓] Flutter（Channel master，v0.4.1-pre.25，在 Mac OS X 10.13.4 17E202 上， locale en-US) [✓] Android 工具链 - 为 Android 设备开发 (Android SDK 27.0.3) [✓] iOS 工具链 - 为 iOS 设备开发 (Xcode 9.3) [✓] Android Studio (版本 3.1) [!] IntelliJ IDEA 终极版（2018.1.2版） ✗ 未安装 Flutter 插件；这增加了 Flutter 特定的功能。 ✗ Dart 插件未安装；这增加了 Dart 特定的功能。 [✓] 连接设备（2 个可用）

！医生发现了 1 个类别的问题。

【问题讨论】：

GestureDetector 有一个您可以使用的 onTap 属性。

标签： flutter flutter-layout flutter-dependencies

【解决方案1】：

没有子元素的有边界（高度和宽度）的容器只是一个占位符。因此，如果您使用GestureDetector 包装它，它将忽略点击或触摸，因为根据GestureDetector 类的官方文档By default a GestureDetector with an invisible child ignores touches;。这就是原因，容器不会响应触摸/点击。

如果您仍然希望空容器响应触摸，可以使用GestureDetector 的behavior: HitTestBehavior.opaque 属性。

希望这能回答你的问题。

【讨论】：