Flutter notes

flutter.md

Sizing Widgets:

• Expanded
• Flexible
• LimitedBox <-> ConstrainedBox
• FittedBox
• SizedBox

Note: When creating widgets in column / row, if the size is too big (like when presenting in a modal screen) use the attribute: mainAxisSize.min to contain the widget

Use Spacer when you want to create space using a flex property. Use SizedBox when you want to create space using a specific number of logical pixels.

Positioning Widgets

• Align: Uses different Alignment values like bottomRight etc but also Alignment(0.2, 0.6) which offsets based on the numerical values or FractionalOffset to offset from topLeft
• Center: A specific implementation of the Align widget

Animations

• AnimatedContainer
• Hero
• AnimatedCrossFade
• AnimatedOpacity

Tip

• Expand column children to max width: set crossAxisAlignment to stretch (might need to wrap the column in a IntrinsicWidth widget). Like for row:

new IntrinsicHeight(
  child: new Row(
    crossAxisAlignment: CrossAxisAlignment.stretch,
    children: [
      new Child1(),
      new Child2(),
      ....
    ],
  ),
);

• Want to set min-height? Use costrainedbox with minheight to stretch its child. Note: may not work with Row and Columns. May need a Container
• Use addPostFrameCallback to call code after the build has executed