Flutter Mobile, Desktop and Web

Bhavik Vashi
3 min readJan 30, 2020

--

Flutter is used to develop an application for Android, iOS, Windows, Mac, Linux, Google Fuchsia and the web.

Flutter is an open-source UI software development kit created by Google. It is used to develop applications for Android, iOS, Windows, Mac, Linux, Google Fuchsia and the web.

https://youtu.be/_bNt9AZphxM

Single Code Base: — Flutter is an app SDK for building high-performance, high-fidelity apps for iOS, Android, and web (tech preview) from a single codebase. The goal is to enable developers to deliver high-performance apps that feel natural on different platforms. We embrace differences in scrolling behaviours, typography, icons, and more.

Till I have tried Flutter for Android, Web and Windows. Flutter also allows creating an app for iOS and MAC but it requires an iPhone and MAC.

Flutter Octopus

Flutter Octopus(allows to run flutter application up to 7 different platforms simultaneously)

Flutter Application on Android

  • It does not any extra steps to build an Android application.
  • Just run the following command and run your Flutter application on Android.
$ flutter run
Counter Application on Android

Flutter application on Web

  • Flutter for the web is currently available on the beta channel.
  • https://flutter.dev/docs/get-started/web
  • You need to switch to the beta channel from the stable channel.
  • Enable web in the Flutter configuration.
  • Run the following command to switch channels(stable->beta) and enable the web.
$ flutter channel beta
$ flutter upgrade
$ flutter config --enable-web
  • Run the command flutter doctor to ensure that there is no issue.
  • Add web configuration to your Flutter project
  • The following command is used to provide support for the web which creates a web folder under your project folder.
$ flutter create .
  • Run the command to run your application on the web
$ flutter run -d chrome
Counter Application on Web

Flutter application on Windows

  • Flutter application on Windows is currently available on the master channel.
  • https://flutter.dev/desktop
  • You need to switch to the master channel from the stable channel.
  • Enable desktop in the Flutter configuration.
  • Run the following command to switch channels(stable->beta) and enable the web.
$ flutter channel master
$ flutter upgrade
$ flutter config --enable-windows-desktop
//to enable Windows.
$ flutter config --enable-linux-desktop
//to enable Linux.
$ flutter config --enable-macos-desktop
//to enable MAC OS
  • Download Visual Studio and install the following components
  • Desktop development with C++ and make sure to have the following component(newer components may create a problem): 1. MSVC v142 — VS 2019 C++ x64/x86 build tools (v14.24), 2. Windows 10 SDK (10.0.17763.0)
  • Install them
  • Run the command flutter doctor to ensure that there is no issue.
  • Download the zip (click here) and Extract it
  • \flutter-desktop-embedding-master\flutter-desktop-embedding-master\example
  • From this folder copy the windows folder and paste it into your project directory
  • Run the command to run your application on Windows
$ flutter run -d windows

--

--