Dart Tutorial

Flutter Chapter 2 of 16

Widgets

The building blocks of every Flutter screen: stateless and stateful widgets, the widget lifecycle, text, buttons, images and containers.

Everything you see in a Flutter app is a widget. This chapter explains what widgets are, how the two main kinds differ, and introduces the ones you will use on almost every screen.

Lessons in this chapter

  1. Flutter Widgets Explained: The Widget TreeLearn what a widget is in Flutter, how widgets nest to form a tree, what BuildContext is, and how to compose your own widgets.
  2. StatelessWidget in FlutterLearn how to write a StatelessWidget in Flutter: the build method, constructor parameters, const constructors and when to use one.
  3. StatefulWidget and setState in FlutterLearn StatefulWidget in Flutter: the State class, setState, how rebuilding works, and common mistakes to avoid.
  4. The StatefulWidget Lifecycle in FlutterLearn the lifecycle of a StatefulWidget: initState, didChangeDependencies, build, didUpdateWidget and dispose, with what belongs in each.
  5. Text and TextStyle in FlutterLearn the Text widget in Flutter: styling with TextStyle, theme text styles, alignment, overflow, rich text with TextSpan and selectable text.
  6. Buttons in Flutter: FilledButton, ElevatedButton, TextButton and MoreLearn every Flutter button: FilledButton, ElevatedButton, OutlinedButton, TextButton, IconButton and FloatingActionButton, with styling.
  7. Images and Icons in FlutterShow images in Flutter from assets and the network, control fit and shape, handle loading and errors, and use Material icons.
  8. Container, BoxDecoration and SizedBox in FlutterLearn the Container widget in Flutter: size, padding, margin, colour, borders, rounded corners, shadows and gradients with BoxDecoration.