mydomain
No ADS
No ADS

Flutter EdgeInsets Tutorial with Examples

  1. Flutter EdgeInsets
  2. EdgeInsets.all
  3. EdgeInsets.fromLTRB
  4. EdgeInsets.only
  5. EdgeInsets.symmetric
  6. EdgeInsets.fromWindowPadding

1. Flutter EdgeInsets

EdgeInsets helps create the outer padding or the inner padding for a Widget based on the visual parameters, left, top, right, and bottom. It does not depend on the text direction.
To support both left-to-right and right-to-left layouts, take the EdgeInsetsDirectional into consideration.
  • Flutter EdgeInsetsDirectional

2. EdgeInsets.all

No ADS
EdgeInsets.all constructor is used to create an EdgeInsets object with the same value for all four left, top, right, bottom properties.
const EdgeInsets.all(
   double value
)
EdgeInsets.all (ex1)
Container (
    margin: EdgeInsets.all(80),
    color: Colors.greenAccent,
    child:Text(
        "Hi There!",
        style: TextStyle(fontSize: 28)
    )
)

3. EdgeInsets.fromLTRB

EdgeInsets.fromLTRB constructor is used to create an EdgeInsets object based on the left, top, right and bottom values.
const EdgeInsets.fromLTRB(
    double left,
    double top,
    double right,
    double bottom
)
EdgeInsets.fromLTRB (ex1)
Padding (
    padding: EdgeInsets.fromLTRB(80, 100, 70, 50),
    child: ElevatedButton (
        child: Text("Button"),
        onPressed: (){}
    )
)

4. EdgeInsets.only

No ADS
EdgeInsets.only constructor creates an EdgeInsets object from the left, top, right and bottom optional parameters. The unspecified parameters will have a value of 0.
const EdgeInsets.only(
    {double left: 0.0,
    double top: 0.0,
    double right: 0.0,
    double bottom: 0.0}
)
EdgeInsets.only (ex1)
Container (
    color: Colors.greenAccent,
    padding: EdgeInsets.only(left: 120, top: 50, right: 80),
    child: ElevatedButton (
        child: Text("Button"),
        onPressed: (){}
    )
)

5. EdgeInsets.symmetric

EdgeInsets.symmetric constructor creates a symmetric EdgeInsets object from the two horizontal and vertical parameters. It means:
  • left = right = horizontal
  • top = bottom = vertical
const EdgeInsets.symmetric(
    {double vertical: 0.0,
    double horizontal: 0.0}
)
EdgeInsets.symmetric (ex1)
Container (
    color: Colors.greenAccent,
    padding: EdgeInsets.symmetric(horizontal: 120, vertical: 50),
    child: ElevatedButton (
        child: Text("Button"),
        onPressed: (){}
    )
)

6. EdgeInsets.fromWindowPadding

const EdgeInsets.fromWindowPadding(
    WindowPadding padding,
    double devicePixelRatio
)
No ADS

Flutter Programming Tutorials

Show More
No ADS