Align

The Stac Align allows you to build a Flutter Align widget using JSON. To know more about the align widget in Flutter, refer to the official documentation. The playground centers the root widget; this example wraps Align in a Scaffold body so it gets full-screen constraints.

Properties

Property	Type	Description
alignment	`StacAlignmentDirectional`	How to align the child.
widthFactor	`double`	If non-null, sets its width to the child’s width multiplied by this factor.
heightFactor	`double`	If non-null, sets its height to the child’s height multiplied by this factor.
child	`StacWidget`	The widget below this widget in the tree.

Example

Dart
JSON
Preview

StacScaffold(
  body: StacAlign(
    child: StacContainer(
      color: '#FC5632',
      height: 250,
      width: 200,
      child: StacAlign(
        alignment: StacAlignmentDirectional.bottomCenter,
        child: StacText(
          data: 'Flutter',
          style: StacTextStyle(
            fontSize: 23,
            fontWeight: StacFontWeight.w600,
          ),
        ),
      ),
    ),
  ),
)

{
  "type": "scaffold",
  "body": {
    "type": "align",
    "child": {
      "type": "container",
      "color": "#FC5632",
      "height": 250,
      "width": 200,
      "child": {
        "type": "align",
        "alignment": "bottomCenter",
        "child": {
          "type": "text",
          "data": "Flutter",
          "style": {
            "fontSize": 23,
            "fontWeight": "w600"
          }
        }
      }
    }
  }
}

AspectRatio

Layout Widgets

Display Widgets

Interactive Widgets

Data Widgets

Properties

Example

​Properties

​Example

Properties

Example