Install Flutter dev environment

The framework for mobile apps dev. Desktop and web too.

Page content

Now I need to update the app on Google Play Store to use new android SDK, so polishing and publishing this old howto I’ve written a couple years ago.

Logical Fallacy Detector app in Google PlayStore page screenshot

A cut from PlayStore App page.

This howto was originally written in Aug 2022, updated and published in Apr 2024. Because of that it can contain some old stuff.

How

Steps to install Flutter to linux pc

Install dev tools

https://docs.flutter.dev/get-started/install/linux/android

Check tools

which bash file mkdir rm which

Install packages

sudo apt-get update -y && sudo apt-get upgrade -y;
sudo apt-get install -y curl git unzip xz-utils zip libglu1-mesa

Install packages for android apps dev

sudo apt-get install \
    libc6:i386 libncurses5:i386 \
    libstdc++6:i386 lib32z1 \
    libbz2-1.0:i386

Install packages for linux app dev

sudo apt-get install \
      clang cmake git \
      ninja-build pkg-config \
      libgtk-3-dev liblzma-dev \
      libstdc++-12-dev

Install VSCode

https://code.visualstudio.com/docs/setup/linux

There is a link avaliable for downloading VSCode debian package for linux: https://go.microsoft.com/fwlink/?LinkID=760868

Then install it like

sudo apt install ./<file>.deb

# If you're on an older Linux distribution, you will need to run this instead:
# sudo dpkg -i <file>.deb
# sudo apt-get install -f # Install dependencies

Othelinux distros are on that page “setup/linux” too.

Install Flutter extensions for VSCode: https://marketplace.visualstudio.com/items?itemName=Dart-Code.flutter

Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.

ext install Dart-Code.flutter

Install Chrome

For webdev - Install Chrome:

https://www.google.com/chrome/dr/download/

Install Adnroid Studio

https://developer.android.com/studio/install#linux

Required libs for ubuntu on 64

sudo apt-get install libc6:i386 libncurses5:i386 libstdc++6:i386 lib32z1 libbz2-1.0:i386

on OS’es based on ubuntu 24.04:

sudo apt-get install libc6:i386 libncurses6:i386 libstdc++6:i386 lib32z1 libbz2-1.0:i386

Download latest version of studio from: https://developer.android.com/studio

cd into “{installation home}/bin” and type:

./studio.sh

xed ~/.bash_profile

export PATH=$PATH:~/Apps/android-studio/bin

Enable KVM accellerated mode

https://developer.android.com/studio/run/emulator-acceleration?utm_source=android-studio#vm-linux

sudo apt-get install cpu-checker
egrep -c '(vmx|svm)' /proc/cpuinfo

An output of 1 or greater means that virtualization is supported. An output of 0 means that your CPU doesn’t support hardware virtualization.

Expected output:

INFO: /dev/kvm exists
KVM acceleration can be used

Install KVM on Linux Use the following command to install KVM:

Cosmic (18.10) or later:

sudo apt-get install qemu-kvm libvirt-daemon-system libvirt-clients bridge-utils

Install Flutter SDK

install sdk https://docs.flutter.dev/get-started/install/linux

https://docs.flutter.dev/get-started/install/linux/android

Can install sdk manually of via VSCode

Manual notes:

download https://storage.googleapis.com/flutter_infra_release/releases/stable/linux/flutter_linux_3.3.2-stable.tar.xz

cd prj

tar xf ~/Downloads/flutter_linux_3.3.2-stable.tar.xz

export PATH=$PATH:~/prj/flutter/bin

which flutter

flutter precache

flutter config --no-analytics

flutter config

VSCode notes:

in vs code command (Ctrl+p)

ext install Dart-Code.flutter

In the Command Palette ((Ctrl+shift+p)), type flutter.

Select Flutter: New Project.

VS Code prompts you to locate the Flutter SDK on your computer.

If you have the Flutter SDK installed, click Locate SDK.

If you do not have the Flutter SDK installed, click Download SDK.

This option sends you the Flutter install page if you have not installed Git as directed in the development tools prerequisites.

When prompted Which Flutter template?, ignore it. Press Esc. You can create a test project after checking your development setup.

