如何在屏幕底部放置一些按钮？

Question

我想在屏幕底部放置一些按钮，但不使用横条，因为我希望botton停留在另一个小部件上方，但仍留在屏幕的按钮上，即使它们下方的小部件是可滚动的

Like the four buttons here in this snapchat screenshot

Answer 1

您将需要使用带有子级小部件的Stack小部件。您将首先添加背景窗口小部件，然后使用“定位的”窗口小部件来...将所需的窗口小部件（在这种情况下，是您希望位于屏幕底部的按钮）放置在所需的前景中。

在下面查看示例代码：

class BottomButtonPosition extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Stack(
        children: <Widget>[
          ListView(children: <Widget>[
            ...List.generate(
              10,
              (index) => Container(
                    color: Colors.primaries.elementAt(index),
                    height: 100.0,
                  ),
            ),
          ]),
          Positioned(
            bottom: 0.0,
            right: 0.0,
            left: 0.0,
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceAround,
              children: <Widget>[
                IconButton(
                  icon: Icon(
                    Icons.play_arrow,
                    color: Colors.white,
                  ),
                  iconSize: 40,
                  onPressed: () {},
                ),
                IconButton(
                  icon: Icon(
                    Icons.skip_previous,
                    color: Colors.white,
                  ),
                  iconSize: 40,
                  onPressed: () {},
                )
              ],
            ),
          ),
        ],
      ),
    );
  }
}

这是结果：