Chapter 5. User interaction: Forms and gestures

This chapter is about letting users interact with your Flutter app. At the end of the day, all applications have one important job: to make it easy for a human to interact with data. And one side of that interaction is allowing users not only to look at data, but also to add to it and change it. This chapter is about that: letting users add and change data in your app. Specifically, this covers two different kinds of interactions: gestures and forms.

5.1. User interaction and gestures

Gestures are any kind of interaction event: taps, drags, pans, and more. First I’ll cover how you detect and respond to these user gestures. To be honest, though, there isn’t much involved here. Flutter has a convenience widget that allows you to add gesture detectors to any location of the widget tree that you’d like.

Without knowing it, perhaps, you’ve already used gestures. All the button widgets that have onPressed and onTap are just convenient wrappers around gesture detectors. Gesture detectors are used in a similar way.

5.1.1. The GestureDetector widget

5.1.2. GestureDetector in practice

5.1.3. The Dismissible widget

5.2. Flutter forms

5.2.1. The Form widget

5.2.2. GlobalKey<FormState>

5.2.3. The structure of the AddCityPage form

5.2.4. Implementing the form in the weather app

5.3. FormField widgets

5.3.1. The TextFormField widget

5.3.2. The DropdownFormButton widget

5.3.3. Generic form fields

5.4. Form UI and working with focus nodes

5.4.1. InputDecoration

5.4.2. Improving the UI with FocusNodes

5.5. Managing form state with form methods

5.5.1. Form.onChange

5.5.2. FormState.save

5.5.3. Form.onWillPop

Summary