我想用一个MaterialButton来检测OntapDown、OntapUp和OntapCancel。
不幸的是,MaterialButton只检测到按下。所以我用一个手势检测仪把它包起来,但是对于材料标签来说,按一下是必需的,所以我把它设置为()。
问题是,即使我将GestureDetector的行为设置为半透明,如果我点击按钮,只会触发按钮的已按下回调,并松开GestureDetector的OntapDown和OntapUp回调。我只有长时间按下按钮才能触发OntapDown,当我释放它时,OntapCancel会被触发。我永远不能让小袋鼠这样被触发。
我仍然希望材料蛋白顿的触觉/声音/视觉反馈能力。
我试着根本不把按下的按钮设置在MaterialButton上,(奇怪的是)它仍然工作,但是按钮被禁用了,根本没有给出任何反馈。
GestureDetector(
behavior: HitTestBehavior.translucent,
onTapDown: (_) {
th.handleTap(i, 0);
},
onTapUp: (_) {
th.handleTap(i, 1);
},
onTapCancel: () {
th.handleTap(i, 2);
},
child: MaterialButton(
onPressed: () {},
child: Container(
margin: EdgeInsets.all(5),
child: Icon(icon),
),
)
)
编辑:
谢谢你雨果·帕索斯,出于某种原因,我认为“材料”乐队永远不会给他们的孩子做手势。我正在靠近,但我仍然不在那里:
我找到的唯一匹配手势大小的方法是把它夹在两个容器之间,这看起来不像是一个非常优雅的解决方案。顺便说一下,即使在这种情况下,我也遇到了两个问题:
1:如果我(很容易)点击按钮的边界,我仍然会触发MaterialButton,而不是GestureDetector的回调。我以为它是零尺寸的,所以它永远不会被敲击。这个问题不显示我是否将手势检测器行为设置为不透明(对我来说仍然很奇怪)。
2:最重要的是:我仍然无法获得本地材料的反馈能力,除非我意外触发了它的按下。
Container(
margin: EdgeInsets.all(2),
width: buttonSize,
height: buttonSize,
child: RaisedButton(
padding: EdgeInsets.zero,
onPressed: () {print("onTap");},
child: Container(
margin: EdgeInsets.zero,
width: buttonSize,
height: buttonSize,
child: GestureDetector(
onTapDown: (_) {
th.handleTap(i, 0);
},
onTapUp: (_) {
th.handleTap(i, 1);
},
onTapCancel: () {
th.handleTap(i, 2);
},
child: Icon(icon)
),
),
),
);
最佳答案
你必须做相反的事。不要将RaisedButton
包裹在GestureDetector
中,而是将aGestureDetector
包裹在aRaisedButton
中。您还必须删除RaisedButton
填充,以便扩展GestureDetector
作用区域。
RaisedButton(
padding: EdgeInsets.zero,
onPressed: () {},
child: Container(
height: 40,
width: 80,
child: GestureDetector(
onTapDown: (_) => print('onTapDown'),
onTapUp: (_) => print('onTapUp'),
onTapCancel: () => print('onTapCancel'),
child: Icon(icon),
),
),
),
编辑
Center(
child: RaisedButton(
padding: EdgeInsets.zero,
onPressed: () => print('onPressed'),
child: GestureDetector(
onTapDown: (_) => print('onTapDown'),
onTapUp: (_) => print('onTapUp'),
onTapCancel: () => print('onTapCancel'),
child: Container(
color: Colors.blue,
height: 40,
width: 80,
child: Icon(icon),
),
),
),
);
不过,您将得到一个称为
onPressed
的小边界。如果这让您感到困扰,请将此代码包装在另一个Container
中,就像您在代码中所做的那样。通过在
RaisedButton
调用onPressButton
方法,您可以很容易地获得本机的onTapUp
反馈功能。它也会有同样的行为。RaisedButton(
...
onPressed: onPressButton,
child: GestureDetector(
...
onTapUp: (_) {
onPressButton();
print('onTapUp')
},
...
),
),