Unit 01 of 03
Dart and the Component Model
Dart fundamentals and asynchronous Dart, the widget concept, stateless and stateful widgets, the three-tree model, layout widgets and the constraint flow, platform widget families.
Published Updated
Lessons
- 01 Dart Fundamentals A small Dart core that classifies who decides a widget's width. The lesson teaches Dart's types, null safety, and classes through that core and introduces the four sizings: forced, chosen, clamped, stretched. 13 min read
- 02 Asynchronous Dart Two measurements of a widget whose width arrives later. The lesson explains futures, async and await, streams, the event loop, and isolates through the order in which the tree is built. 12 min read
- 03 The Widget Concept In an interface model where everything is a widget, padding is a widget too. The lesson measures that a widget is an immutable recipe and why a card, despite the same request, meets a different owner depending on its position. 10 min read
- 04 Stateless and Stateful Widgets A stateless widget gives its recipe once; a stateful widget carries its own state in a separate object. The lesson measures that the recipe is rebuilt when the state changes and who gives a search box its width after a relayout. 9 min read
- 05 The Three-Tree Model The framework keeps the same interface in three separate trees: the widget tree of recipes, the living element tree, and the render object tree that does the layout. The lesson explains what each tree does and measures why the layout result belongs only to the last tree. 10 min read
- 06 Layout Widgets Column, row, and flexible child are the layout widgets that pass the constraint down. The lesson separates tight and loose flexible children and shows by measurement that being a flexible child does not make the widget inside it stretched. 10 min read
- 07 Platform Widget Families The framework offers separate widget sets for the design languages of two platforms. The lesson measures the difference between the families, the choice by platform, and how the same action button, although it reports a different request in each family, gets the same width in a fixed slot. 9 min read