-
Notifications
You must be signed in to change notification settings - Fork 2
Widgets in Flutter 2
Widgets in Flutter 1 - https://github.com/skully-coder/IECSE-App-Winter-Project-20/wiki/Widgets-in-Flutter-1
This wiki page contains a list of commonly used widgets that you should know about.
For documentation click here.
A convenience widget that combines common positioning,containing and sizing widgets.
A container first surrounds the child with padding (inflated by any borders present in the decoration) and then applies additional constraints to the padded extent (incorporating the width and height as constraints, if either is non-null). The container is then surrounded by additional empty space described from the margin.
Containers with no children try to be as big as possible unless the incoming constraints are unbounded, in which case they try to be as small as possible. Containers with children size themselves to their children. The width, height, and constraints arguments to the constructor override this.
Widget tile() {
...
return Container(
height: ...
margin: ...
decoration: BoxDecoration(
shape: ...
color: ...
borderRadius: ...
),
child: ...
);
}For documentation click here.
Column Widget allows a user to arrange its contents vertically.
To cause a child to expand to fill the available vertical space, wrap the child in an Expanded widget.
Widget tile(...) {
...
return Column(
mainAxisAlignment: ...
mainAxisSize: ...
crossAxisAlignment: ...
children: [
...
],
);
}For documentation click here.
As we see Column distributes content vertically, Row is used for horizontal distribution of contents. Row widget displays its children in a horizontal array.
To cause a child to expand to fill the available horizontal space, wrap the child in an Expanded widget.
Widget tile(...) {
...
return Row(
mainAxisAlignment: ...
mainAxisSize: ...
crossAxisAlignment: ...
children: [
...
],
);
}As you know some of the widgets by now, try to explore more widgets from Flutter documentation:
- AppBar
- Drawer
- Scaffold
- ListTile
- Card
- Flat Button / Raised Button / Icon Button