How to add Space between two widgets?

<p>In this article, I'm going to share the code on how to add space between two widgets. Here is how it looks before and after. <strong>Before:</strong>![](https://fluttercentral.com/Uploads/f7e5bc9f-f35a-4c6b-8dec-e69ed1af3226.PNGwidth="50%height="auto](</p> <p><strong>After:</strong> ![](https://fluttercentral.com/Uploads/8d7019a7-7004-413e-968d-4d1dfeae0d0c.PNGwidth="50%height="auto](</p> <p>This can be achieved through FractionalSizedBox, by specifying heightFactor. color: rgb(212, 212, 212); background-color: rgb(30, 30, 30); font-family: Consolas, "Courier New", monospace; font-size: 14px; line-height: 19px; white-space: pre;](color: #4ec9b0;](FractionallySizedBox(heightFactor: color: rgb(181, 206, 168);](0.1,) But, you will see the <strong>yellow-striped lines with both widgets places on extreme ends</strong> when you don't wrap it inside a Flexible widget. So, in order to achieve this, below is the code which is required. color: rgb(212, 212, 212); background-color: rgb(30, 30, 30); font-family: Consolas, "Courier New", monospace; font-size: 14px; line-height: 19px; white-space: pre;](color: #4ec9b0;](Flexible(child:color: rgb(78, 201, 176);](FractionallySizedBox(heightFactor: color: #b5cea8;](0.1,)), Here is the final code from main.dart file. color: rgb(212, 212, 212); background-color: rgb(30, 30, 30); font-family: Consolas, "Courier New", monospace; font-size: 14px; line-height: 19px; white-space: pre;](color: #569cd6;](import color: #ce9178;]('package:flutter/material.dart'; color: #569cd6;](void color: #dcdcaa;](main() => color: #dcdcaa;](runApp(color: #4ec9b0;](MyApp()); color: #569cd6;](class color: #4ec9b0;](MyApp color: #569cd6;](extends color: #4ec9b0;](StatefulWidget { color: #569cd6;](@override color: #4ec9b0;](_MyAppState color: #dcdcaa;](createState() => color: #4ec9b0;](_MyAppState();} color: #569cd6;](class color: #4ec9b0;](_MyAppState color: #569cd6;](extends color: #4ec9b0;](State { color: #4ec9b0;](double padValue = color: #b5cea8;](0; color: #569cd6;](@override color: #4ec9b0;](Widget color: #dcdcaa;](build(color: #4ec9b0;](BuildContext context) { color: #c586c0;](return color: #4ec9b0;](MaterialApp( home: color: #4ec9b0;](Scaffold( appBar: color: #4ec9b0;](AppBar( title: color: #4ec9b0;](Text(color: #ce9178;]("Space between widgets Example"), ), body: color: #4ec9b0;](Center( child: color: #4ec9b0;](Column( children: [ color: #4ec9b0;](Flexible( child:color: #4ec9b0;](FractionallySizedBox( heightFactor: color: #b5cea8;](0.1, )), color: #4ec9b0;](RaisedButton( onPressed: () { color: #dcdcaa;](print(color: #ce9178;]('Button Clicked'); }, child: color: #4ec9b0;](Text(color: #ce9178;]('Click me'), ), color: #4ec9b0;](Flexible( child:color: #4ec9b0;](FractionallySizedBox( heightFactor: color: #b5cea8;](0.1, )), color: #4ec9b0;](RaisedButton( onPressed: () { color: #dcdcaa;](print(color: #ce9178;]('Button Clicked'); }, child: color: #4ec9b0;](Text(color: #ce9178;]('Click me'), )] ), )), ); }} Thanks,Srikanth</p>