Flex

Mise en page

Flex est l'algorithme Flex de Flutter porté tel quel dans Engine\Native\Flex : Row et Column ne sont rien d'autre que ce nœud avec un Axis fixé. Le layout se fait en deux passes sur l'axe principal : les enfants ordinaires sont mesurés d'abord et gardent leur taille intrinsèque, puis l'espace restant est réparti entre les enfants Flexible au prorata de leur facteur. Sur l'axe transversal, CrossAxisAlignment::STRETCH impose une contrainte stricte à la taille du conteneur ; les autres alignements laissent chaque enfant libre puis le repositionnent après coup.

Exemple

<?php

use Engine\Native\Flex;
use Engine\Native\Container;
use Engine\Native\Flexible;
use Engine\Native\Axis;
use Engine\Native\MainAxisAlignment;
use Engine\Native\CrossAxisAlignment;
use Engine\Color;

$row = new Flex(
    Axis::HORIZONTAL,
    [
        new Container(width: 40.0, height: 40.0, background: Color::indigo(600)),
        new Flexible(new Container(background: Color::green(500)), flex: 1),
    ],
    MainAxisAlignment::SPACE_BETWEEN,
    CrossAxisAlignment::CENTER,
);

Une ligne horizontale place un carré de taille fixe puis laisse un second bloc coloré grandir dans l'espace restant, les deux enfants étant centrés sur l'axe transversal.

Constructeur

Paramètre	Type	Défaut	Description
direction	Axis	—	Axe principal : Axis::HORIZONTAL (Row) ou Axis::VERTICAL (Column).
children	array<int, Widget>	—	Enfants ; entourer un enfant de Flexible pour qu'il grandisse dans l'espace restant.
mainAxisAlignment	MainAxisAlignment	START	Répartition sur l'axe principal (START, CENTER, END, SPACE_BETWEEN, SPACE_AROUND, SPACE_EVENLY).
crossAxisAlignment	CrossAxisAlignment	START	Alignement sur l'axe transversal, y compris STRETCH.

Méthodes

Méthode	Description
static row(children, mainAxisAlignment = START, crossAxisAlignment = START)	Raccourci équivalent à new Flex(Axis::HORIZONTAL, ...).
static column(children, mainAxisAlignment = START, crossAxisAlignment = START)	Raccourci équivalent à new Flex(Axis::VERTICAL, ...).

À savoir. Un enfant non enveloppé dans Flexible se comporte comme un enfant non-Expanded dans un vrai Row/Column Flutter : il conserve sa taille intrinsèque et n'est jamais compté dans le calcul de l'espace restant, même s'il possède un flex implicite de 0.

Voir aussi

• Flexible
• Wrap
• Stack