通常会遇到这样的设计 , 在一个可点击的条目中有个 CheckBox , 只有当点击条目的时候才会更改 CheckBox 的状态 , 单独点击 CheckBox 只会触发条目的点击事件 , 而不会触发自身的事件. 通常直接把控件丢进去 , 是无法达到效果 , 因此需要做一层包装

  • AbsorbPointer 开启 absorbing:本身可以接收点击事件,但不会把事件传递给子组件。
  • IgnorePointer 开启 ignoring:本身和子组件都不能接收点击事件。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart';


void main() => runApp(MaterialApp(
title: '啦啦啦啦',
theme: ThemeData(primarySwatch: Colors.red, primaryColor: Colors.green),
home: PointerIgnorePage(),)
);

class PointerIgnorePage extends StatefulWidget {


@override
State<StatefulWidget> createState() => PointerIgnorePageState();
}

class PointerIgnorePageState extends State<PointerIgnorePage> {

bool _ifIgnore = false;

@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text('测试忽略点击事件'),),
body:
Container(
alignment: Alignment.center,
child:
Column(
children: <Widget>[
Switch(
value: _ifIgnore,
onChanged: (value) => setState((){_ifIgnore = value;}),
),
GestureDetector(
onTap: () => print('外层tap1'),
child: IgnorePointer(
ignoring: _ifIgnore,
child: FlatButton(child: Text('点我'), onPressed: () => print('点击了button1'),),
),
),
GestureDetector(
onTap: () => print('外层tap2'),
child: AbsorbPointer(
absorbing: _ifIgnore,
child: FlatButton(child: Text('点我'), onPressed: () => print('点击了button2'),),
),
),
],
),
),
);
}
}

参考资料

参考链接