📄 Page
1
(This page has no text content)
📄 Page
2
(This page has no text content)
📄 Page
3
Table of Contents Preface Getting Started with Flutter Creating Your First Flutter App Dart: A Language You Already Know Introduction to Widgets Mastering Layout and Taming the Widget Tree Adding Interactivity and Navigation to Your App Basic State Management The Future is Now: Introduction to Asynchronous Programming Data Persistence and Communicating with the Internet Advanced State Management with Streams Using Flutter Packages Adding Animations to Your App Using Firebase Firebase Machine Learning Flutter Web and Desktop Distributing Your Mobile App Other Books You May Enjoy
📄 Page
5
Preface These recipes cover the most important Flutter features that will allow you to develop real-world apps. In each recipe, you will learn about and immediately use some of the tools that make Flutter so successful: widgets, state management, asynchronous programming, connecting to web services, persisting data, creating animations, using Firebase and machine learning, and developing responsive apps that work on different platforms, including desktop and the web. Flutter is a developer-friendly, open source toolkit created by Google that you can use to create applications for Android and iOS mobile devices, the web, and desktop. There are 16 chapters in this book, which you can read independently from one another: each chapter contains recipes that highlight and leverage a single Flutter feature. You can choose to follow the flow of the book or skip to any chapter if you feel confident with the concepts. Flutter uses Dart as a programming language. Chapter 3, Dart: A Language You Already Know, is an introduction to Dart, its syntax, and its patterns, and it gives you the necessary knowledge to be productive when using Dart in Flutter. In later chapters, you’ll see recipes that go beyond basic examples; you will be able to play with code and get hands-on experience in using basic, intermediate, and advanced Flutter tools.
📄 Page
6
Who this book is for This book is for developers who are familiar with an object-oriented programming language. If you understand concepts such as variables, functions, classes, and objects, this book is for you. Prior knowledge of Dart is not required as it is introduced in Chapter 3, Dart: A Language You Already Know. If you already know and use languages such as Java, C#, Swift, Kotlin, and JavaScript, you will find Dart surprisingly easy to learn.
📄 Page
7
What this book covers Chapter 1, Getting Started with Flutter, helps you set up your development environment. Chapter 2, Creating Your First Flutter App, shows how to create your first app, and check that your development environment works as expected. Chapter 3, Dart: A Language You Already Know, introduces Dart, its syntax, and its patterns. Chapter 4, Introduction to Widgets, shows how to build simple user interfaces with Flutter. Chapter 5, Mastering Layout and Taming the Widget Tree, shows how to build more complex screens made of several widgets. Chapter 6, Adding Interactivity and Navigation to Your app, contains several recipes that add interactivity to your apps, including interacting with buttons, reading a text from a TextField, changing the screen, and showing alerts. Chapter 7, Basic State Management, introduces the concept of State in Flutter: instead of having screens that just show widgets, you will learn how to build screens that can keep and manage data. Chapter 8, The Future is Now: Introduction to Asynchronous Programming, contains several examples of one of the most useful and interesting features in programming languages: the concept of the asynchronous execution of tasks. Chapter 9, Data Persistence and Communicating with the Internet, gives you the tools to connect to web services and persist data on your device. Chapter 10, Advanced State Management with Streams, shows how to deal with Streams, which are arguably the best tool for creating reactive apps.
📄 Page
8
Chapter 11, Using Flutter Packages, explains how to choose, use, build, and publish Flutter packages. Chapter 12, Adding Animations to Your app, gives you the tools you need to build engaging animations in your apps. Chapter 13, Using Firebase, shows how to leverage a powerful backend without any code. Chapter 14, Firebase Machine Learning, shows how to add machine learning features to your apps by using Firebase. Chapter 15, Flutter Web and Desktop, shows you how to use the same code base to build apps for the web and desktop. Chapter 16, Distributing Your Mobile app, outlines the steps required to publish an app to the main mobile stores: the Google Play Store and the Apple App Store. To get the most out of this book Some experience in at least one object-oriented programming language is strongly recommended. In order to follow along with the code, you will need a Windows PC, Mac, Linux, or Chrome OS machine connected to the web, with at least 8 GB of RAM and the permissions to install new software. An Android or iOS device is suggested but not necessary as there are simulators/emulators that can run on your machine. All software used in this book is open source or free to use. Chapter 1, Getting Started with Flutter, explains in detail the installation process; however, you should have the following: Software/hardware OS Requirements
📄 Page
9
Recommended editors: Visual Studio Code, Android Studio, or IntelliJ Idea Windows, macOS, or Linux The Flutter SDK Windows, macOS, or Linux An emulator/simulator or an iOS or Android device Windows, macOS, or Linux In order to create apps for iOS, you will need a Mac. If you are using the digital version of this book, we advise you to type the code yourself or access the code via the GitHub repository (a link is available in the next section). Doing so will help you avoid any potential errors related to the copying and pasting of code. If you like this book or want to share your ideas about it, please write a review on your favorite platform. This will help us make this book better, and you’ll also earn the author’s and reviewers’ everlasting gratitude. Download the example code files The code bundle for the book is hosted on GitHub at https://github.com/PacktPublishing/Flutter-Cookbook-Second-Edition/. We also have other code bundles from our rich catalog of books and videos available at https://github.com/PacktPublishing/. Check them out! Download the color images We also provide a PDF file that has color images of the screenshots/diagrams used in this book. You can download it here: https://packt.link/WE615. Conventions used There are a number of text conventions used throughout this book.
📄 Page
10
CodeInText: Indicates code words in text, database table names, folder names, filenames, file extensions, pathnames, dummy URLs, user input, and Twitter handles. For example: “Add the latest version of the lint package as a dev dependency in your pubspec.yaml, and remove any other linting packages you may find there.” A block of code is set as follows: dependencies: flutter: sdk: flutter http: ^0.13.5 When we wish to draw your attention to a particular part of a code block, the relevant lines or items are set in bold: dev_dependencies: flutter_test: sdk: flutter lint: ^2.0.0 Any command-line input or output is written as follows: # cp /usr/src/asterisk-addons/configs/cdr_mysql.conf.sample /etc/asterisk/cdr_mysql.conf Bold: Indicates a new term, an important word, or words that you see on the screen. For instance, words in menus or dialog boxes appear in the text like this. For example: “ In order to use Google Maps, you need to obtain an API key.” Warnings or important notes appear like this. Note Tips and tricks appear like this. Pro Tip
📄 Page
11
Get in touch Feedback from our readers is always welcome. General feedback: Email feedback@packtpub.com and mention the book’s title in the subject of your message. If you have questions about any aspect of this book, please email us at questions@packtpub.com. Errata: Although we have taken every care to ensure the accuracy of our content, mistakes do happen. If you have found a mistake in this book, we would be grateful if you reported this to us. Please visit http://www.packtpub.com/submit-errata, click Submit Errata, and fill in the form. Piracy: If you come across any illegal copies of our works in any form on the internet, we would be grateful if you would provide us with the location address or website name. Please contact us at copyright@packtpub.com with a link to the material. If you are interested in becoming an author: If there is a topic that you have expertise in and you are interested in either writing or contributing to a book, please visit http://authors.packtpub.com. Share your thoughts Once you’ve read Flutter Cookbook, Second Edition, we’d love to hear your thoughts! Please click here to go straight to the Amazon review page for this book and share your feedback. Your review is important to us and the tech community and will help us make sure we’re delivering excellent quality content.
📄 Page
12
Download a free PDF copy of this book Thanks for purchasing this book! Do you like to read on the go but are unable to carry your print books everywhere?Is your eBook purchase not compatible with the device of your choice? Don’t worry, now with every Packt book you get a DRM-free PDF version of that book at no cost. Read anywhere, any place, on any device. Search, copy, and paste code from your favorite technical books directly into your application. The perks don’t stop there, you can get exclusive access to discounts, newsletters, and great free content in your inbox daily Follow these simple steps to get the benefits: 1. Scan the QR code or visit the link below https://packt.link/free-ebook/9781803245430 2. Submit your proof of purchase
📄 Page
13
3. That’s it! We’ll send your free PDF and other benefits to your email directly
📄 Page
14
Getting Started with Flutter Whenever you begin developing with a new platform, the first task you need to perform is creating your development environment. In some ways, the ease with which you can go from nothing to building the first “hello world” app can be seen as a test for how your experience with the new platform is going to be. If the environment is difficult and painful to set up, then it may be very likely that it will be difficult and painful to work with. By the end of this chapter, you will have Flutter fully installed and will be ready to run your first app. In this chapter, we’ll be covering the following topics: Let’s begin by discussing why Flutter may be a great framework to work with. Why Flutter? Technical requirements Installing Flutter: a high-level overview How to use Git to manage the Flutter SDK Setting up the command line and saving path variables Using Flutter doctor to diagnose your environment Configuring the iOS SDK Setting up CocoaPods (iOS only) Configuring the Android SDK setup Which IDE/editor should you choose? Picking the right channel How to choose the platform language for your app
📄 Page
15
Why Flutter? Flutter is an open-source framework to build apps, created by Google. Before investing time and effort in learning a new framework, there is a critical question we need to answer: Is Flutter worth learning and using? While the answer to this question probably depends on your needs and expectations, there are several reasons that make Flutter a great framework to learn and use. Some of them include: There are arguably other points we could add here, but hopefully, you’ll discover several more yourself while reading this book. Technical requirements Flutter requires a 64-bit operating system. In particular: Cross-platform: With Flutter, you can build apps for iOS and Android, web, desktop, and IoT devices with a single code base. Fast development: Flutter includes several features that help speed up your development workflow. Among the most important, it’s worth mentioning hot reload, hot restart, and sound null safety support. User interface: Flutter provides a rich set of widgets to create beautiful, high-performance apps. Open source: Flutter and Dart (the programming language you use in Flutter) are open source and supported by Google. Community: Flutter has a large and active community. This means you can easily find great resources, third-party packages, and help. Performance: Flutter uses a reactive programming model and a high- performance rendering engine, and compiles to native code.
📄 Page
16
Building mobile applications can be a taxing task for your computer. While the minimum hardware requirements to develop a Flutter app are relatively low, your developing experience will be greatly enhanced with the following specs: Let’s see how to install your Flutter development environment next. For Windows, you will need Windows 10 or later (64-bit and x86-64 based), Git for Windows, and PowerShell 5 or newer. For macOS, OS X Yosemite 10.10 or later is required. For Linux and ChromeOS, there is a list of common programs that should be installed in your system before setting up Flutter. More info can be found here: https://docs.flutter.dev/get-started/install/linux (for Linux) and here: https://docs.flutter.dev/get-started/install/chromeos (for ChromeOS). 8 GB of random-access memory (RAM). 16 gigabytes (GB) is preferred, especially when using a virtual device (emulator or simulator). At least 50 GB of available hard drive space. A solid-state drive (SSD) hard drive. At least a 2 gigahertz (GHz) processor. A reliable internet connection. If you want to build for iOS, you will need a Mac. Flutter itself doesn’t have strict hardware requirements, but anything less than this may lead to you spending more time waiting rather than working. Pro Tip
📄 Page
17
Installing Flutter: a high-level overview You can start developing Flutter apps without any installation or configuration. You can quickly create prototypes and simple apps and share your code with fellow developers with an online tool called DartPad, available here: https://dartpad.dev. It is an online open-source tool that runs on any browser. However, if you are serious about programming with Flutter, there will come a time when you need to develop your apps locally and, therefore, will need to configure your system. Configuring your Flutter development environment is rather easy. You can divide the process into three parts: 1. First, you must install the Flutter software development kit (SDK). Currently, you can build Flutter apps from Windows, macOS, Linux, and ChromeOS. 2. Then, depending on your target platform, you have to install a specific platform SDK: Android, iOS, and/or desktop. You can also develop for the web, without installing any specific SDK. Note that: 3. The final stage is choosing which editor, or integrated development environment (IDE), you want to use. To make this process even easier, Flutter has a tool called Flutter Doctor, which will scan your environment and offer you step-by-step guides for Any supported device can build apps for Android and the web. You can build iOS apps only from a Mac. You can only build desktop apps when the origin and target are the same: a Windows app can only be built from a Windows desktop, a macOS app only from a macOS desktop, etc.
📄 Page
18
what you need to do to successfully complete your environment setup. Installing the Flutter SDK Before you can build anything, you need to download the Flutter SDK. On the main Flutter website at https://docs.flutter.dev/get-started/install, you’ll find the prebuilt packages for Windows, macOS, Linux, or ChromeOS—the currently supported platforms to create Flutter apps. Figure 1.1: The Flutter installation page Once you select your operating system, whatever your choice, you will find a section called Get the Flutter SDK. Here, you will find a compressed file (.zip for Windows and macOS, and .tar.gz for Linux and ChromeOS). You should then create a directory for the Flutter SDK, and extract the contents of the compressed file into that directory; for instance, this could be c:\dev\flutter on a Windows machine or ~/development on other platforms. There is another tool, called FVM (Flutter Version Management), that allows managing multiple versions of Flutter SDKs on your development machine. Note
📄 Page
19
How to use Git to manage the Flutter SDK An alternative way to install the Flutter SDK is using Git. Since Flutter is open source and hosted on GitHub, if you clone the main Flutter repository, you’ll already have everything you need. As an added bonus, you can easily change to different versions of the Flutter SDK when needed. The packages that are available to download on Flutter’s website are snapshots from the Git repository. Flutter uses Git internally to manage its versions, channels, and upgrades. Installing Git First, you need to make sure you have Git installed on your computer. Git is installed by default on most Mac and Linux machines. For Windows, you can download and install Git here: https://git-scm.com/download/win. You can also download a Git client to make working with repositories a bit easier. Tools such as Sourcetree (https://www.sourcetreeapp.com) or GitHub Desktop (https://desktop.github.com) can simplify working with Git. They are optional, however, and this book will stick to the command line when referencing Git. If you install it, you can switch between different versions of Flutter, without having to manually download and install each version. This is very useful when you work on projects that require different versions of Flutter. You’ll find FVM here: https://fvm.app/docs/getting_started/installation/.
📄 Page
20
To confirm that Git is installed on Linux and macOS, open your Terminal and type which git. You should see a /usr/bin/git path returned. If you see nothing, then Git is not installed correctly: you may follow the instructions at https://git-scm.com/book/en/v2/Getting-Started-Installing- Git and try to repeat the installation process to solve installation issues. On all platforms, from your Terminal or Command Prompt, you can type the following command: git –version. You’ll then see the current Git version installed in your system. How to do it... Follow these steps to clone and configure the Flutter SDK: 1. First, choose a directory where Flutter is going to be installed. The specific location does not matter, but make sure you have permissions to read, write, and execute in your chosen location. 2. On Windows, you might choose a folder called c:\development\flutter. In this case, in your Command Prompt, type: cd\development\flutter 3. On macOS, to install Flutter in the $HOME directory, from your Terminal, type in the following command: cd $HOME 4. On Linux, you might choose a /flutter directory. In this case, just type: Another common path on macOS is the ~ path; in this case, just type: cd ~