After installing into ~/Apps

echo 'export PATH="~/Apps/flutter/bin:$PATH"' >> ~/.bash_profile

source ~/.bash_profile

To disable reporting of telemetry, run this terminal command:

dart --disable-analytics

Install Android Studio

cd into “{installation home}/bin” and type:

./studio.sh

xed ~/.bash_profile

export PATH=$PATH:/home/yourname/Apps/android-studio/bin

https://docs.flutter.dev/get-started/editor

  • Start VS Code.

  • Invoke View > Command Palette….

  • Type “install”, and select Extensions: Install Extensions.

  • Type “flutter” in the extensions search field, select Flutter in the list, and click Install. This also installs the required Dart plugin.

  • Invoke View > Command Palette (Ctrl+Shift+P)

  • Type “doctor”, and select the Flutter: Run Flutter Doctor. (or run flutter doctor in the terminal window)

  • Review the output in the OUTPUT pane for any issues. Make sure to select Flutter from the dropdown in the different Output Options.

Checkup

flutter doctor

[!] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
    ✗ cmdline-tools component is missing
      Run `path/to/sdkmanager --install "cmdline-tools;latest"`
      See https://developer.android.com/studio/command-line for more details.
    ✗ Android license status unknown.
      Run `flutter doctor --android-licenses` to accept the SDK licenses.
      See https://flutter.dev/docs/get-started/install/linux#android-setup for more details.
[✗] Chrome - develop for the web (Cannot find Chrome executable at google-chrome)
    ! Cannot find Chrome. Try setting CHROME_EXECUTABLE to a Chrome executable.
[✓] Linux toolchain - develop for Linux desktop

To install cmdline-tools:

  • Open Android Studio,
  • then SDK (in more),
  • then tick Android SDK cmdline-tools latest,
  • then click Apply

Accept licenses

flutter doctor --android-licenses

If using chromium:

which chrome

export CHROME_EXECUTABLE=/usr/lib/chromium/chrome

Checking Flutter Version and Upgrading it

Flutter version check:

flutter --version

To upgrade flutter version run

flutter upgrade

Create new Flutter project

  • Invoke View > Command Palette (Ctrl+Shift+P).
  • Type “flutter”, and select the Flutter: New Project.
  • Select Application.
  • Create or select the parent directory for the new project folder.
  • Enter a project name, such as my_app, and press Enter.
  • Wait for project creation to complete and the main.dart file to appear.

Debugging in Flutter

ctrl+p

>flutter: select device

Logging

https://docs.flutter.dev/testing/code-debugging#logging

stderr.writeln(‘print me’);

import 'dart:developer' as developer;

void main() {
  developer.log('log me', name: 'my.app.category');

  developer.log('log me 1', name: 'my.other.category');
  developer.log('log me 2', name: 'my.other.category');
}
---
import 'dart:convert';
import 'dart:developer' as developer;

void main() {
  var myCustomObject = MyCustomObject();

  developer.log(
    'log me',
    name: 'my.app.category',
    error: jsonEncode(myCustomObject),
  );
}

Breakpoints

import 'dart:developer';

void someFunction(double offset) { debugger(when: offset > 30.0); // … }

Deploy to the device

create apk for your app and try below commands

clean your project

flutter clean

get packages

flutter pub get

build your apk

flutter build apk --release

find your apk in your machine

your project name\build\app\outputs\flutter-apk(on release mode)

copy this APK and install your mobile device

Sleeping in Dart

In Async Code

  await Future.delayed(Duration(seconds: 1));

In Sync Code

  import 'dart:io';
  sleep(Duration(seconds:1));

Useful packages

https://pub.dev/packages/http

https://pub.dev/packages/flutter_easyloading

https://pub.dev/packages/flutter_spinkit

VSCode Extensions

https://medium.com/codex/my-top-5-flutter-extensions-for-vs-code-f36936518ff8

icons: https://api.flutter.dev/flutter/material/Icons-class.html

all icons: https://fonts.google.com/icons?selected=Material+Icons

==== Fetching data from the internet ====

https://docs.flutter.dev/cookbook/networking/authenticated-requests

Web flutter app

VSCode Live server Plugin

Flutter with the backend