In this tutorial, we’ll learn how to implement Flutter elevated button remove padding with the help of an easy Flutter example.
Introduction: Flutter Elevated Button Remove Padding
Padding in elevated button is used to create a distance between the elevated button borders and the child widget. We’ll first give our elevated button a child text widget to see the default padding. After that, we’ll implement Flutter elevated button remove padding.
Default Padding Of Flutter Elevated Button
For that, we’ve to implement a simple elevated button with child text widget. See below code:
ElevatedButton( onPressed: () {}, child: Text( 'Flutter Elevated Button With Default Padding', ))
![[Solved] Flutter Elevated Button Remove Padding Implementation 3 flutter elevated button default padding](https://letmeflutter.com/wp-content/uploads/2022/10/IMG_20221004_110235-300x88.jpg)
Remove Padding From Flutter Elevated Button
In order to do that, we’ve to pass ElevatedButton.styleFrom() to the style constructor of elevated button widget. After that, we’ve to pass Size.zero to the mimimumSize and EdgeInsets.all(0) to the padding. See below code:
ElevatedButton( onPressed: () {}, style: ElevatedButton.styleFrom( minimumSize: Size.zero, padding: EdgeInsets.all(0)), // can also use EdgeInsets.zero child: Text( 'Flutter Elevated Button With No Padding', ))
![[Solved] Flutter Elevated Button Remove Padding Implementation 4 flutter elevated button remove padding](https://letmeflutter.com/wp-content/uploads/2022/10/IMG_20221004_110259-300x88.jpg)
Flutter Elevated Button Remove Padding Source Code
import 'package:flutter/material.dart'; void main() { runApp(const MyApp()); } class MyApp extends StatelessWidget { const MyApp({Key? key}) : super(key: key); @override Widget build(BuildContext context) { return MaterialApp( debugShowCheckedModeBanner: false, home: Homepage(), ); } } class Homepage extends StatefulWidget { @override State<Homepage> createState() => _HomepageState(); } class _HomepageState extends State<Homepage> { @override Widget build(BuildContext context) { return SafeArea( child: Scaffold( body: Center( child: ElevatedButton( onPressed: () {}, style: ElevatedButton.styleFrom( minimumSize: Size.zero, padding: EdgeInsets.all(0)), child: Text( 'Flutter Elevated Button With No Padding', ))))); } }
Conclusion
To conclude this tutorial, now you’ve a detailed and in-depth practical knowledge of how to implement Flutter elevated button remove padding. I’d love to have your feedback on this post.
I’d also love to see you visit my other tutorials on Flutter app development and Python programming as well. Thank you for reading this post.