13
13
14
14
## Overview
15
15
16
- State Management Examples
16
+ > State is information that (1) can be read synchronously when the widget is
17
+ > built and (2) might change during the lifetime of the widget.
18
+ >
19
+ > — [ State-class] ( https://api.flutter.dev/flutter/widgets/State-class.html )
17
20
18
- Simple application with several state managements approaches.
21
+ ** State Management** : it is the management of the state of one or more user
22
+ interface controls such as text fields, OK buttons, radio buttons, etc. in a
23
+ graphical user interface.
19
24
20
25
This project is heavily inspired by the Bachelor's thesis of [ Dmitrii Slepnev] ( https://github.com/sdim2016/flutter-state-management )
21
26
27
+ ## Contents
28
+
29
+ - [ Overview] ( #overview )
30
+ - [ Getting Started] ( #getting-started )
31
+ - [ Group of State Managements] ( #group-of-state-managements )
32
+ - [ State Management Approaches] ( #state-management-approaches )
33
+ - [ setState] ( #setstate )
34
+ - [ inheritedWidget] ( #inherited-widget )
35
+ - [ Provider] ( #provider )
36
+ - [ GetX] ( #getx )
37
+ - [ Bloc/Rx] ( #bloc-rx )
38
+ - [ MobX] ( #mobx )
39
+
22
40
## Getting Started
23
41
42
+ The State Management Example is a simple application with several state
43
+ managements approaches.
44
+
24
45
The application has 3 features:
25
46
26
47
- Some pages with bottom navigation; the Settings page allows us to
@@ -29,14 +50,72 @@ The application has 3 features:
29
50
- Local persistence.
30
51
- Simple remote API calls — GET requests are enough for the showcase.
31
52
32
- In this way, the application does not need to solve any real-world problems, it
33
- aims to demonstrate how some state management approaches work from a technical
34
- point of view.
53
+ In this way, the application does not need to solve any real-world problems; it
54
+ is aimed to demonstrate how some state management approaches work from a
55
+ technical point of view.
35
56
36
57
The UI is created once for all apps, as well as the classes from the data access
37
58
layer (local persistence, remote API calls). The only thing that will change is
38
59
the state management approach.
39
60
61
+ ## Group of State Managements
62
+
63
+ According to [ Dmitrii Slepnev] ( https://github.com/sdim2016/flutter-state-management ) ,
64
+ state management approaches can be roughly categorized within 3 groups:
65
+
66
+ - "** Wrappers** ": implementations on top of the Flutter SDK's built-in classes.
67
+ - ** Redux** : functional programming paradigm.
68
+ - ** Reactive** : based on the reactive programming paradigm; that is, events
69
+ trigger the execution of some code (reaction).
70
+
71
+ ## State Management Approaches
72
+
73
+ ### setState
74
+
75
+ It is also known as local state.
76
+
77
+ This is the low-level approach for ephemeral widget state; that is, the state
78
+ contained in a single Widget; other widgets almost never need to access this
79
+ kind of state.
80
+
81
+ Examples of ephemeral state:
82
+
83
+ - the current page in a PageView.
84
+ - the current value of a counter widget.
85
+ - the progress of a complex animation.
86
+
87
+ ### Inherited Widget
88
+
89
+ [ Inherited Widget] ( https://api.flutter.dev/flutter/widgets/InheritedWidget-class.html )
90
+ is a low-level approach used to communicate between ancestors and children in
91
+ the widget tree. It is used in many other approaches under the hood.
92
+
93
+ ### Provider
94
+
95
+ [ Provider] ( https://pub.dev/packages/provider )
96
+ is the recommended approach by the Flutter's development team.
97
+
98
+ ### GetX
99
+
100
+ [ GetX] ( https://pub.dev/packages/get )
101
+ is a simplified reactive state management solution.
102
+
103
+ ### Bloc Rx
104
+
105
+ [ Bloc] ( https://pub.dev/packages/flutter_bloc )
106
+ is a family of stream/observable based patterns.
107
+
108
+ ### MobX
109
+
110
+ [ Mobx] ( https://pub.dev/packages/mobx )
111
+ is a popular library based on observables and reactions.
112
+
113
+ ### Redux
114
+
115
+ [ Redux] ( https://pub.dev/packages/redux )
116
+ is a state container approach brought to Flutter from the web development world.
117
+
40
118
## References
41
119
42
- [ State Management in Flutter — Dmitrii Slepnev] ( https://www.theseus.fi/handle/10024/355086 ) .
120
+ - [ State Management in Flutter — Dmitrii Slepnev] ( https://www.theseus.fi/handle/10024/355086 ) .
121
+ - [ Flutter's State Management Docs] ( https://docs.flutter.dev/development/data-and-backend/state-mgmt ) .
0 commit comments