The state of an app can very simply be defined as anything that exists in the memory of the app while the app is running. This includes all the widgets that maintain the UI of the app including the buttons, text fonts, icons, animations, etc. So now as we know what are these states lets dive directly into our main topic i.e what are these stateful and stateless widgets and how do they differ from one another.
Stateless Widget: The widgets whose state can not be altered once they are built are called stateless widgets. These widgets are immutable once they are built i.e any amount of change in the variables, icons, buttons, or retrieving data can not change the state of the app. Below is the basic structure of a stateless widget.
So let us see what this small code snippet tells us. The name of the stateless widget is MyApp which is being called from the runApp() and extends a stateless widget. Inside this MyApp a build function is overridden and takes BuildContext as a parameter. This BuildContext is unique to each and every widget as it is used to locate the widget inside the widget tree.
Note: The widgets of a Flutter application are displayed in the form of a Widget Tree where we connect the parent and child widgets to show a relationship between them which then combines to form the state of your app.
The build function contains a container which is again a widget of Flutter inside which we will design the UI of the app. In the stateless widget, the build function is called only once which makes the UI of the screen.
Stateful Widgets: The widgets whose state can be altered once they are built are called stateful Widgets. These states are mutable and can be changed multiple times in their lifetime. This simply means the state of an app can change multiple times with different sets of variables, inputs, data. Below is the basic structure of a stateful widget.
So let us see what we have in this code snippet. The name of the Stateful Widget is MyApp which is called from the runApp() and extends a stateful widget. In the MyApp class, we override the create state function. This createState() function is used to create a mutable state for this widget at a given location in the tree. This method returns an instance for the respected state subclass. The other class which is _MyAppState extends the state, which manages all of the changes in the widget. Inside this class, the build function is overridden which takes the BuildContext as the parameter. This build function returns a widget where we design the UI of the app. Since it is a stateful widget the build function is called many times which creates the entire UI once again with all the changes.
Stateless widget is useful when the part of the user interface you are describing does not depend on anything other than the configuration information and the BuildContext whereas a Stateful widget is useful when the part of the user interface you are describing can change dynamically.
- Difference Between Stateless and Stateful Widget in Flutter
- What is widgets in Flutter?
- Row and Column Widgets in Flutter with Example
- How to Add Space Between Widgets in Flutter?
- MaterialApp class in Flutter
- Difference between React Native and Flutter
- Scaffold class in Flutter with Examples
- Difference Between Rows and Columns vs Container in Flutter
- Multi Page Applications in Flutter
- Routes and Navigator in Flutter
- Flutter GridView
- Container class in Flutter
- Rive animations in Flutter
- ProgressIndicator in Flutter
- Wrap Widget in Flutter
- Listview.builder in Flutter
- Splash Screen in Flutter
- How to Add images in Flutter App?
- A Hello World App using Flutter
- Raised Button widget in Flutter
If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to firstname.lastname@example.org. See your article appearing on the GeeksforGeeks main page and help other Geeks.
Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.
Improved By : tanmayhi54320