Introduction au positionnement
Crée un widget qui contrôle la position des enfants de [Stack].
scènes à utiliser :
La position du contrôle peut être placée sous la forme de coordonnées, qui peuvent être utilisées lors de l'empilement des mises en page ;
| Les attributs | effet |
|---|---|
| largeur | largeur |
| hauteur | haut |
| haut | haut |
| bas | fin |
| gauche | gauche |
| droite | droite |
Précautions:
1. Si la largeur et la hauteur sont définies, la gauche et la droite ne peuvent pas exister en même temps, et le haut et le bas ne peuvent pas exister en même temps ; 2.
Si la largeur et la hauteur ne sont pas définies, vous devez définir le haut, attributs bas, gauche et droite
3. haut, bas, Lorsque gauche et droite sont réglés sur zéro, le plein écran sera couvert ;
Lorsque les attributs sont tous à 0, le plein écran est couvert
Positioned(
top: 0,
bottom: 0,
left: 0,
right: 0,
child: Container(
color: ColorsUtils.randomColor(),
child: Text("1"),
),
)
Lorsque le haut et la gauche sont espacés de 50
Stack(
alignment: Alignment.topLeft,
children: [
Positioned(
width: 150,
height: 150,
// top: 10,
// bottom: 10,
// left: 10,
// right: 10,
child: Container(
color: ColorsUtils.randomColor(),
child: Text("1"),
),
),
Positioned(
width: 150,
height: 150,
top: 50,
// bottom: 10,
left: 50,
// right: 10,
child: Container(
color: ColorsUtils.randomColor(),
child: Text("2"),
),
),
],
)
