Book Image

Cross-Platform UIs with Flutter

By : Ryan Edge, Alberto Miola
Book Image

Cross-Platform UIs with Flutter

By: Ryan Edge, Alberto Miola

Overview of this book

Flutter is a UI toolkit for building beautiful, natively compiled applications for mobile, web, desktop, and embedded devices from a single code base. With Flutter, you can write your code once and run it anywhere using a single code base to target multiple platforms. This book is a comprehensive, project-based guide for new and emerging Flutter developers that will help empower you to build bulletproof applications. Once you start reading book, you’ll quickly realize what sets Flutter apart from its competition and establish some of the fundamentals of the toolkit. As you work on various project applications, you’ll understand just how easy Flutter is to use for building stunning UIs. This book covers navigation strategies, state management, advanced animation handling, and the two main UI design styles: Material and Cupertino. It’ll help you extend your knowledge with good code practices, UI testing strategies, and CI setup to constantly keep your repository’s quality at the highest level possible. By the end of this book, you'll feel confident in your ability to transfer the lessons from the example projects and build your own Flutter applications for any platform you wish.
Table of Contents (12 chapters)

Building a platform-specific UI

In a Flutter application, there are two primary ways to access the platform that the application is running on: statically (using platform flags) or dynamically (using the TargetPlatform object from BuildContext). The platform can be detected statically using the list of platform flags provided by the Flutter framework, as detailed here:

  • isLinux
  • isMacOS
  • isWindows
  • isAndroid
  • isIOS
  • isFuschia

Each name implies the platform in which the application is executing. The tradeoff of using these flags is that they cannot be used to dynamically switch the styles for a platform. To do so, we turn to TargetPlatform defined on context. Before we dive into using MaterialApp to build our Settings application, let’s demonstrate how to access the platform dynamically.

We can access the target platform information directly from BuildContext by using Theme.of(context).platform. Open the app.dart file and add the following code...