如何在颤动中制作滚动视图？答案

【问题标题】：How to make scrollview in flutter?如何在颤动中制作滚动视图？
【发布时间】：2019-08-25 18:49:06
【问题描述】：

我正在制作一个颤振应用程序，我需要在其中进行图像中的设计

现在我正在做的是我将堆栈小部件作为主小部件，然后使用定位小部件将后退按钮定位。现在屏幕的剩余视图应该在滚动视图内，所以我为此使用 SingleChildScrollView 但因为那是从顶部从屏幕上，我通过将 SingleChildScrollView 放入容器中添加了上边距，但这不会使视图可滚动。我是颤振开发的新手请在代码中提供一些帮助，以使布局像图像中给出的那样

https://i.imgur.com/hL8zvXr.jpg

【问题讨论】：

标签： flutter

【解决方案1】：

对于这种菜单，您还可以在 CustomScrollView 中创建一个 silvergrid：

CustomScrollView(
    primary: false,
    slivers: <Widget>[
      SliverPadding(
        padding: const EdgeInsets.all(3.0),
        sliver: SliverGrid.count(
          mainAxisSpacing: 1, //horizontal space
          crossAxisSpacing: 1, //vertical space
          crossAxisCount: 2, //number of items a row
          children: <Widget>[
            MenuButton('dashboard', 'Manager', FontAwesomeIcons.tasks),
            MenuButton('supervisor', 'Supervisor', FontAwesomeIcons.mailchimp),
            MenuButton('ganttBoard', 'Project', FontAwesomeIcons.folder),
            MenuButton('manager', 'Calendar', FontAwesomeIcons.calendar),
            MenuButton('manager', 'BIM', FontAwesomeIcons.sign),
            MenuButton('manager', 'Notes', FontAwesomeIcons.stickyNote),
            MenuButton('manager', 'Documents', FontAwesomeIcons.dochub),
            MenuButton('manager', 'Assigments', FontAwesomeIcons.checkSquare)
          ],
        ),
      ),
    ],
  ),

您可以将列表作为子项而不是这些按钮

【讨论】：

【解决方案2】：

尝试创建一个布局，为您提供类似于此的小部件树：

Column
  Row
    CloseButton
  Text
  GridView
    Card
      Text
  Row
    Column
      Container
        Icon
      Text

请记住在行和列上设置 mainAxisAlignment 属性，以正确对齐小部件。还要查看容器上的装饰品。

此外，如果您希望背景具有渐变效果，您可以通过将整个事物包装在 Container 中并将具有渐变的 BoxDecoration 添加到 Container 的装饰属性来实现。

这只是给你的一个提示，但希望它能帮助你入门。

【讨论】：