如何防止点击 GestureDetector 子 Flutter答案

【问题标题】：How to prevent clicking on GestureDetector child Flutter如何防止点击 GestureDetector 子 Flutter
【发布时间】：2021-10-24 23:37:58
【问题描述】：

我在GestureDetector 中有一个按钮。 GestureDetector 和IconButton 都有自己的功能。但是，我只想在点击图标时执行GestureDetector 的功能而不是```IconButton``。我知道这个问题的一些解决方案，但我仍然想知道在上面的案例中，是否有任何解决方案可以防止 Flutter 执行 IconButton 的功能？

谢谢

【问题讨论】：

您可以添加您要解决的代码 sn-p 吗？因为GestureDetector 有一个孩子IconButton，所以这里只能点击图标按钮。

标签： flutter gesturedetector iconbutton

【解决方案1】：

Solution 2: Write a separate function and pass a parameter to trigger that function based on your requirement.

关于这个。我认为他的意思是，如果用户点击图标/按钮，您现在可以调用 2 个函数：

tapIcon() {//do this and that}

tapButton() {//do this and that}

然后你创建一个第三个函数，它有一个参数，你决定应该调用哪个函数：

callFunc(bool iconTap) {
   iconTap ? tapIcon() : tapButton();
}

你在 onTap/onPressed 上使用这个：() {callFunc(true/false);}

如果您打算拥有更多功能，也可以使用枚举：

enum FunctionsEnum { BUTTON, ICON }

callFunc(FunctionsEnum functionsEnum) {
   if (functionsEnum == FunctionsEnum.BUTTON) tapButton();
   if (functionsEnum == FunctionsEnum.ICON) tapIcon();
}

然后传递一个枚举：onTap: () {callFunc(FunctionsEnum.BUTTON);}

【讨论】：

【解决方案2】：

点击优先级子> GesuterDetector。如果您在GestureDetector 上有一个IconButton 的孩子，则只有IconButton 可以工作。

假设您有一个列。

您可以根据条件在onPressed 或IconButton 上传递null。
使用AbsorbPointer 将阻止其子级的点击事件，而GestureDetector 的点击事件将在这种情况下起作用。
IgnorePointer 将完全忽略其区域内的任何点击事件。

演示小部件



class MyStatefulWidget extends StatefulWidget {
  const MyStatefulWidget();
  // final String title;

  @override
  State<MyStatefulWidget> createState() => _MyStatefulWidgetState();
}

class _MyStatefulWidgetState extends State<MyStatefulWidget> {
  bool _disableIconButton = false;

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      backgroundColor: Colors.white,
      body: Container(
        child: Column(
          children: [
            GestureDetector(
              onTap: () {
                print("GestureDetector Tapped");
              },
              child: IconButton(
                onPressed: () {
                  print(" only Icon will be working here");
                },
                icon: Icon(Icons.ac_unit),
              ),
            ),
            SizedBox(
              height: 100,
            ),
            GestureDetector(
              onTap: () {
                print("GestureDetector Tapped");
              },
              child: Column(
                children: [
                  Text("Inside Column"),
                  Switch(
                    value: _disableIconButton,
                    onChanged: (v) {
                      setState(() {
                        _disableIconButton = v;
                      });
                    },
                  ),

                  ///* Colors will faded on
                  IconButton(
                    onPressed: _disableIconButton
                        ? null
                        : () {
                            print("Icon null checker tapped");
                          },
                    icon: Icon(Icons.ac_unit),
                  ),

                  ///* Colors will faded on like disable and will work on GuesterTap
                  AbsorbPointer(
                    absorbing: _disableIconButton,
                    child: IconButton(
                      onPressed: _disableIconButton
                          ? null
                          : () {
                              print("Icon AbsorbPointer tapped");
                            },
                      icon: Icon(Icons.ac_unit),
                    ),
                  ),

                  ///* it will ignore tap event
                  IgnorePointer(
                    ignoring: _disableIconButton,
                    child: IconButton(
                      onPressed: _disableIconButton
                          ? null
                          : () {
                              print("Icon IgnorePointer tapped");
                            },
                      icon: Icon(Icons.ac_unit),
                    ),
                  ),
                ],
              ),
            )
          ],
        ),
      ),
    );
  }
}

【讨论】：

【解决方案3】：

解决方案 1：您可以只为 IconButton onPressed method 提供一个空函数。

解决方案 2：编写一个单独的函数并传递一个参数以根据您的要求触发该函数。

【讨论】：

您能详细解释一下解决方案 2 吗？