Flutter in Action

by Eric Windmill

Overview

Summary

In 2017, consumers downloaded 178 billion apps, and analysts predict growth to 258 billion by 2022. Mobile customers are demanding more—and better—apps, and it’s up to developers like you to write them! Flutter, a revolutionary new cross-platform software development kit created by Google, makes it easier than ever to write secure, high-performance native apps for iOS and Android. Flutter apps are blazingly fast because this open source solution compiles your Dart code to platform-specific programs with no JavaScript bridge! Flutter also supports hot reloading to update changes instantly. And thanks to its built-in widgets and rich motion APIs, Flutter’s apps are not just highly responsive, they’re stunning!

Purchase of the print book includes a free eBook in PDF, Kindle, and ePub formats from Manning Publications.

About the technology

With Flutter, you can build mobile applications using a single, feature-rich SDK that includes everything from a rendering engine to a testing environment. Flutter compiles programs written in Google’s intuitive Dart language to platform-specific code so your iOS and Android games, utilities, and shopping platforms all run like native Java or Swift apps.

About the book

Flutter in Action teaches you to build professional-quality mobile applications using the Flutter SDK and the Dart programming language. You’ll begin with a quick tour of Dart essentials and then dive into engaging, well-described techniques for building beautiful user interfaces using Flutter’s huge collection of built-in widgets. The combination of diagrams, code examples, and annotations makes learning a snap. As you go, you’ll appreciate how the author makes easy reading of complex topics like routing, state management, and async programming.

What's inside

    Understanding the Flutter approach to the UI
    All the Dart you need to get started
    Creating custom animations
    Testing and debugging

About the reader

You’ll need basic web or mobile app development skills.

About the author

Eric Windmill is a professional Dart developer and a contributor to open-source Flutter projects. His work is featured on the Flutter Showcase page.

Table of Contents:

PART 1 - MEET FLUTTER

1 ¦ Meet Flutter

2 ¦ A brief intro to Dart

3 ¦ Breaking into Flutter

PART 2 - FLUTTER USER INTERACTION, STYLES, AND ANIMATIONS

4 ¦ Flutter UI: Important widgets, themes, and layout

5 ¦ User interaction: Forms and gestures

6 ¦ Pushing pixels: Flutter animations and using the canvas

PART 3 - STATE MANAGEMENT AND ASYNCHRONOUS DART

7 ¦ Flutter routing in depth

8 ¦ Flutter state management

9 ¦ Async Dart and Flutter and infinite scrolling

PART 4 - BEYOND FOUNDATIONS

10 ¦ Working with data: HTTP, Firestore, and JSON

11 ¦ Testing Flutter apps

Product Details

ISBN-13:	9781638356431
Publisher:	Manning
Publication date:	01/07/2020
Sold by:	SIMON & SCHUSTER
Format:	eBook
Pages:	368
File size:	5 MB

About the Author

Eric Windmill is a professional Dart developer and a contributor to open-source Flutter projects. His work is featured on the Flutter Showcase page.
We interviewed Eric as a part of our Six Questions series. Check it out here.
Eric Windmill is a professional Dart developer, a contributor to open-source Flutter projects, and the author of FlutterByExample.com. His work is featured on Flutter's own showcase page, https://flutter.io/showcase.

Table of Contents

Foreword xv

Preface xvii

Acknowledgments xix

About this book xxi

About the author xxiv

About the cover illustration xxv

Part 1 Meet Flutter 1

1 Meet Flutter 3

1.1 Why does Flutter use Dart? 4

1.2 On Dart 5

1.3 Who uses Flutter? 6

1.4 Who should be using Flutter? 6

Teams, project leads, and CTOs 6

Individual developers 7

Code school students and recent CS grads 7

Open source developers 7

People who value speed 7

People who are lazy 7

People who value control 7

1.5 Who this book is for 8

1.6 Other mobile development options 8

Native development (iOS and Android) 8

Cross-platform JavaScript options 8

1.7 The immediate benefits of Flutter 10

No JavaScript bridge 10

Compile time 10

Write once, test once, deploy everywhere 10

Code sharing 11

Productivity and collaboration 11

Code maintenance 11

The bottom line: Is Flutter for you? 11

1.8 Future benefits of Flutter: Web apps and desktop apps 12

1.9 A brief intro to how Flutter works 12

Everything is a widget 14

Composing UI with widgets 15

Widget types 16

1.10 Flutter rendering: Under the hood 18

Composing the widget tree and layout 20

Compositing step 21

Paint to the screen 22

1.11 Final note 22

2 A brief intro to Dart 24

2.1 Hello, Dart! 25

Anatomy of a Dart program 26

Adding more greetings 26

I/O and Dart libraries 28

2.2 Common programming concepts in Dart 29

Intro to Dart's type system 30

Comments 32

Variables and assignment 33

Operators 34

Null-aware operators 34

2.3 Control flow 36

If and else 37

Switch and case 37

Advanced switch usage 38

Loops 40

2.4 Functions 41

Anatomy of a Dart function 41

Parameters 42

Default parameter values 43

Advanced function concepts 43

Lexical scope 45

2.5 Object-oriented programming (in Dart) 45

Classes 46

Constructors 48

Inheritance 49

Factories and named constructors 50

Enumerators 51

3 Breaking into Flutter 54

3.1 Intro to the counter app 55

Flutter project structure 56

Anatomy of a Flutter app 56

Again, everything is a widget 57

The build method 58

The new and const constructors in Flutter 59

Hot reload 59

3.2 Widgets: The widget tree, widget types, and the State object 60

Stateless widgets 61

Stateful widgets 62

SetState 64

InitState 66

3.3 BuildContext 67

