Properties
| Property | Type | Description |
|---|---|---|
| alignment | StacAlignment | The alignment of the child within the container. |
| padding | StacEdgeInsets | The padding to apply around the child. |
| decoration | StacBoxDecoration | The decoration to paint behind the child. |
| foregroundDecoration | StacBoxDecoration | The decoration to paint in front of the child. |
| color | StacColor | The color to paint behind the child. |
| width | double | The width of the container. |
| height | double | The height of the container. |
| constraints | StacBoxConstraints | Additional constraints to apply to the container. |
| margin | StacEdgeInsets | The margin to apply around the container. |
| transformAlignment | StacAlignment | The alignment of the transform origin. |
| child | StacWidget | The child widget of the container. |
| clipBehavior | StacClip | The clip behavior of the container. |
Example
- Dart
- JSON
- Preview
StacContainer(
alignment: StacAlignment.center,
padding: StacEdgeInsets(
top: 16.0,
bottom: 16.0,
left: 16.0,
right: 16.0,
),
decoration: StacBoxDecoration(
color: '#FF5733',
borderRadius: StacBorderRadius(
topLeft: 16.0,
topRight: 16.0,
bottomLeft: 16.0,
bottomRight: 16.0,
),
),
width: 200.0,
height: 200.0,
child: StacText(
data: 'Hello, World!',
style: StacTextStyle(
color: StacColors.white,
fontSize: 24.0,
),
),
)
{
"type": "container",
"alignment": "center",
"padding": {
"top": 16,
"bottom": 16,
"left": 16,
"right": 16
},
"decoration": {
"color": "#FF5733",
"borderRadius": {
"topLeft": 16,
"topRight": 16,
"bottomLeft": 16,
"bottomRight": 16
}
},
"width": 200,
"height": 200,
"child": {
"type": "text",
"data": "Hello, World!",
"style": {
"color": "#FFFFFF",
"fontSize": 24
}
}
}