Align

Documentation for 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

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,
          ),
        ),
      ),
    ),
  ),
)

JSON

{
  "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"
          }
        }
      }
    }
  }
}

Preview