Flutter - onPressed function

Question

我需要在下面的图标上插入onpressed()函数（导航器跳转到其他页面）：

Column buildButtonColumn(IconData icon, String label) {
    Color color = Theme.of(context).primaryColor;
      return Column(
      mainAxisSize: MainAxisSize.min,
       mainAxisAlignment: MainAxisAlignment.center,
       children: [
      Icon(icon, color: color),
      Container(
        margin: const EdgeInsets.only(top: 8.0),
        child: Text(
          label,
          style: TextStyle(
            fontSize: 12.0,
            fontWeight: FontWeight.w400,
            color: color,
             ),
           ),
         ),
       ],
     );
   }

   Widget buttonSection = Container(
    child: Row(
      mainAxisAlignment: MainAxisAlignment.spaceEvenly,
      children: [
        buildButtonColumn(Icons.call, 'CALL'),
        buildButtonColumn(Icons.near_me, 'ROUTE'),
        buildButtonColumn(Icons.share, 'SHARE'),
      ],
    ),
  );

- Sergio Guerjik

---

很抱歉，由于格式错误，请提供正确的文本以供翻译。 - Sergio Guerjik

https://dev59.com/96Lia4cB1Zd3GeqPkILg - Blasanka

Answer 1

您可以使用 IconButton 小部件来实现此功能。

IconButton(
     icon:  Icon(Icons.info),
     onPressed: (){
           // Do something               
     },
 )

如果你想利用 GestureDetector

GestureDetector(
  onTap: () {
    //Do something
  },
  child: icon: Icon(Icons.info),
)

编辑:

通过对下面的代码进行一些修改，将buildButtonColumn更改为以下内容：

buildButtonColumn(icon, label, onTap) {
      Color color = Theme.of(context).primaryColor;
      return GestureDetector(
        onTap: onTap,
        child: Column(
          mainAxisSize: MainAxisSize.min,
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Icon(icon, color: color),
            Container(
              margin: const EdgeInsets.only(top: 8.0),
              child: Text(
                label,
                style: TextStyle(
                  fontSize: 12.0,
                  fontWeight: FontWeight.w400,
                  color: color,
                ),
              ),
            ),
          ],
        ),
      );
    }

对于按钮部分，请使用以下内容。

Widget buttonSection = Container(
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
        children: [
          buildButtonColumn(Icons.call, 'CALL', (){
                print('call');
          }),
          buildButtonColumn(Icons.near_me, 'ROUTE', (){
            print('route');
          }),
          buildButtonColumn(Icons.share, 'SHARE', (){
            print('share');
          }),
        ],
      ),
    );

- nonybrighto

---

nonybrighto，谢谢您的回复，但它在我的代码上不起作用。我需要使用Widget buttonSection与容器，另一方面，我需要将函数插入到代码中。这可能吗？ - Sergio Guerjik

你是如何实现它的？展示一下构建按钮列的代码。 - nonybrighto

nonybrighto 再次感谢，查看上面的整个按钮代码。 - Sergio Guerjik

空的()有什么作用？我正在阅读一本Flutter书籍，它介绍了Dart，但是不理解例如onPressed: () {},。 - mLstudent33

@mLstudent33 如果onPressed为空，则按钮处于活动/启用状态，因此即使按钮没有任何操作，您仍然可以获得溅泼效果和所有其他效果。 - nonybrighto

Answer 2

使用GestureDetector包装您的Column：

要前往其他页面，您可以使用Navigator.pushNamed或Navigator.push，例如使用PushNamed在代码中

Widget buildButtonColumn(IconData icon, String label) {
    Color color = Theme.of(context).primaryColor;
    return GestureDetector(
      onTap: (){
        Navigator.pushNamed(context, label);
      },
      child: Column(
        mainAxisSize: MainAxisSize.min,
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Icon(icon, color: color),
          Container(
            margin: const EdgeInsets.only(top: 8.0),
            child: Text(
              label,
              style: TextStyle(
                fontSize: 12.0,
                fontWeight: FontWeight.w400,
                color: color,
              ),
            ),
          ),
        ],
      ),
    );
  }

- anmol.majhail

Answer 3

你可以使用这个：

GestureDetector buildButtonColumn(IconData icon, String label){
    onTap(){
      print("Pressed");
    }
    Color color = Theme.of(context).primaryColor;
    return GestureDetector(
      onTap: onTap,
      child: Column(
        mainAxisSize: MainAxisSize.min,
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Icon(icon, color: color),
          Container(
            margin: const EdgeInsets.only(top: 8.0),
            child: Text(
              label,
              style: TextStyle(
                fontSize: 12.0,
                fontWeight: FontWeight.w400,
                color: color,
              ),
            ),
          ),
        ],
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
    home: Scaffold(
      body: Center(
        child:Row(
          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
          children: [
            buildButtonColumn(Icons.call, 'CALL'),
            buildButtonColumn(Icons.near_me, 'ROUTE'),
            buildButtonColumn(Icons.share, 'SHARE'),
          ],
        ),
      ),
    ),
  );
}

- User