How to Install and Setup Flutter on Ubuntu 18.04.1 LTS (Bionic Beaver)

Flutter13 Comments on How to Install and Setup Flutter on Ubuntu 18.04.1 LTS (Bionic Beaver)

How to Install and Setup Flutter on Ubuntu 18.04.1 LTS (Bionic Beaver)

Flutter, an open-source mobile application development SDK created by Google is getting more attention from developers nowadays. Flutter is used to develop applications for Android and iOS, as well as being the primary method of creating applications for Google Fuchsia (the capability-based operating system currently being developed by Google). Here I am going to explain the steps for installing Flutter on our Ubuntu system.

The installation of Flutter on Ubuntu is explained in Flutter documentation page. But I faced some issues when following it and some of the steps are a little bit confusing. This is the reason behind the making of this tutorial. If you are confident of setting up Flutter with official documentation, just go with the link below. Else follow the steps.

https://flutter.io/setup-linux/



1. Install JDK

Usually, Native Android apps are built in Java. So the Java Development Kit(JDK) is required. JDK can be installed with the below commands.

sudo add-apt-repository ppa:openjdk-r/ppa
sudo apt-get update
 sudo apt-get install openjdk-8-jdk 

2. Install and Set Up Android Studio

2.1 Download Android Studio Bundle

Android studio needs to be installed for working with Flutter development. We can easily download an Android Studio zip file using the official link below.

https://developer.android.com/studio/index.html

In my case, I got the zip file named android-studio-ide-173.4907809-linux.zip

2.2 Unzip the File

Now Unzip the file to /opt directory by running the command.

sudo unzip android-studio-ide-173.4907809-linux.zip -d /opt

2.3 Create a Desktop Icon

Create a new file androidstudio.desktop by running the command:

sudo nano ~/.local/share/applications/androidstudio.desktop

Add the lines by Copy-Paste method.

[Desktop Entry]
Version=1.0
Type=Application
Name=Android Studio
Exec="/opt/android-studio/bin/studio.sh" %f
Icon=/opt/android-studio/bin/studio.png
Categories=Development;IDE;
Terminal=false
StartupNotify=true
StartupWMClass=android-studio

Press Ctrl + O (Write out)
Press Enter
Press Ctrl + x (exit)

2.4 Configure ANDROID_HOME Environment variable

Copy the following lines

export ANDROID_HOME=$HOME/Android/Sdk  export PATH=$PATH:$ANDROID_HOME/tools  export PATH=$PATH:$ANDROID_HOME/platform-tools
sudo nano $HOME/.bash_profile

Paste the copied code on the terminal screen.

Press Ctrl + O (Write out)
Press Enter
Press Ctrl + x (exit)

2.5 Install Flutter Plugin on Android Studio

It’s an optional step to install the Flutter plugin on Android Studio. But it helps us if we are developing our Flutter project from Android Studio. This also installs the Dart plugin which is required for Flutter development. This can be done from Android Studio Welcome Window.

Goto, Configure -> Plugin

Now, Search of Flutter and Install. It requires a restart for Android Studio to activate this plugin.

3. Install and Set Up Flutter SDK

3.1 Download Flutter SDK

First, we have to download Flutter SDK using the link below.

flutter_linux_v0.6.0-beta.tar.xz

3.2 Extract the File

I am assuming that the downloaded file is on the Downloads directory of our system. Now we need to extract this compressed file using the terminal command below

tar xf ~/Downloads/flutter_linux_v0.6.0-beta.tar.xz

3.3 Adding Flutter to Our System’s Path

Now we need to add the Flutter to our system’s path using the below command.

export PATH=`pwd`/flutter/bin:$PATH
 source $HOME/.bash_profile

4. Accept the Licences

We need to accept some Android licenses to start development with Flutter. Just run the below command and accept all the licenses by pressing y.

flutter doctor --android-licenses

5. Update the Path Permanently

We already added the Path variable before. But it only valid for the current terminal window. We have to run the below command to make it permanent.

export PATH=Downloads/flutter/bin:$PATH

6. Creating a New Application

Creating a new application on Flutter can be done with three methods. Using Android Studio plugin, VS code plugin, or using Terminal + Editor method. Here, I am going with the third method(Terminal + Editor).

flutter create awesome_project

7. Choosing the Code Editor

We can choose our own favorite code editor for editing our project. But in my case, I choose the Visual Studio Code(Because it directly supports the Flutter and Flutter plugin).

https://code.visualstudio.com/#alt-downloads

From the above link, we can download the VS code .deb file compatible with Ubuntu/Debian. This deb file can be installed with a double-click on Ubuntu.

8. Direct to Our Project Folder and Start Editing

After installing VS code, direct to our project folder.

cd awesome_project

Open our project using VS code by just typing the below command.

code .

From now onwards, we can use VS code Terminal instead of native Ubuntu Terminal because we can use the Terminal without going out of our code editor.
(Go to View -> Integrated Terminal from VS code’s top menubar)

9. Running the App on Android Device

Now we can run the project on our Android phone.

On our mobile device,

Go to Settings->About

we can see a Build Version menu there. Continuously click the option until it enables the Developer options

Now, return to Settings. We can see the Developer options menu there. Enable it. Also, enable the USB debugging option in it.

Connect our mobile device with our Ubuntu system using the USB port. Type the below command to check whether our mobile device is connected or not.

flutter devices

If it is connected, from the VS studio terminal, run

flutter run

This will install and open the newly created app on our connected Android device.

Image is loadng...

Have a nice code !

Hi, I'm Syamlal, the co-founder of Redmonark. I'm a developer, writer and also have a little bit of experience in graphic designing.
Website https://syam.me

13 thoughts on “How to Install and Setup Flutter on Ubuntu 18.04.1 LTS (Bionic Beaver)

  1. Visual studio code gives me the error flutter not found but in terminal, it detects the flutter.i am on ubuntu 14.04 LTS

  2. While unzipping the file , you used different zip file name ..Its not same as you get and when I am unzipping my zipped file with same name then I m getting cannot find or open the file

    1. On your terminal, type cd ~ and click enter (this will navigate you to the root folder). Now type cd opt and click enter. This will change the current directory to the opt directory.

  3. This does not work at all: sudo unzip android-studio-ide-173.4907809-linux.zip -d /opt. It generates “cannot find or open android-studio-ide-173.4907809-linux.zip, android-studio-ide-173.4907809-linux.zip”

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Back To Top
%d bloggers like this: