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

Question

I am trying to make a widget take up 1/3 the screen regardless of the phone orientation. How do I accomplish this?

Answer 1

I got what I wanted by using a Column and wrapping the contents in Flexible and changing the flex to get the child to take up 1/3 the screen:

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

Answer 2

There's a few widgets that might help: AspectRatio, Column/Expanded, and CustomSingleChildLayout in particular. It's hard to give a good answer without knowing exactly what you want to do though.

Answer 3

You should try using Expanded widgets as the children of your row, like so:

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

The Expanded widgets will each try to fill as much space of the row as possible. Since there are three of them, they will have to share the space and you'll end up with each taking up 1/3 of the row.