Reputation: 2881
In flutter, Is there any difference between these layouts? -
Concept - 1:
Center layout
Align( alignment: Alignment.center, child: ...)
Container( alignment: Alignment.center, child: ...)
Concept - 2:
Align( alignment: Any Alignment, child: ...)
Container( alignment: Any Alignment, child: ...)
Upvotes: 1
Views: 615
Reputation: 36373
Internally, they are all using Align
.
Align:
Align
widget allows you to control the alignment, but if you don't pass in anything to the alignment
parameter, it defaults to being centered anyway.
Center:
Center
widget is inherited from the Align
widget, not allowing you to set the alignment
property, so it defaults to being centered. The main purpose of this widget is to make your code shorter and more readable.
This is the entire source code of Center
widget:
class Center extends Align {
/// Creates a widget that centers its child.
const Center({ Key? key, double? widthFactor, double? heightFactor, Widget? child })
: super(key: key, widthFactor: widthFactor, heightFactor: heightFactor, child: child);
}
Container:
Container
widget wraps the child
with an Align
widget when you set an alignment
property. It also supports other things, for example, if you set a width
or height
, it wraps the child
with a SizedBox
; if you set a color
, it wraps the child
with a ColoredBox
; if you set a padding
property, it wraps the child
with a Padding
widget.
Upvotes: 2