如何将onPressed和onLongPress添加到一行内的Flutter中心控件?

a9wyjsp7  于 2022-12-19  发布在  Flutter
关注(0)|答案(4)|浏览(203)

我尝试将onLongPressonPressed沿着添加到图像按钮,但没有成功。我收到错误:未定义命名参数“onDoubleTap”。
我有多行的2个水平图像按钮使用行和扩展。除了onLongPress(或onDoubleTap)一切正常。我做错了什么,我必须重建整个代码在一个不同的格式,还是我过于复杂了?
我还尝试添加一个新的子节点(错误:已经定义)、GestureDetectorInkWell,没有成功。

body: SingleChildScrollView(
      child: Container(
        child: Column(
          children: <Widget>[
            Center(
                child: Row(
                    mainAxisAlignment: MainAxisAlignment.center,
                    crossAxisAlignment: CrossAxisAlignment.center,
                    children: <Widget>[
                  Expanded(
                      child: FlatButton(               
                          onPressed: () {
                            setState(() {
                              launchURL();
                            });
                          },  

                          //Trying to add onLongPress , error: "onLongPress not defined
                          //If I try add a new child it says child already defined

                          onLongPress: () => _showAlertMessage(context, "message"),

                          padding: EdgeInsets.all(6.0),
                          child: Image.asset(
                            'images/image1.png',
                          ))),

                  Expanded(
                      child: FlatButton(                     
                          onPressed: () {
                            setState(() {
                              launchURL();
                            });
                          },
                          padding: EdgeInsets.all(6.0),
                          child: Image.asset(
                            'images/image2.png',
                          )
                      )//flat button
                  ),//expanded
                ])), //row-center

                //Repeat above for rows of 2 more image buttons

代码运行时每个按钮都有一个onPressed,不会显示任何错误,但添加任何第二个单击事件都会显示错误。

evrscar2

evrscar21#

Flatbutton只支持onPressed回调函数,不支持onLongpressed回调函数。建议您重新考虑使用手势检测器或其他支持长按的小部件。我会尝试使用两个容器,每个容器 Package 在一个手势检测器小部件中,作为行中的子容器。每个容器都有文本和/或图像内容。然后您可以选择onTap、双击、长按、等对每个容器。没有测试这一点,因为我在我的手机上,但应该工作。他们可能是更优雅的小部件使用比容器。

x6h2sr28

x6h2sr282#

感谢您的反馈,真的很感激。我取代了flatButton与手势检测器内的列,使用onTap而不是onPressed,把图像在新的列,添加onLongPress。代码运行。当我添加第二扩展我得到这个错误:

E/InputMethodManager( 7133): prepareNavigationBarInfo() rootView is null

我在这里读到“RootView是放置所有其他视图的视图。它就像树结构中的根节点,是所有子视图的父视图。",但我看不到我的错误。我做了一个完全重启,错误消失了。

Container(
            child: Row(
                mainAxisAlignment: MainAxisAlignment.center,
                crossAxisAlignment: CrossAxisAlignment.center,
                children: <Widget>[
              Expanded(
                child: GestureDetector(
                    onLongPress: () {
                      setState(() {
                        _showAlertMessage(context, "message");
                      });
                    },
                    onTap: () {
                      setState(() {
                        _launchUrl;
                      });
                    },
                    child: Container(
                        padding: EdgeInsets.all(6.0),
                        child: Image.asset(
                          'images/image1.png',
                        ) 
                        )),
              ), //Expanded

              Expanded(
                child: GestureDetector(
                    on: () {
                      setState(() {
                        _showAlertMessage(context, "message");
                      });
                    },
                    onTap: () {
                      setState(() {
                        _launchUrl;
                      });
                    },
                    child: Container(
                        padding: EdgeInsets.all(6.0),
                        child: Image.asset(
                          'images/image2.png',
                        ) 
                        )),
              ), 

            ])),
flvlnr44

flvlnr443#

**注意:**flutter FlatButton的第2版已经过时。您应该使用TextButton

我不知道你是如何使用GestureDetector的,但它是最适合你的问题的解决方案,并支持用户按下手势的不同方面,所以我准备了下面的示例代码来看看它是如何工作的。

body: SingleChildScrollView(
        child: Container(
            child: Column(children: <Widget>[
  Center(
      child: Row(
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: <Widget>[
        Expanded(
            child: GestureDetector(
              onTap: () => print('onTap'), 
              onLongPress: () => print('onLongPress'), 
              onDoubleTap: () => print('onDoubleTap'), 
              child: Image.network(
              'https://lp-cms-production.imgix.net/image_browser/social-beast-GettyRF_136327669.jpg?auto=format&fit=crop&sharp=10&vib=20&ixlib=react-8.6.4&w=850&q=50&dpr=2'),
            ) //flat button
        ),

        Expanded(
            child: GestureDetector(
              onTap: () => print('onTap'), 
              onLongPress: () => print('onLongPress'), 
              onDoubleTap: () => print('onDoubleTap'), 
              child: Image.network(
              'https://lp-cms-production.imgix.net/image_browser/lions-hunting-500pxRF_7416880.jpg?auto=format&fit=crop&sharp=10&vib=20&ixlib=react-8.6.4&w=850&q=50&dpr=2'),
            )
        ), //expanded
      ])
  ), //row-center
]
            )
        )
    )

GestureDetector还有很多其他的手势可以在here中找到。

oalqel3c

oalqel3c4#

您可以使用InkWell微件

child: InkWell(
                                onLongPress: () {
                                  setState(() {
                                    tip++;
                                  });
                                },
                                child: FloatingActionButton(
                                  heroTag: "btn+",
                                  onPressed: () {
                                    setState(() {
                                      tip++;
                                    });
                                  },
                                  backgroundColor: Colors.grey.shade400,
                                  child: Icon(
                                    Icons.add,
                                    color: Colors.black,
                                  ),
                                ),
                              ),

相关问题