preface

Just like other view frameworks such as Android activities, the view widgets in Flutter have a lifecycle. The lifecycle callbacks are carried out in State. Understanding the flutter life cycle is essential for us to write a rational control. The lifecycle of component states is arranged as follows:

You can think of it roughly as three stages

• Initialize (insert render tree)
• State changes (present in the render tree)
• Destroy (remove from render tree)

Each function

The constructor

This function is not part of the lifecycle because the widget property of State is empty and it is not possible to access the widget property in the constructor. But the constructor must be called first.

initState

/// Called when this object is inserted into the tree.

Called when the render tree is inserted, this function is called only once in the life cycle. Here you can do some initialization, such as initializing the State variable.

didChangeDependencies

/// Called when a dependency of this [State] object changes.

This function will follow after initState call, and you can call BuildContext. InheritFromWidgetOfExactType, So BuildContext. InheritFromWidgetOfExactType usage scenario is what? The classic application scenario is

New DefaultTabController(Length: 3, Child: new TabBar(tabs: [" page "," order "," my "]. Map ((data)=>new Text(data)).tolist (),Copy the code

TabBar should define a TabController, but DefaultTabController does not need to define TabContrller.

@override void didChangeDependencies() { super.didChangeDependencies(); _updateTabController(); _initIndicatorPainter(); } void _updateTabController() { final TabController newController = widget.controller ?? DefaultTabController.of(context); .Copy the code

Notice that defaulttabController.of (context)

static TabController of(BuildContext context) { final _TabControllerScope scope = context.inheritFromWidgetOfExactType(_TabControllerScope); return scope? .controller; }Copy the code

Is actually called BuildContext inheritFromWidgetOfExactType, also said in the didChangeDependencies, can get data across components.

didUpdateWidget

/// Called whenever the widget configuration changes.

DidUpdateWidget is called when the component’s state changes, such as setState.

Here the flutter framework actually creates a new Widget, binds this State, and passes the old Widget in this function.

This function is typically used to compare old and new widgets, see which properties have changed, and make some adjustments to State.

Note that when changes are made to the controller, you need to remove the old controller listener from this function and create the new controller listener.

Again, TabBar:

deactivate

/// Called when this object is removed from the tree.

This function is called before Dispose.

dispose

/// Called when this object is removed from the tree permanently.

Once the component is destroyed at this stage, this function typically removes listeners and cleans up the environment.

Or TabBar:

To summarize