Stateful Widget Vs. Stateless Widget

This is the eleventh article of the Flutter series. Today we are going to learn on Stateful widgets.

Let’s see what is “state”. The state is information that can read synchronously when the widget is built and might change during the lifetime of the widget.

Classes that inherit “StatefulWidget” are immutable. But, the state is mutable.

Super class is StatefulWidget and generic class is State.

Stateful Widget

· When a widget changes (user interact with it) we call it as “Stateful”.

Eg: Checkbox

RadioButton

Form

TextField

· Overrides the createState() and returns a State.

· Use when the user interface changes dynamically.

· When the widget’s state changes, the state object calls setState(), telling the framework to redraw the widget.

Stateless Widget

· No internal state to manage or no direct user interaction in Stateless widget.

Eg: Text

RadioButton

Icon

IconButton

· Overrides the build() and returns a Widget.

· Use when the user interface depends on the information within object itself.

Using Stateful widgets

Steps

· Create a class that extends a “StatefulWidget”, that returns a State in “createState()”

· Create a “State” class, with properties that may change

· Within “State” class, implement the “build()” method

· Call the setState() to make the changes. Calling setState() tells framework to redraw widget

· Create a class that extends a “StatefulWidget”, that returns a State in “createState()”

· Create a “State” class, with properties that may change

· Within “State” class, implement the “build()” method

· Call the setState() to make the changes. Calling setState() tells framework to redraw widget

Hope you got some understanding on Stateful widgets and stateless widgets. See you in another article. Happy learning!!!

Hirudini Udugama