Le Tutoriel de Flutter Positioned

Positioned
Positioned.directional constructor
Positioned.fill constructor
Positioned.fromRect constructor
Positioned.fromRelativeRect constructor

1. Positioned

Le widget Positioned est utilisé pour positionner un widget enfant d'une Stack.

Le Tutoriel de Flutter Stack

Positioned est uniquement utilisé comme widget enfant direct (ou descendant) de Stack. Sur le chemin de Positioned à Stack, il ne comprend que les widgets StatelessWidget ou StatefulWidget, les autres widgets ne sont pas autorisés (par exemple RenderObjectWidget).

Positioned constructor

const Positioned(
    {Key key,
    double left,
    double top,
    double right,
    double bottom,
    double width,
    double height,
    @required Widget child}
)

Par exemple:

(ex1)

SizedBox (
    width: double.infinity,
    height: double.infinity,
    child: Stack(
      alignment: Alignment.centerLeft,
      children: <Widget>[
        Positioned (
           left: 100,
          top: 70,
          child: Container(
            width: 200,
            height: 100,
            color: Colors.green,
          ),
        )
      ],
    )
)

La taille de Positioned et de son enfant est toujours la même.

Observer cet exemple: Un Positioned avec un top et un bottom non null force la hauteur du widget enfant à changer pour s'adapter à cette contrainte.

(ex2)

SizedBox (
    width: double.infinity,
    height: double.infinity,
    child: Stack(
      alignment: Alignment.centerLeft,
      children: <Widget>[
        Positioned (
          top: 100,
          bottom: 70,
          child: Container (
            width: 200,
            height: 30, // !!
            color: Colors.green,
          ),
        )
      ],
    )
)

Si les trois paramètres left, right et width sont null, la propriété Stack.alignment sera utilisée pour positionner le widget enfant horizontalement. De même, si les trois paramètres top, bottom et height sont null, la propriété Stack.alignment sera utilisée pour positionner le widget enfant verticalement.

2. Positioned.directional constructor

Positioned.directional est utilisé pour créer un Positioned basé sur la direction du texte.

Positioned.directional constructor

Positioned.directional(
  {Key key,
  @required TextDirection textDirection,
  double start,
  double top,
  double end,
  double bottom,
  double width,
  double height,
  @required Widget child}
)

Le paramètre textDirection est obligatoire et non null. Il accepte la valeur TextDirection.ltr (Left to Right) (de gauche à droite) ou TextDirection.rtl (Right to Left) (de droite à gauche).

Si textDirection vaut TextDirection.ltr, les paramètres (start, end) correspondront à (left, right). Sinon (start, end) correspondra à (right, left).

3. Positioned.fill constructor

Positioned.fill est un constructeur avec des paramètres left, right, top et bottom ayant les valeurs par défaut de 0.

Positioned.fill constructor

const Positioned.fill(
  {Key key,
  double left: 0.0,
  double top: 0.0,
  double right: 0.0,
  double bottom: 0.0,
  @required Widget child}
)

4. Positioned.fromRect constructor

Positioned.fromRect crée un objet Positioned avec les valeurs affectées par l'objet Rect.

Positioned.fromRect constructor

Positioned.fromRect(
  {Key key,
  Rect rect,
  @required Widget child}
)

Le Tutoriel de Flutter Rect

5. Positioned.fromRelativeRect constructor

Positioned.fromRelativeRect crée un objet Positioned avec les valeurs affectées par l'objet object RelativeRect.

Positioned.fromRelativeRect constructor

Positioned.fromRelativeRect(
  {Key key,
  RelativeRect rect,
  @required Widget child}
)

Flutter RelativeRect