Flutter Enable Disable RaisedButton Widget Dynamically Example Tutorial

RaisedButton widget in flutter has automatically enabling and disabling button functionality without any prop. In flutter we do not pass any function or onClick method to Raised Button then it will automatically disable the button, There is no fix property present for this. So we are using Ternary operator on onPressed event and using the Ternary operator we would enable and disable the button. First we would make a Boolean type state and put the State in first part of Ternary operator then put the function which we want to call on State True and then put Null assignment. If State value is false then it will call the Null argument and button will be Disabled. So in this tutorial we would Flutter Enable Disable RaisedButton Widget Android iOS Example Tutorial.

Contents in this project Flutter Enable Disable RaisedButton Widget Android iOS Example Tutorial:

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

2. Create void main runApp() method and here we would call our main MyApp widget class.

3. Create our main class named as MyApp extends with StatelessWidget. In this class we would call Button() class in Center area.

4. Create a class named as Button extends StatefulWidget. In this class we would make createState() method of State with ButtonState() class. This would enable the State management in Given class tree.

5. Create a class named as ButtonState extends State. This is our main child class.

6. Create a Boolean variable named as isEnabled with default True value. This would by-default enable the Raised Button.

7. Create a function named as enableButton(). In this function we would set the isEnabled variable value as True. Using this function we would Enable the button.

8. Create a function named as disableButton(). In this function we would Disable the Raised Button.

9. Create a function named as sampleFunction(). We would call this function from Disabled button when it will be enabled.

10. Creating Widget Build area -> Scaffold widget -> Center widget -> Column widget -> Creating 3 Raised Button. The first Raised Button is our Disabled button and the other two buttons will be controlling whether to enable the above button or Disable the above button.

See the Image for more understanding, How Ternary operator works here:

11. Complete source code for main.dart file:

Screenshots:

Flutter Enable Disable RaisedButton Widget Dynamically Example Tutorial Flutter Enable Disable RaisedButton Widget Dynamically Example Tutorial

Leave a Reply

Your email address will not be published.