Flutter padding between border and widget

Question

I'm trying to use Flutter to create a card widget with an icon and a title. But i'm not able to add some margin between border of the cards and the widget.

Here's my card code:

class MyCard extends StatelessWidget{
  MyCard({this.title, this.icon});

  final Widget title;
  final Widget icon;

  @override
  Widget build(BuildContext context) {
  return new Container(
    padding: EdgeInsets.only(bottom: 20.0),
    child: new Card(
      child: new Row(
        children: <Widget>[
          this.icon,
          new Container(
            width: 20.0, //I also don't know if this is legal
          ),
          this.title
        ]
      )
    )
    );
  }
}

That's the result, but I'd like to have more padding inside the card in order to have taller cards and the icons more on the right.

Answer 1

You can wrap widgets in card inside Padding widget or you can use container's padding or margin property to achieve desired layout.

P.S. I have added padding at different levels. Remove or add more padding according to your need.

Code:

class MyCard extends StatelessWidget{

 MyCard({this.title, this.icon});

  final Widget title;
  final Widget icon;

  @override
  Widget build(BuildContext context) {
    return new Container(
        padding: EdgeInsets.only(bottom: 20.0),
        child: new Card(
            child: Padding(
              padding: EdgeInsets.symmetric(vertical: 2.0),
              child: new Row(
                  children: <Widget>[
                    Padding(
                      padding: EdgeInsets.symmetric(horizontal: 5.0),
                      child: this.icon,
                    ),
                    new SizedBox(
                      width: 20.0,
                    ),
                    Container(
                      padding: EdgeInsets.symmetric(vertical: 0.5, horizontal: 1.0),
                      margin: EdgeInsets.all(2.0),
                      child: this.title,
                    )
                  ]
              ),
            )
        )
    );
  }
}