CODEWITHSUNDEEP
flutterdartcross-platform
Thashreef Mohammed
Thashreef Mohammed

Reputation: 213

SizedBox and Padding.. Does it make any difference?

I wanted to leave a space between the texts 'NAME' and 'Thashreef'. So i used padding: EdgeInsets.only(top:10) and in the video tutorial it was SizedBox(height:10). Are both these functions same?


void main()=> runApp(MaterialApp(
  home: FirstPage()
));

class FirstPage extends StatelessWidget{
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Scaffold(
      backgroundColor: Colors.grey[900],
      appBar: AppBar(
        title: Text('Ninja ID Card'),
        centerTitle: true,
        backgroundColor: Colors.grey[850],
        elevation: 0.0,
      ),
      body: Padding(
        padding: EdgeInsets.fromLTRB(20,30,40,50),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: <Widget>[
            Text('NAME',style: TextStyle(
              color:Colors.grey,
              letterSpacing: 2.0),),
            Padding(
              padding: const EdgeInsets.only(top:10),
              child: Text('Thashreef',
                style: TextStyle(
                    color: Colors.yellowAccent,
                    letterSpacing:2.0,fontSize: 28.0,fontWeight: FontWeight.bold)),
            )

          ],
        ),
      ),
    );
  }
}```

Upvotes: 6

Views: 12206

Answers (1)

J. S.
J. S.

Reputation: 9635

Padding and SizedBox Widgets are not the same.

Padding serves to surround a Widget with space all around it or on specific sides.

SizedBox is a Widget that doesn't require to have a child and can be set with just a height or width. This means it can be used as a simple spacer inside Widgets that contain multiple children like Row or Column. As was likely the case of the tutorial you followed.

Upvotes: 8

Related Questions