Position buttons in a card. Flutter

Question

I am having some troubles to position 2 buttons in a card in Flutter. I had this:

But I want this:

My code for the buttons of this card is:

new ButtonTheme.bar(
    child: new ButtonBar(
      alignment: MainAxisAlignment.start,
      children: <Widget>[
        Row(
          children: <Widget>[
            Column(
              children: <Widget>[
                new FlatButton(
                  child: Icon(
                    Icons.share,
                    color: Colors.white,
                  ),
                  color: Color.fromRGBO(68, 153, 213, 1.0),
                  shape: CircleBorder(),
                  onPressed: () {
                    Share.share(
                      data[index]["link"],
                    );
                  },
                ),
              ],
            ),
            Column(
              children: <Widget>[
                FlatButton(
                  color:
                  Color.fromRGBO(161, 108, 164, 1.0),
                  child: const Text('Read Article'),
                  shape: new RoundedRectangleBorder(
                      borderRadius:
                      new BorderRadius.circular(
                          30.0)),
                  textColor: Colors.white,
                  onPressed: () {
                    launch(data[index]["link"],
                        forceWebView: false);
                  },
                ),
              ],

            )
          ],
        ),

      ],
    ),

Answer 1

From the documentation

ButtonBar.children : The buttons to arrange horizontally

I think you are doing a lot of unnecessary stuff, to get the result just put the buttons inside ButtonBar without extra layout widgets like Row and Column

here is the code :

ButtonTheme.bar(
          child: new ButtonBar(
            alignment: MainAxisAlignment.spaceBetween,
            children: <Widget>[
              FlatButton(
                child: Icon(
                  Icons.share,
                  color: Colors.white,
                ),
                color: Color.fromRGBO(68, 153, 213, 1.0),
                shape: CircleBorder(),
                onPressed: () {},
              ),
              FlatButton(
                color: Color.fromRGBO(161, 108, 164, 1.0),
                child: const Text('Read Article'),
                shape: new RoundedRectangleBorder(
                    borderRadius: new BorderRadius.circular(30.0)),
                textColor: Colors.white,
                onPressed: () {},
              ),
            ],
          ),
        ),

Answer 2

You can use a different alignment on your ButtonBar or Row:

alignment: MainAxisAlignment.spaceBetween