增加GestureDetector面积的最佳方法

问题描述 投票:0回答:1

增加GestureDetector面积的最佳方法是什么?

我想避免使用具有自定义宽度和高度的容器

我有此行的卡片:

child: Row(
    mainAxisAlignment: MainAxisAlignment.spaceBetween,
    children: <Widget>[
        new IconButton(
            icon: new Icon(
                Icons.remove,
                color: Colors.white,
                ),
            onPressed: () => { _decreaseCounter() },
            ),
        GestureDetector(
            child: Text(
               _counter.toString(),
               style: new TextStyle(
                   color: Colors.white,
                   fontSize: 18.0,
                   fontWeight: FontWeight.bold),
               ),
               onTap: () => _openDialog(),
            ),
         new IconButton(
             icon: new Icon(
                 Icons.add,
                 color: Colors.white,
                 ),
                 onPressed: () => { _increaseCounter()},
)

当我点击“文本”时,应该打开一个对话框,但是GesutreDetector区域很小,很难打开对话框。因此,我需要增加此检测范围。

flutter flutter-layout flutter-widget
1个回答
1
投票

您走了,这是您可以实施的完整的演示程序。如您所见,我们在以下示例中打印以下区域。我用GestureDetector用另一hittestbehaviour.transcluent包裹了整行。这意味着它会侦听后面的元素并仍然识别事件。这就是为什么我们也不需要文本上的GestureDetector的原因。如果单击“添加”或“删除”,则单击“作为事件进行跟踪”,如果单击该事件的下一个,旁边或行中的任何其他点,则可以对其进行操作。

import 'package:flutter/material.dart';

main() {
  runApp(MaterialApp(home: TestPage()));
}

class TestPage extends StatefulWidget {
  //static const routeName = '/';

  @override
  _TestPageState createState() => _TestPageState();
}

class _TestPageState extends State<TestPage> {

@override
  Widget build(BuildContext context) {

return Scaffold(
      appBar: AppBar(),
      body: GestureDetector(
        behavior: HitTestBehavior.translucent,
        onTap: () => print('COUNTER'),
              child: Row(
    mainAxisAlignment: MainAxisAlignment.spaceBetween,
    children: <Widget>[
          new IconButton(
              icon: new Icon(
                  Icons.remove,
                  color: Colors.white,
                  ),
              onPressed: () => print('REMOVE'),
              ),
          GestureDetector(
              child: Text(
                 'counter',
                 style: new TextStyle(
                     color: Colors.white,
                     fontSize: 18.0,
                     fontWeight: FontWeight.bold),
                 ),
                 //onTap: () => 
              ),
           new IconButton(
               icon: new Icon(
                   Icons.add,
                   color: Colors.white,
                   ),
                   onPressed: () => print('ADD'),
)]),
      ));



  }
}
© www.soinside.com 2019 - 2024. All rights reserved.