Create Material Style Button in Flutter using RaisedButton Example

Flutter comes with inbuilt material design button widget known as RaisedButton. RaisedButton has all the styling options that can make a button looks so much beautiful in both android & iOS applications. As we all know button is the most essential component in mobile applications. Every time when user wants to perform some on click event functionality in apps then button is the solution. In this tutorial we would make a RaisedButton with some basic options in flutter. So in this tutorial we would Create Material Style Button in Flutter using RaisedButton Example Tutorial in Android iOS mobile application.

Contents in this project Create Material Style Button in Flutter using RaisedButton Example for Android iOS:

1. Import material.dart package in your app’s main.dart file.

2. Create void main() runApp() method and call MyApp class.

3. Create our main MyApp class extends with StatelessWidget.

4. Create a function named as sampleFunction() in MyApp class. We would call this function on button onPress event. We are printing a simple message using print() function. This message will display on Command prompt or Terminal screen.

5. Creating RaisedButton widget in Widget Build area.

  • child : Pass here Text widget to show Button above text.
  • onPressed : Calling the function here.
  • color : Button background color.
  • textColor : Button text color.
  • padding : to set padding.
  • splashColor : to set color of button while pressing.

6. Complete source code for main.dart file:

Screenshot:

Create Material Style Button in Flutter using RaisedButton Example

Output:

2 Comments

  1. K Pradeep Kumar Reddy

    how to set the height and width of Raised button ?

Leave a Reply

Your email address will not be published.