What is the difference between initState and a class constructor in Flutter?

Question

I read the documentation but it is not clear.

It states "[initState is] Called when this object is inserted into the tree."

When a widget is inserted into a tree, it means it has been created, which means the class constructor is called. What is the purpose of init? Isn't the constructor's purpose to initialize the class instance?

Thank you guys for your time.

Can you link to the documentation you are reading, please? I am guessing it is: https://docs.flutter.io/flutter/widgets/State/initState.html — T.Woody, Aug 28 '18 at 22:23
@T.Woody yea that is the one. I read through it more than 5 times. I still don't understand what it means by "depends on the location at which the object was inserted" or "used to configure this widget". Isn't all of that what the class constructor is for? — Walter M, Aug 28 '18 at 22:31
I am looking at the direct code to see if I can find it. https://github.com/flutter/flutter/search?q=class+initstate&unscoped_q=class+initstate — T.Woody, Aug 28 '18 at 22:33
Have you looked at the code directly, yourself, yet? Feedback on where not to look when be helpful :) — T.Woody, Aug 28 '18 at 22:34
I believe `initState` is derived from (and behaves similar to) after comparing the way the documentation reads: https://apache.github.io/incubator-heron/api/java/com/twitter/heron/api/topology/IStatefulComponent.html#initState-com.twitter.heron.api.state.State- — T.Woody, Aug 28 '18 at 22:42

MatPag · Accepted Answer · 2021-12-29T13:06:47.057

43

The difference is (in the context of creating a State object) which has the initState() method:

constructor simply create a new State instance

initState() is called after the object is created and at this point you have access to the BuildContext or the StatefulWidget to which the State is attached to, respectively using the context and the widget properties. At this point the State is already mounted.

Reference State: https://api.flutter.dev/flutter/widgets/State-class.html

Reference mounted State: https://api.flutter.dev/flutter/widgets/State/mounted.html

edited Dec 29 '21 at 13:06

answered Aug 28 '18 at 22:46

MatPag

41,742
14
105
114

If you are coming from the python world. Constructor is like the __new__() and initState is like __init__(). – Sandeep Thapa Feb 08 '22 at 08:09

score 17 · Answer 2 · edited Nov 21 '20 at 12:06

17

In some cases you will need to start an animation or change the state when you create your Widget, then is not possible to do that in your constructor because your Widget is not inserted in the tree yet.

Example of AnimationController

    AnimationController _animationController ;

    ...

      @override
        void initState() {
        ... instance the animationController

          _animationController.forward();
          super.initState();
        }

Another example, when you receive some params from another Widget, let say your StatefulWidget has a param named title and you want to create a local variable in your State class to handle the state, you will have to do something like this:

  class ExampleWidget extends StatefulWidget {

   final String title;

   ExampleWidget({this.title});

  ....


  YourStateClass extends State<ExampleWidget> {

  var localVariable;

  @override
        void initState() {
          localVariable = widget.title;
          super.initState();
        }

And now you could use your localVariable inside your widget tree to update the state.

edited Nov 21 '20 at 12:06

iDecode

22,623
19
99
186

answered Aug 28 '18 at 22:41

diegoveloper

93,875
20
236
194

Does this from the twitter API make some sense in the Flutter context, too? https://apache.github.io/incubator-heron/api/java/com/twitter/heron/api/topology/IStatefulComponent.html#initState-com.twitter.heron.api.state.State- – T.Woody Aug 28 '18 at 22:47
@diegoveloper Wow, your first explanation was clear as day. I have grasp on it now. However, for the second example....couldn't you just pass the "title" variable through the constructor of YourStateClass constructor? Such as: YourStateClass(title); – Walter M Aug 28 '18 at 23:51
1

Yes you can, but you can not call setState inside the constructor – diegoveloper Aug 28 '18 at 23:53
Last question. If you can access the 'title' property by passing it through the YourStateClass constructor, what is the benefit of doing it via initState() instead? – Walter M Aug 29 '18 at 00:02
@WalterM ok in this case is in reverse , let say you initialized your localVar in your constructor, then you put your localVar in your widget. You will see the value because it was set before your widget was in the tree. But if you initiliazed your localVar in initState, and use your localVar in your widget, you won't see the changes until you call setState because your widget was already create before you initialized the value. – diegoveloper Aug 29 '18 at 00:07

score 3 · Answer 3 · edited Jun 20 '20 at 09:12

constructor is used to create an instance(object).

initstate is used to initalize the contents of an already existing object.

For example,

Suppose you open an app having multiple routes / pages. When u open any particular page then an object A of its contents is created (with some initial data) which u see on screen.

Now suppose u press a button (which performs a specific task that changes the data) on that particular page. Then initstate will be called to initalize the data of object A without having u to open the app again from fresh.

Also, it must be noted that initstate is called before build and no context is available at that moment.

Thats all.

What is the difference between initState and a class constructor in Flutter?

3 Answers3

Linked