Skip to main content

The Flutter Widgets

Code on the Rocks depends on two widgets from the core Flutter framework: StatefulWidget and InheritedWidget. This section will explain how these two widgets work and why they were chosen as the backbone of this package.

StatefulWidget​

At the heart of the Flutter UI framework is the concept of state; data that changes over time. A widget can be declared to hold some state by subclassing StatefulWidget. When this widget’s state changes, the widget rebuilds its description, which the framework diffs against the previous description in order to determine the minimal changes needed in the underlying render tree to transition from one state to the next.

In code_on_the_rocks, the ViewModelBuilder is a StatefulWidget and the ViewModel is a State object. This allows the ViewModel to call setState when data changes and the ViewModelBuilder to rebuild the UI.

InheritedWidget​

InheritedWidgets allow you to propagate values down the widget tree. For example, the Theme widget is an inherited widget that propagates the current theme down the tree. When a widget uses Theme.of(context), it is asking for the current theme data that is closest to it in the tree.

In codeon_the_rocks, the ViewModel State object builds an InheritedWidget that propagates the ViewModel down the tree. When a widget uses `ViewModel.of(context), it is asking for the current ViewModel` that is closest to it in the tree.