Flutter – TechnoFob

What is Flutter?

Flutter is Google’s UI toolkit for building beautiful, natively compiled applications for mobile, web, and desktop from a single codebase.

Installing Flutter’s SDK

Downloaded the Flutter SDK (version 1.22.5) to the desired location and extract the file. As an example if the file is downloaded to ~/Documents/develop/flutter_install, run:

cd ~/Documents/develop/flutter_install
unzip ~/Documents/develop/flutter_install/flutter_macos_1.22.5-stable.zip

Update your path. For ZSH, update ~.zshrc

nano ~/.zshrc

export PATH="$PATH:$HOME/Documents/develop/flutter_install/flutter/bin"

To refresh the current window, run:

source ~/.zshrc

or open a new terminal window to automatically source the file.

Verify that the flutter/bin directory is now in your PATH by running:

echo $PATH

Verify that the flutter and dart commands are available by running:

which flutter dart

Link to the Flutter document

Installing Xcode and the iOS SDK

To develop Flutter apps for iOS, you need a Mac with Xcode installed.

Install Xcode from the Apple App store

To prepare to run and test your Flutter app on the iOS simulator, run

open -a Simulator

Installing Android Studio

Flutter relies on a full installation of Android Studio to supply its Android platform dependencies.

Download and install Android Studio.
Start Android Studio, and go through the ‘Android Studio Setup Wizard’. This installs the latest Android SDK, Android SDK Command-line Tools, and Android SDK Build-Tools.
Install the Flutter plugin for Android Studio
- Open plugin preferences (Configure > Plugins)

Select the Fultter plugin and click Install

The Flutter plugin requires the Dart plugin to be installed, click Install

Restart Android Studio when prompted
Run the following command and press y to accept every license.

flutter doctor --android-licenses

Create a Flutter app from template

Create an empty directory for your Flutter apps. As an example

mkdir ~/Documents/develop/flutter
cd ~/Documents/develop/flutter

Use the flutter create command to create a new project:

flutter create calc
cd calc

Ensure that the iOS simulator is up and running

open -a Simulator

Run the app with the following command:

flutter run

Running the code on M1 Macbook Pro

If you encounter the following error message:

[VERBOSE-2:profiler_metrics_ios.mm(184)] Error retrieving thread information: (ipc/send) invalid destination port

Switch to the beta branch, released at the beginning of the month, usually the first Monday. This will include a branch for Dart, the Engine and the Framework.