SamSol
SamSol

Reputation: 2881

Flutter: Are there any difference between these different layouts: Align, Center, Container?

In flutter, Is there any difference between these layouts? -

Concept - 1:


Concept - 2:

Upvotes: 1

Views: 615

Answers (1)

WSBT
WSBT

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

Related Questions