Buttons In Flutter
Flutter Buttons
Buttons are an essential part of any application. They allow you to interact with the app and perform various actions. In this section, you will learn about different types of buttons available in Flutter, along with examples for each.
Button Types in Flutter
You can get different types of buttons in Flutter, such as:
| Button | Description |
|---|---|
| Material Button | Mostly used button with material design. |
| Elevated Button | Shadowed button for important actions. |
| Text Button | Flat button for less important actions. |
| Outlined Button | Border button for secondary actions. |
| Icon Button | Button with an icon. |
| Floating Action Button | Circular main action button. |
| Dropdown Button | Button to select from a list of options. |
| Popup Menu Button | Button that shows more options. |
Note: You will learn about each button type with real world examples in upcoming sections.
Button Useful Properties
Here are some common properties that you can use with buttons in Flutter:
| Property | Description |
|---|---|
| onPressed | Things to do when the button is pressed. |
| child | Widget to display inside the button. |
Example 1: Simple MaterialButton In Flutter
If you want to create a simple button with text, use the MaterialButton widget. It is a versatile button that can display text, icons, and more.
MaterialButton(
onPressed: () {
// action to perform when button is pressed
},
color: Colors.blue,
child: const Text('Press Me', style: TextStyle(color: Colors.white)),
)
Popular Buttons in Flutter
In upcoming sections, you will learn about different types of buttons available in Flutter, along with examples for each. Click on the links below to get started with flutter buttons: