Debugging Flutter Apps | Learn Flutter and Dart to Build iOS and Android Apps

Book Overview & Buying
Table Of Contents

Learn Flutter and Dart to Build iOS and Android Apps - Second Edition

By : Academind by Maximilian Schwarzmüller GmbH

4.3 (4)

Buy this Video

Learn Flutter and Dart to Build iOS and Android Apps

4.3 (4)

By: Academind by Maximilian Schwarzmüller GmbH

Buy this Video

Overview of this book

This Flutter course is an excellent opportunity to discover the power of Flutter and Dart for creating stunning, high-performance mobile apps on both iOS and Android platforms. The course will provide you with detailed setup instructions for both macOS and Windows; a thorough introduction to Flutter, Dart, and the concept behind widgets; and an overview of the built-in widgets along with instructions on how to add your own. It will provide you with a strong understanding of the basics of Flutter and Dart, including how to analyze a new Flutter project, import features from packages, use a first widget, and pass values to functions. Additionally, you will learn how to work with constructor functions. You will also learn debugging tips and tricks, page navigation with tabs, side drawers, and stack-based navigation, state management solutions, handling and validating user input, connecting your Flutter app to backend servers by sending HTTP requests, user authentication, adding Google Maps, using native device features such as the camera, adding beautiful animations and page transitions, image upload, and push notifications. Throughout the course, you will build multiple demo apps that range from simple to more complex. By the end of the course, you will have the skills necessary to build your own iOS and Android apps using Flutter.

Introduction

Welcome to This Course!

What Is Flutter?

Flutter Uses Dart!

One Codebase, Multiple Platforms

Flutter Setup - Overview

Windows Setup

macOS Setup

Project Creation and Setting Up a Code Editor for Flutter Development

Running a First Flutter App

Understanding Material Design

About This Course

Flutter and Dart Basics I - Getting a Solid Foundation (Roll Dice App)

Module Introduction

Analyzing a New Flutter Project

Form Dart to Machine Code

How Programming Languages Work

Starting from Scratch: Understanding Functions

Importing Features from Packages

How Flutter Apps Start

Understanding Widgets

Using a First Widget and Passing Values to Functions

Positional and Named Arguments

Combining Multiple Widgets

Understanding "const" Values

Building More Complex Widget Trees

Understanding Value Types

Configuring Widgets and Understanding Objects

Working with "Configuration Objects" (Non-Widget Objects)

Generics, Lists, and Adding Gradient Colors

How to Configure Widgets and Objects

Practice: Styling Text

Onward to Custom Widgets: Why Do You Need Them?

Understanding Classes

Building Custom Widgets

Working with Constructor Functions

Splitting Code Across Files

Practice: Create a Custom Widget

Introducing Variables

Variables and Types - Combining Two Key Concepts

"final" and "const" - Special Kinds of "Variables"

Instance Variables (Properties) and Configurable Widgets

Practice: Reusable Widgets and Constructor Functions

Displaying Images and Using Multiple Constructor Functions

Adding Buttons and Using Functions As Values

Styling Buttons and Working with Padding

How NOT to Build Interactive Widgets

Introducing Stateful Widgets

Generating Random Numbers

Module Summary

Flutter and Dart Basics II - Fundamentals Deep Dive (Quiz App)

Module Introduction

A Challenge for You!

Challenge Solution 1/2 - Creating a Widget

Challenge Solution 2/2 - Working with More Widgets

Adding Icons to Buttons

Adding Transparency to Widgets

Repetition and Exercise: Adding a Stateful Widget

Rendering Content Conditionally

Accepting and Passing Functions as Values

The "initState" Method

Using Ternary Expressions and Comparison Operators

if Statements and Comparison Operators

Adding a Data Model and Dummy Data

Configuring a Column

Creating a Reusable, Custom Styled Button

Accessing List Elements and Object Properties

Mapping Lists and Using the Spread Operator

Alignment, Margin, and Padding

Mutating Values in Memory

Managing the Questions Index as State

More on Button Styling

Using Third-Party Packages and Adding Google Fonts

Passing Data Through Functions Across Widgets

More Conditions

Getting Started with the Results Screen

Passing Data to the Results Screen

Introducing Maps and "for" Loops

Accessing Map Values and Using "Type Casting"

Combining Columns and Rows

Expanded to the Rescue!

Filtering and Analyzing Lists

Making Content Scrollable with SingleChildScrollView

Flutter and Dart Basics - Coding Challenge

Flutter and Dart Basics - Solution

Beyond the Basics: Optional, Important Dart Features

Module Summary

Debugging Flutter Apps

Module Introduction

The Starting Project and a Problem

Understanding Error Messages

Debugging Apps and Using "Debug Mode"

Working with the Flutter DevTools

Adding Interactivity, More Widgets, and Theming (Expense Tracker App)

Module Introduction

Starting Setup and Repetition Time!

Adding an Expense Data Model with a Unique ID and Exploring Initializer Lists

Introducing Enums

Creating Dummy Data

Efficiently Rendering Long Lists with ListView

Using Lists Inside of Lists

Creating a Custom List Item with the Card and Spacer Widgets

Using Icons and Formatting Dates

Setting an AppBar with a Title and Actions

Adding a Modal Sheet and Understanding Context

Handling User (Text) Input with the TextField Widget

Getting User Input on Every Keystroke

Letting Flutter do the Work with TextEditingController

Time to Practice: Adding a New Input

Exercise Solution

Closing the Modal Manually

Showing a Date Picker

Working with "Futures" for Handling Data from the Future

Adding a Dropdown Button

Combining Conditions with AND and OR Operators

Validating User Input and Showing an Error Dialog

Saving New Expenses

Creating a Fullscreen Modal

Using the Dismissible Widget for Dismissing List Items

Showing and Managing "Snackbars"

Getting Started with Theming

Setting and Using a Color Scheme

Setting Text Themes

Using Theme Data in Widgets

Adding Dark Mode

Using Another Kind of Loop (for-in)

Adding Alternative Constructor Functions and Filtering Lists

Adding Chart Widgets

Module Summary

Building Responsive and Adaptive User Interfaces (Expense Tracker App)

Module Introduction

What Is "Responsiveness"?

Locking the Device Orientation

Updating the UI Based on the Available Space

Understanding Size Constraints

Handling to Screen Overlays Like the Soft Keyboard

Understanding "Safe Areas"

Using the LayoutBuilder Widget

Building Adaptive Widgets

Module Summary

Flutter and Dart Internals (Todo App)

Module Introduction

Three Trees: Widget Tree, Element Tree, and Render Tree

How the UI Is Updated

Refactor and Extract Widgets to Avoid Unnecessary Builds

Understanding Keys - Setup

Which Problem Do Keys Solve?

Understanding and Using Keys

Mutating Values in Memory and Making Sense of var, final, and const

Module Summary

Building Multi-Screen Apps and Navigating Between Screens (Meals App)

Module Introduction

Project Setup

Using a GridView

Widgets Versus Screens

Displaying Category Items on a Screen

Making Any Widget Tappable with Inkwell

Adding Meals Data

Loading Meals Data into a Screen

Adding Cross-Screen Navigation

Passing Data to the Target Screen

Introducing the Stack Widget

Improving the MealItem Widget

Adding Navigation to the MealDetails Screen

Improving the MealDetails Screen

Adding Tab-Based Navigation

Passing Functions Through Multiple Layers of Widgets (For State Management)

Managing App-Wide State and Data

Adding a Side Drawer

Closing the Drawer Manually

Adding a Filter Item

Replacing Screens (Instead of Pushing)

Adding More Filter Options

Returning Data When Leaving a Screen

Reading and Using Returned Data

Applying Filters

Module Summary

Managing App-Wide State (Meals App)

Module Introduction

What's the Problem?

Installing the Solution: Riverpod

How State Management with Riverpod Works

Creating a Provider

Using a Provider

Creating a More Complex Provider with StateNotifier

Using the FavoritesProvider

Triggering a Notifier Method

Getting Started with Another Provider

Combining Local and Provider-Managed State

Outsourcing State into the Provider

Connecting Multiple Providers with Each Other (Dependent Providers)

Swapping the "Favorite Button" Based on Provider State

Module Summary

Adding Animations (Meals App)

Module Introduction

Setup and Understanding Explicit Versus Implicit Animations

Explicit Animations: Adding an Animation Controller

Explicit Animations: Playing the Animation with AnimatedBuilder

Finetuning Explicit Animations

Getting Started with Implicit Animations

Configuring Implicit Animations

Adding Multi-Screen Transitions

Module Summary

Handling User Input and Working with Forms (Shopping List App)

Module Introduction

Setup and a Challenge for You

Challenge Solution 1 - Building and Using Models

Challenge Solution 2 - Building the List UI

Adding a "New Item" Screen

The Form and TextFormField Widgets

A Form-Aware Dropdown Button

Adding Buttons to a Form

Adding Validation Logic

Getting Form Access Through a Global Key

Extracting Entered Values

Passing Data Between Screens

Final Challenge Solution

Module Summary

Connecting a Backend and Sending HTTP Requests (Shopping List App)

Module Introduction

What's a Backend? And Why Would You Want One?

What Is HTTP and How Does It Work?

Setting Up a Dummy Backend (Firebase)

Adding the HTTP Package

Sending a POST Request to the Backend

Working with the Request and Waiting for the Response

Fetching and Transforming Data

Avoiding Unnecessary Requests

Managing the Loading State

Error Response Handling

Sending DELETE Requests

Handling the "No Data" Case

Better Error Handling

Module Summary

Using the FutureBuilder Widget

Using Native Device Features (For Example, Camera) (Favorite Places App)

Module Introduction

Setup and a Challenge for You!

Adding a Place Model (Challenge Solution 1/6)

Adding a "Places" Screen (Challenge Solution 2/6)

Adding an "Add Place" Screen (Challenge Solution 3/6)

Adding "riverpod" and a Provider (Challenge Solution 4/6)

Adding Places with Provider and Displaying Places (Challenge Solution 5/6)

Adding a "Place Details" Screen (Challenge Solution 6/6)

Adding a "Pick an Image" Input

Installing the "Image Picker" Package

Using the Device Camera for Taking Pictures

Adding the Picked Image to the Model and "Add Place" Form

Previewing the Picked Image

Adding the "location" Package and Starting with the "Get Location" Input Widget

Getting the User's Current Location

Using the Google Maps API â€“ Setup

Using Google's Geocoding API

Storing the Location Data in the Model

Displaying a Location Preview Map Snapshot Through Google

Using the Picked Location in the Form

Outputting the Location Data

Installing and Configuring the Google Maps Package

Adding a "Map" Screen

Displaying the Picked Place on a Dynamic Map

Handling Map Taps for Selecting a Location Manually

Using the Map Screen in the "Add Place" Form

Installing Packages for Local (On-Device) Data Storage

Storing the Picked Image Locally

Storing Place Data in a (On-Device) SQL Database

Loading Data from the SQL Database

Using a FutureBuilder for Loading Data

Module Summary

Push Notifications and More: Building a Chat App with Flutter and Firebase

Module Introduction

App and Firebase Setup

Adding an Authentication Screen

Adding Buttons and Modes to the Authentication Screen

Validating User Input

Firebase CLI and SDK Setup 1/2

Firebase CLI and SDK Setup 2/2

Signing Users Up

Logging Users In

Showing Different Screens Based on the Authentication State

Adding a Splash Screen (Loading Screen)

Adding User Logout

Image Upload: Setup and First Steps

Adding a User Image Picker Widget

Using the ImagePicker Package

Managing the Selected Image in the Authentication Form

Uploading Images to Firebase

Showing a Loading Spinner Whilst Uploading

Adding a Remote Database: Firestore Setup

Sending Data to Firestore

Storing a Username

Adding ChatMessages and Input Widgets

Sending and Reading Data to and from Firestore

Loading and Displaying Chat Messages as a Stream

Styling Chat Message Bubbles

Push Notifications - Setup and First Steps

Requesting Permissions and Getting an Address Token

Testing Push Notifications

Working with Notification Topics

Sending Push Notifications Automatically Through Cloud Functions

Module Summary

Next Steps and Roundup

Course Roundup

Learn Flutter and Dart to Build iOS and Android Apps - Second Edition

By : Academind by Maximilian Schwarzmüller GmbH

Learn Flutter and Dart to Build iOS and Android Apps

By: Academind by Maximilian Schwarzmüller GmbH

Overview of this book

Confirmation

Buy this book with your credits?

Submit Your Feedback

Create a Free Account To Continue Reading

Sign in to activate your 7-day free access