Flutter-如何放置这种布局的按钮？

Question

我想像下面的图像一样放置按钮。有人请帮我做代码。

Answer 1

有很多方法可以实现该设计。

您可以简单地使用Row，其中Column在侧面，而GridView在中间。

或

也可以将Row和3 Columns一起使用，并在中间的Column中再次插入Row。

这里是列和网格视图的示例

Row(children: [
  Column(
    children: List.generate(7, (index) => button1()),
  ),
  Expanded(
    child: GridView.builder(
        gridDelegate:
            SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 3),
        itemCount: 9,
        itemBuilder: (context, index) => button2()),
  ),
  Column(
    children: List.generate(7, (index) => button1()),
  ),
]);

这里button1和button2将是您各自的按钮。这将生成所需的布局。您可以根据需要修改代码。