In this article, I'm going to share the email of how to expand the size of the button in Flutter.
This can be achieved by wrapping the Button widget inside a FractionallySizedBox and specifying widthFactor and heightFactor as below.
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( widthFactor: color: rgb(181, 206, 168);](0.5,line-height: 19px;]( heightFactor: color: #b5cea8;](0.5, child: color: #4ec9b0;](RaisedButton( onPressed: () { color: #dcdcaa;](print(color: #ce9178;]('Button Clicked'); }, child: color: #4ec9b0;](Text(color: #ce9178;]('Click me'), ), )
So, widthFactor expands the button horizontally and heighFactor expands the button vertically.
This is how your button will appear.
![](https://fluttercentral.com/Uploads/4d3c3c87-21ff-47e4-9e7e-56cb8afc6f57.PNGwidth="50%height="auto](
Here is the full 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: #6a9955;](// How to expand a Button in Flutter?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;]("Expand Button Example"), ), body: color: #4ec9b0;](Center( child: color: #4ec9b0;](Container( alignment: color: #4ec9b0;](Alignment.center, child: color: #4ec9b0;](FractionallySizedBox( widthFactor: color: #b5cea8;](0.5, heightFactor: color: #b5cea8;](0.5, child: color: #4ec9b0;](RaisedButton( onPressed: () { color: #dcdcaa;](print(color: #ce9178;]('Button Clicked'); }, child: color: #4ec9b0;](Text(color: #ce9178;]('Click me'), ), ) ), )), ); }}
Thanks,Srikanth