nabbisen
Posted on May 6, 2021
* The cover image is originally by LMoonlight and edited with great appreciation.
Summary
Flutter is one of the frameworks to develop mobile apps, a popular one. According to their official website:
Flutter is Google’s UI toolkit for building beautiful, natively compiled applications for mobile, web, and desktop from a single codebase.
The new major version, 2, was released on March 3, 2021.
This post shows how I built its development environment in Arch Linux due to the official documentation:
Environment
- OS: Arch Linux
- Mobile apps Framework: Flutter 2
- Programming Language: Dart
- IDE: Android Studio
Tutorial
Install dependencies
Pacman
Install Dart:
$ sudo pacman -Sy dart
/opt/dart-sdk
will be created.
Besides, you may find dart-sdk-dev
in AUR, Arch User Repository, but I installed dart
in galaxy/community repository here.
Optionally, install Kotlin in addition. JDK version will be asked if it is for the first time. It's OK to choose the default:
:: Synchronizing package databases...
system 225.2 KiB 172 KiB/s 00:01 [#################################] 100%
world 1615.2 KiB 1237 KiB/s 00:01 [#################################] 100%
galaxy 1535.9 KiB 4.41 MiB/s 00:00 [#################################] 100%
extra 1620.3 KiB 453 KiB/s 00:04 [#################################] 100%
community 5.5 MiB 786 KiB/s 00:07 [#################################] 100%
resolving dependencies...
:: There are 6 providers available for java-environment>=8:
:: Repository world
1) jdk-openjdk 2) jdk11-openjdk 3) jdk8-openjdk
:: Repository extra
4) jdk-openjdk 5) jdk11-openjdk 6) jdk8-openjdk
Enter a number (default=1):
looking for conflicting packages...
Packages (4) java-environment-common-3-3 jdk-openjdk-15.0.2.u7-1 dart-2.12.2-1 kotlin-1.4.32-1
Total Download Size: 237.99 MiB
Total Installed Size: 618.73 MiB
:: Proceed with installation? [Y/n] y
Also optionally, install android-tools so that you can use adb
aka Android Debug Bridge and so on.
$ sudo pacman -Sy android-tools
For your reference, Arch Linux has a wiki page about Android.
AUR packages
Install the packages from AUR.
Flutter
$ git clone https://aur.archlinux.org/flutter.git
$ cd flutter
$ makepkg -si
$ cd ..
Android SDK
It's nothing to do here because it will be installed for the first configuration in Android Studio later.
Android Studio
$ git clone https://aur.archlinux.org/android-studio.git
$ cd android-studio
$ makepkg -si
$ cd ..
Set permissions for Flutter
Add permission on /opt/flutter
which is created in installing flutter
:
$ sudo gpasswd -a <your-user> flutterusers
Log out and log in again.
Run Flutter doctor
Launch Android Studio. The first configuration will start.
Choose your option on sending analytical data and so on, and click "Next" several times:
And the installation of Android SDK and its platform tools will begin.
It will take time. When the process is finished, quit Android Studio.
Run flutter doctor
with --android-licenses
option to install Android licenses. You will be asked if you accept them:
$ flutter doctor --android-licenses
$ # choose "y", "y", ...
After accepting all of them, run flutter doctor
without any options, which will be successful:
$ flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 2.0.6, on Linux, locale en_US.UTF-8)
[✓] Android toolchain - develop for Android devices (Android SDK version 30.0.3)
[✓] Chrome - develop for the web
[✓] Android Studio
[✓] Connected device (1 available)
• No issues found!
Well, some errors such as "Chrome is not found" which are not fatal will be printed in case. It's up to the env.
Prepare Android Studio
Launch Android Studio again. Select "Plugins" menu:
Install "Flutter" plugin. Here, "Dart" is automatically selected and you will be confirmed to install it together:
After installation of them, click "Restart IDE" button to restart Android Studio.
Then you will find Flutter with Dart in "Installed" Plugins.
Create a project
In Android Studio start menus, you will see "Create New Flutter Project":
Choose "Flutter Application":
"Flutter SDK path" is /opt/flutter
:
Almost done.
Run a demo app
Your project will be generated and then you will see its directory structure as tree view.
lib/main.dart
is the primary file.
Select device, and the emulator will start.
Click the "Run 'main.dart' (Shift+F10)" Button in the menu bar above, which is a green triangle to the right of "Loading Devices...".
Here is you Flutter 2 app in your hand 😃
Besides, you can also create another project with a menu.
Posted on May 6, 2021
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.