Flutter & .NET Blog

Expert insights on Flutter, Dart, and .NET development

Rounded Buttons in Flutter with Material Design 3

Rounded Buttons in Flutter with Material Design 3

Rounded buttons in Material Design 3 is even simpler than before. Google’s latest design language offers the ability to enable rounded buttons by default with a single flag in the theme configuration. This blog post will walk you through the process of creating rounded buttons in Flutter using Material Design 3. It will demonstrate how to enable the useMaterial3 flag in ThemeData and showcase four different button configurations. Enabling Material Design 3 Rounded Buttons Set the useMaterial3 flag in the ThemeData. The following code demonstrates this: MaterialApp( theme: ThemeData(useMaterial3: true), //... ), If the useMaterial3 flag is true, Material Design 3’s default button style has rounded corners. Let’s explore a few examples using this flag. Basic ElevatedButton This is a simple ElevatedButton using Material Design 3’s default style. The button will have rounded edges by default. No additional style configuration...
Christian Findlay Christian Findlay Apr 03, 2023