Overview
General Overview
A good way to demonstrate the library's functionality without technical details is with this scheme: in the WidgetModel, we determine what to display to the user and manage the business processes running behind the scenes.
Technical Overview
Elementary follows classical MVVM layering, comprising the View, ViewModel, and Model layers. Each layer is represented by a specific entity: ElementaryWidget
for the View layer, WidgetModel
for the ViewModel layer, and ElementaryModel
for the Model layer.
To naturally integrate this chain of entities into the Flutter trees, the following decisions were made:
- An
ElementaryWidget
, like all other widgets, is simply a configuration and an immutable description of a part of the user interface. - An
ElementaryWidget
is a component widget (represented by a ComponentElement), meaning it describes its subtree as a combination of other widgets. - A representation of an
ElementaryWidget
in the Element tree is a special Element calledElementary
. Elementary
creates aWidgetModel
using a factory method fromElementaryWidget
and then stores and manages it.- The lifecycle of the
WidgetModel
is connected to theElementary
lifecycle, as indicated in the previous statement. - A
WidgetModel
depends on anElementaryModel
, stores it, and manages its lifecycle. - When a subtree needs to be described,
Elementary
delegates to thebuild
method ofElementaryWidget
, providing theWidgetModel
. This representsUI=f(State)
in the formsubtree=build(WM)
.
The following diagram illustrates how these components work when an ElementaryWidget is inserted into the tree: