Flutter中如何阻止事件冒泡

发布于 1周前 作者 phonegap100 来自 分享

要知道Flutter中如何阻止事件冒泡首先需要知道什么是冒泡,如下图:两个区域都绑定了事件,点击里面的时候就会触发外面的事件,这个就是FLutter事件冒泡。

3692367-d03682f66ba232c4.gif

Flutter中如何阻止事件冒泡 两种解决方案:

1、通过Stack布局,解除两个widget的嵌套关系

2.通过IgnorePointer忽视事件传递

  body: Center(
    child: Stack(
      alignment: Alignment.center,
      children: [
        GestureDetector(
          onTapDown: (gesture){
            print("绿色");
          },
          child: Container(
            height: 200,
            width: 200,
            color: Colors.green,
          ),
        ),
        IgnorePointer(
          child: GestureDetector(
            onTapDown: (gesture){
              print("红色");
            },
            child: Container(
              height: 100,
              width: 100,
              color: Colors.red,
            ),
          ),
        )
      ],
    )
  ),

更多关于Flutter中如何阻止事件冒泡的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html

回到顶部
AI 助手
你好,我是IT营的 AI 助手
您可以尝试点击下方的快捷入口开启体验!