Flutter AbsorbPointer 与 IgnorePointer的区别,
Flutter AbsorbPointer 与 IgnorePointer的区别,
AbsorbPointer
AbsorbPointer是一种禁止用户输入的控件,比如按钮的点击、输入框的输入、ListView的滚动等,你可能说将按钮的onPressed
设置为null,一样也可以实现,是的,但AbsorbPointer可以提供多组件的统一控制,而不需要你单独为每一个组件设置。
用法如下:
AbsorbPointer(
child: Row(
children: <Widget>[
RaisedButton(onPressed: (){},),
RaisedButton(onPressed: (){},),
RaisedButton(onPressed: (){},),
RaisedButton(onPressed: (){},),
],
),
)
默认情况下,这些按钮是否响应点击事件的,如果想要响应点击事件只需设置absorbing
为false即可:
AbsorbPointer(
absorbing: false,
...
)
IgnorePointer
IgnorePointer的用法和AbsorbPointer一样,而且达到的效果一样,用法如下:
IgnorePointer(
child: Row(
children: <Widget>[
RaisedButton(onPressed: (){},),
RaisedButton(onPressed: (){},),
RaisedButton(onPressed: (){},),
RaisedButton(onPressed: (){},),
],
),
)
区别
AbsorbPointer
本身可以接收点击事件,消耗掉事件,而IgnorePointer
无法接收点击事件,其下的控件可以接收到点击事件(不是子控件)。
如果有2个盒子,一个200x200的红色盒子,一个100x100的蓝色盒子,蓝色盒子位于红色盒子之上居中显示,给2个盒子添加点击事件,如下:
return Container(
height: 200,
width: 200,
child: Stack(
alignment: Alignment.center,
children: <Widget>[
Listener(
onPointerDown: (v) {
print('click red');
},
child: Container(
color: Colors.red,
),
),
Listener(
onPointerDown: (v) {
print('click red');
},
child: Container(
color: Colors.blue,
width: 100,
height: 100,
),
),
],
),
);
点击蓝色盒子时,打印结果:
flutter: click blue
点击蓝色盒子区域以外的红色盒子,打印结果:
flutter: click red
此时用AbsorbPointer
包裹蓝色盒子:
return Container(
height: 200,
width: 200,
child: Stack(
alignment: Alignment.center,
children: <Widget>[
Listener(
onPointerDown: (v) {
print('click red');
},
child: Container(
color: Colors.red,
),
),
Listener(
onPointerDown: (v) {
print('click blue self');
},
child: AbsorbPointer(
child: Listener(
onPointerDown: (v) {
print('click blue child');
},
child: Container(
color: Colors.blue,
width: 100,
height: 100,
),
),
),
),
],
),
);
点击蓝色盒子,打印如下:
flutter: click blue self
说明AbsorbPointer
本身接收到了点击事件,将AbsorbPointer
改为IgnorePointer
,打印如下:
flutter: click red
点击事件穿透蓝色盒子到红色盒子,红色盒子接收到了点击事件。
使用场景
1、根据业务需求禁用/启用多个组件。
2、根据业务需求禁用/启用整个App。
交流
Github地址:https://github.com/781238222/flutter-do
170+组件详细用法:http://laomengit.com
如果你对Flutter还有疑问或者技术方面的疑惑,欢迎加入Flutter交流群(微信:laomengit)。
同时也欢迎关注我的Flutter公众号【老孟程序员】,公众号首发Flutter的相关内容。
Flutter生态建设离不开你我他,需要大家共同的努力,点赞也是其中的一种,如果文章帮助到了你,希望点个赞。
相关文章
- 暂无相关文章
用户评论