首页 > 解决方案 > 如何在正文后添加多行或多列

问题描述

我仍在尝试了解如何构建小部件。我已经在正文中放置了一个容器,所以我现在如何添加另一行。我删除了一些代码来简化我的情况,但希望这能让我了解我的项目目前的结构。

class AddButton extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        alignment: Alignment.bottomCenter, 
        //Stats Button
        child: Row(
      ), //container 

      //How can I enter a new row here    <------- WHERE I WANT TO ENTER A ROW 

    );
  }
}

标签: flutter

解决方案


简短的回答是,你不能。您可以利用childrenColumn 的属性,这是 Flutter 中最常见的布局小部件。Flutter 在嵌套的小部件系统上工作,你不能有很多父母,因为它都从一个小部件开始。

class AddButton extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        alignment: Alignment.bottomCenter, 
        //Stats Button
        child: Column(
          children: <Widget>[
            Row(
              children: <Widget>[
                // nested widgets
              ],
            ),
          ],
        ),
      ),
    );
  }
}

从您的班级名称来看,您只需要一个按钮。并非每个小部件都以 Scaffold 开头,只有当您想要一个带有应用栏或底部导航栏的整个布局时才会这样做。对于像按钮这样的简单小部件,您可以完全摆脱 Scaffold 并像这样使用 MaterialButton。

class AddButton extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialButton(
      onPressed: () {}, //empty function
    );
  }
}

更多阅读:

https://flutter.dev/docs/development/ui/layout

https://pusher.com/tutorials/flutter-building-layouts

https://medium.com/flutter-community/flutter-layout-cheat-sheet-5363348d037e


推荐阅读