小部件占据屏幕 1/3 的好方法是什么？

Question

无论 phone 方向如何，我都试图让小部件占据屏幕的 1/3。我该如何实现？

Answer 1

有一些小部件可能会有所帮助：AspectRatio、Column/Expanded，尤其是 CustomSingleChildLayout。虽然不知道你想做什么，但很难给出一个好的答案。

Answer 2

您应该尝试使用 Expanded 小部件作为行的子级，如下所示：

new Row(
  mainAxisAlignment: MainAxisAlignment.spaceBetween,
  children: [
    new Expanded(
      child: yourFirstContentWidget,
               ),
    new Expanded(
      child: yourNextContentWidget,
               ),
    new Expanded(
      child: yourLastContentWidget,
               )
            ]
        )

每个展开的小部件都会尝试尽可能多地填充行中的 space。由于它们是三个，因此它们将不得不共享 space，而您最终将每个都占据该行的 1/3。

Answer 3

通过使用 Column 并将内容包装在 Flexible 中并更改 flex 以使子项占据屏幕的 1/3，我得到了我想要的东西：

new Column(
  mainAxisAlignment: MainAxisAlignment.spaceBetween,
  children: <Widget>[
    new Flexible(flex: 2, child: new SizedBox()),
    new Flexible(flex: 1, child: createTextBox())
  ]
);

小部件占据屏幕 1/3 的好方法是什么？

What would be a good way for a widget to take 1/3 of the screen?

flutter