An Introduction to Flutter Built-in Widgets

Goals

• Know Common Flutter Built-in Widgets
• Can Develop Simple Page using Flutter Built-in Widgets
• Gain Knowledge of Flutter

Pre Requirements

• Know a Programming Language
• Know Some Programming Tools

Plan

• Learn Document of The Widget
• Learn Some Examples
• Exercise
• A Final Exam

Table of Contents

Before get started

• Setup Flutter Development Environment 👉

Content Widgets

• Text 👉
• RichText 👉
• Icon 👉
• Image 👉
• Badge 👉
• Card 👉
• ListTile 👉

Container Widgets

• Container 👉
• Center 👉
• Align 👉
• SizedBox 👉
• DecoratedBox 👉
• LimitedBox

Layout Widgets

• MaterialApp 👉
• Scaffold 👉
• Flex 👉
• Row & Column 👉
• Expanded 👉
• Flow
• Wrap 👉
• Stack 👉
• Constraint 👉
• LayoutBuilder
• BaseLine
• NavigationBar

Actions Widgets

• Buttons👉
• GestureDetector👉
• AlertDialog👉
• SnackBar👉
• Dismissible👉
• InteractiveViewer👉

Scrollable Widgets

• SingleChildScrollView👉
• ListView👉
• AnimatedList👉
• GridView👉
• PageView👉
• CustomScrollView👉
• TabBarView👉
• Scrollable

Form Widgets

• TextField👉
• Form👉
• Radio👉
• CheckBox👉
• Autocomplete👉

MiscWidgets

• FutureBuilder
• InkWell
• ClipRect
• ClipPath

References

• https://docs.flutter.dev/ui/widgets

• Flutter widgets cheat sheet

• https://docs.flutter.dev/ui/widgets/material

• https://book.flutterchina.club/chapter4/flex.html#_4-4-2-expanded=