Padding in Flutter

18-Sep-2024

Learn how to use the Padding widget in Flutter to control spacing inside and around widgets

Padding is used to add space around the widget's content. You can apply padding to various Flutter widgets to control the spacing between the widget's content and its borders. Padding widgets are often used for this purpose

There Are Some Common Attributes for Padding

EdgeInsets.only
top, bottom, left, right -> you can set different padding
EdgeInsets.allYou can set same padding in all side

Here's a simple example of using a Column in Flutter:

File open lib->main.dart file −



import 'package:flutter/material.dart';

void main() {
runApp(
MaterialApp(
home: Scaffold(
appBar: AppBar(
backgroundColor: Colors.blue,
title: Text('Padding Example',
style:TextStyle(fontSize: 20,color: Colors.white)),
),
body: MyApp(),
),
)
);
}

class MyApp extends StatelessWidget {

@override
Widget build(BuildContext context) {
return
Center(
child: Padding(
padding: EdgeInsets.only(top: 10.0,bottom: 10.0,left: 10.0,right: 10.0),
// padding: EdgeInsets.all(10),
child: Container(

alignment: Alignment.center,
child: Text("Micro Tutorial",
style:TextStyle(fontSize: 20,color: Colors.red),
)
)
)
);
}
}









Open Device Manager, run the emulator, and then run the application. Next, check the working output and check the output you declared in your code.


Output:


Comments