Small knowledge, big challenge! This article is participating in the creation activity of “Essential Tips for Programmers”.

I have been using Flutter for a long time and have not studied the life cycle of Flutter carefully. Today I will learn about the life cycle of Flutter in several scenarios.

Side dish with the aid of WidgetsBinding by watching and listening didChangeAppLifecycleState events, to analyze the life cycle is similar to the Android native;

The basic scenario

1. Initialization

initState -> didChangeDependencies -> build

2. Update page data

There are no lifecycle changes involved in page button clicks or pop-ups, but Widget resources are updated in build. However, if the thermal overload is carried out, the lifecycle is as follows:

reassemble -> didUpdateWidget -> build

3. Switch between horizontal and vertical screens

DidUpdateWidget -> Build -> didUpdateWidget -> Build (run twice)

4. Cut backstage

didChangeAppLifecycleState(AppLifecycleState.inactive) -> didChangeAppLifecycleState(AppLifecycleState.paused) -> build

Cut back to the front desk

didChangeAppLifecycleState(AppLifecycleState.inactive) -> didChangeAppLifecycleState(AppLifecycleState.resumed) -> build

6. Destroy the page

deactivate -> dispose

Advanced scenarios

7. Open a new page

Deactivate -> didChangeDependencies -> build

8. New pages are cut to the background (old pages are not destroyed)

The old/new page didChangeAppLifecycleState (AppLifecycleState. Inactive) – > didChangeAppLifecycleState (AppLifecycleState. Paused) – > build

9. New pages are cut back to the foreground

The old/new page didChangeAppLifecycleState (AppLifecycleState. Inactive) – > didChangeAppLifecycleState (AppLifecycleState. Resumed) – > build

10. New pages are destroyed

Deactivate the old page – > build (AppLifecycleState resumed) – > new page deactivate – > the dispose

Special scenario

Small dish also tried Android7.0 split screen case life cycle;

11. Go to the split screen window

didChangeAppLifecycleState(AppLifecycleState.inactive) -> didChangeAppLifecycleState(AppLifecycleState.paused) -> build (Same as cutting to the background)

12. Split the screen

didChangeAppLifecycleState(AppLifecycleState.inactive) -> didChangeAppLifecycleState(AppLifecycleState.resumed) -> didChangeAppLifecycleState(AppLifecycleState.inactive) -> build

13. Get focus

didChangeAppLifecycleState(AppLifecycleState.resumed) -> build

14. Screen sizing

Different from Android, adjusting the screen size does not carry out life cycle change. The premise is that the current application has obtained focus. If not, the life cycle method of obtaining focus will be carried out when the screen size is adjusted to full screen.

A small summary

  1. The entire lifecycle is divided into three parts: initialization/state change/destruction;
  2. InitState is called only once during the initialization phase of the entire lifecycle;
  3. DidChangeDependencies Called when the State object dependency changes;
  4. DidUpdateWidget Called when the state of the Widget changes; Flutter actually creates a new Widget every time it updates its status and compares the old and new widgets in this function. This method is typically followed by a call to build;
  5. Reassemble is only called for debug or hot reload;
  6. Deactivate is called when a State object is removed from the Widget Tree, usually before dispose.
  7. Dispose is used when a Widget is destroyed. It usually removes listeners or cleans up data in this method and is executed only once in its entire life cycle.
  8. The resumed application is visible and gets focus state, similar to Android onResume();
  9. Inactive The application is inactive;
  10. Paused Application is invisible to the user, does not respond to the user, and is running in the background, similar to Android onPause().

Life cycle is very important and very interesting, it is worth trying and studying more, xiao CAI only tried several common situations, if there are mistakes, please give more guidance!

Source: Little Monk A Ce