3.4 Enhancing the counter app with the most important widgets 68

RaisedButton 68

3.5 Favor composition in Flutter (over inheritance) 69

What is composition? 69

An example of composition in Flutter 71

3.6 Intro to layout in Flutter 72

Row and Column 72

Layout constraints in Flutter 74

RenderObject 74

RenderObject and constraints 75

Render-Boxes and layout errors 75

Multi-child widgets 76

Icons and the FloatingActionButton 78

Images 80

Container widget 81

3.7 The element tree 83

Elements and widgets 85

Exploring the element tree with an example 86

The element tree and State objects 88

Widget keys 90

3.8 A final note 92

Part 2 Flutter User Interaction, Styles, and Animations 95

4 Flutter UI: Important widgets, themes, and layout 97

4.1 Setting up and configuring a Flutter app 99

Configuration: pubspec.yaml and main.dart 99

SystemChrome 101

4.2 Structural widgets and more configuration 102

MaterialApp widget 102

The Scaffold widget 104

AppBar widget 106

4.3 Styling and themes in Flutter 108

Theme widget 108

MediaQuery and the of method 110

ScreenAwareSize method 111

4.4 Common layout and UI widgets 112

Stack widget 112

Table widget 116

TabBar widget 122

4.5 ListView and builders 126

5 User interaction: Forms and gestures 129

5.1 User interaction and gestures 130

The GestureDetector widget 130

Gesture-Detector in practice 131

The Dismissible widget 134

5.2 Flutter forms 136

The Form widget 137

GlobalKey<FormState> 138

The structure of the AddCityPage form 138

Implementing the form in the weather app 140

5.3 FormField widgets 141

The TextFormField widget 142

The DropdownFormButton widget 143

Generic form fields 146

5.4 Form UI and working with focus nodes 147

InputDecoration 147

Improving the UI with FocusNodes 149

5.5 Managing form state with form methods 151

Form.onChange 152

FormState.save 153

Form.onWillPop 155

6 Pushing pixels: Flutter animations and using the canvas 158

6.1 Introducing Flutter animations 159

Tweens 160

Animation curves 161

Ticker providers 162

AnimationController 162

AnimatedWidget 163

Implementing the animation controller and tween for the background 166

6.2 CustomPainter and the canvas 172

The shapes used to make up the clouds 173

Defining the CustomPainter and the Paint object 173

The CustomPainter paint method 175

6.3 Staggered animations, TweenSequence, and built-in animations 179

Creating a custom animation state class 179

Built-in animation widgets: SlideTransition 182

Building animations for the Clouds widget 184

TweenSequence 185

6.4 Reusable custom color transition widgets 187

Part 3 State Management and Asynchronous Dart 189

7 Flutter routing in depth 191

7.1 Routing in Flutter 192

The Farmers Market app 192

The app source code 193

7.2 Declarative routing and named routes 193

Declaring routes 194

Navigating to named routes 195

MaterialDrawer widget and the full menu 197

Menu items and the appropriate widgets: ListView and Listltems 198

NavigatorObserver: Highlighting the active route with RouteAware 201

7.3 Routing on the fly 204

MaterialRouteBuilder 204

ShowSnackBar, showBottomSheet, and the like 205

7.4 Routing animations 209

8 Flutter state management 212

8.1 Deep dive into StatefulWidgets 213

The widget tree and the element tree 213

The Stateful Widget lifecycle and when to do what 214

8.2 Pure Flutter state management: The InheritedWidget 216

Creating a Central Store wth an InheritedWidget/StatefulWidget team 218

The inheritFromWidgetOfExactType and of methods 218

Use the of method to lift up state 222

State management patterns beyond Flutter 224

8.3 Blocs: Business Logic Components 225

How do blocs work? 227

Implementing the bloc architecture 228

Intro to streams and async Dart 231

Implementing streams in the CartBloc 232

9 Async Dart and Flutter and infinite scrolling 236

9.1 Async Dart 237

Future recap 237

The async/await keywords 239

Catching errors with futures 240

Catching errors with try and catch 241

9.2 Sinks and streams (and Stream Controllers) 242

Anatomy of the observer pattern with Dart streams 243

Implementing streams 243

Broadcasting streams 245

Higher-order streams 247

9.3 Using streams in blocs 250

Blocs use inputs and outputs 250

Implementing a bloc input 253

9.4 Async Flutter: StreamBuilder 254

9.5 Infinite and custom scrollable widgets 255

CustomScrollView and slivers 256

Catalog widget scroll view 256

The SliverGrid widget 260

Delegates 260

Custom slivers 261

Part 4 Beyond Foundations 265

10 Working with data: HTTP, Firestore, and JSON 267

10.1 HTTP and Flutter 268

HTTP package 269

GET requests 269

10.2 JSON serialization 270

Manual serialization 271

Auto-generated JSON serialization 275

Updating the Todo class 275

Bringing it all together in the UI 277

10.3 Working with Firebase in Flutter 281

Installing Firestore 282

Create a Firestore project 283

Configure your app 283

Add Firebase to your pubspec 286

Using Firestore 286

10.4 Dependency injection 288

11 Testing Flutter apps 292

11.1 Tests in Flutter 293

Dart unit tests 293

Using mockito to test methods that need external dependencies 297

Mutter widget tests 300

Mutter integration tests 303

Performance profiling integration tests 307

11.2 Accessibility with the semantics widgets 310

11.3 Next steps with Flutter 311

Appendix A Installation: Dart2 313

Appendix B The Pub package manager 318

Appendix C Flutter for web developers 321

Appendix D Flutter for iOS developers 324

Appendix E Flutter for Android developers 328

Index 331