web-dev-qa-db-fra.com

Définir l'espace entre les éléments dans la rangée Flutter

Code: 

new Container(
          alignment: FractionalOffset.center,
          child: new Row(
            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
            children: <Widget>[
              new FlatButton(
                child: new Text('Don\'t have an account?', style: new TextStyle(color: Color(0xFF2E3233))),
              ),
              new FlatButton(
                child: new Text('Register.', style: new TextStyle(color: Color(0xFF84A2AF), fontWeight: FontWeight.bold),),
                onPressed: moveToRegister,
              )
            ],
          ),
        ),

Et voici le résultat:
https://www.dropbox.com/s/sxklyutyvbbura8/Screenshot_20181104-150928.png?dl=0

Comment corriger le fait que les deux éléments FlatButton sont côte à côte sans espace entre le centre de la largeur de l'écran?

dartflutterrow
2
marcelo.wdrb

Enlever de l'espace-:

new Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              GestureDetector(
                child: new Text('Don\'t have an account?',
                    style: new TextStyle(color: Color(0xFF2E3233))),
                onTap: () {},
              ),
              GestureDetector(
                onTap: (){},
                  child: new Text(
                'Register.',
                style: new TextStyle(
                    color: Color(0xFF84A2AF), fontWeight: FontWeight.bold),
              ))
            ],
          ),

OR

GestureDetector(
            onTap: (){},
            child: new Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: <Widget>[
                new Text('Don\'t have an account?',
                    style: new TextStyle(color: Color(0xFF2E3233))),
                new Text(
                  'Register.',
                  style: new TextStyle(
                  color: Color(0xFF84A2AF), fontWeight: FontWeight.bold),
                )
              ],
            ),
          ),
2
anmol.majhail

MainAxisAlignment

start - Placez les enfants aussi près que possible du début de l'axe principal.

 enter image description here

end - Placez les enfants aussi près que possible de l'extrémité de l'axe principal.

 enter image description here

center - Placez les enfants aussi près que possible du centre de l'axe principal.

 enter image description here

spaceBetween - Placez l'espace libre également entre les enfants.

 enter image description here

spaceAround - Placez l'espace libre de manière égale entre les enfants et la moitié de cet espace avant et après le premier et le dernier enfant.

 enter image description here

spaceEvenly - Placez l'espace libre de manière égale entre les enfants, ainsi qu'avant et après le premier et le dernier enfant.

 enter image description here

Exemple:

  child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: <Widget>[
          Text('Row1'),
          Text('Row2')
        ],
      )
6
Shelly Pritchard

Utiliser MainAxisAlignment.spaceBetween

  new Row(
    mainAxisAlignment: MainAxisAlignment.spaceBetween,
    children: <Widget>[
      Text("Left"),
      Text("Right")
    ],
  ),
0
Pablo Cegarra

Essaye ça

Container(
      alignment: FractionalOffset.center,
      child: Row(
        children: <Widget>[
          Expanded(flex: 1, child: Container(),), // remove 1
           FlatButton(
            padding: EdgeInsets.all(0.0), // remove all padding from button 1
            onPressed: () {},
            child: new Text('Don\'t have an account?', style: new TextStyle(color: Color(0xFF2E3233))),
          ),
           FlatButton(
            child: new Text('Register.', style: new TextStyle(color: Color(0xFF84A2AF), fontWeight: FontWeight.bold),),
            onPressed: (){},
          ),
          Expanded(flex: 1, child: Container(),), // remove 2
        ],
      ),
    );

Vous pouvez supprimer 1 et 2 si vous ne souhaitez pas laisser d'espaces à gauche et à droite du bouton. 

0
CopsOnRoad