flutterbuttoncontainersspace

Flutter: How to add space between two buttons in a row

I created two container in a row and want it in center of the screen so i used padding for it, but they more are close to each other, i want to add space between them. here is the snap of output.

enter image description here

Code:

 Padding(
            padding: EdgeInsets.fromLTRB(40, 250, 30, 0),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceEvenly,
              children: <Widget>[
                new Flexible(
                  flex: 2,
                  child: Container(
                    decoration: BoxDecoration(
                        color: Colors.pink,
                        borderRadius: BorderRadius.all(Radius.circular(3))),
                    height: 50,
                    width: 190,
                      child: Center(
                        child: Column(
                          children: <Widget>[
                            FlatButton(onPressed: (){}, child: Text("in",style:TextStyle(fontSize: 20))),
                          ],
                        ),
                      ),
                    ),
                  ),
                new Flexible(
                  flex: 2,
                  child: Container(
                    decoration: BoxDecoration(
                        color: Color(int.parse(presentcolor)),
                        borderRadius: BorderRadius.all(Radius.circular(3))),
                  height: 50,
                    width: 190,
                      child: Center(
                        child: Column(
                          children: <Widget>[
                             FlatButton(onPressed: (){}, child: Text("out",style:TextStyle(fontSize: 20))),
                          ],
                        ),
                      ),
                    ),
                  ),
Solution

  • Use a Spacer or a SizedBox between 2 widgets.

    Other option is to set mainAxisAlignment of Row to MainAxisAlignment.spaceBetween.