Canonical enables Linux desktop app support with Flutter

by Canonical on 8 July 2020

By Chris Sells (Google) & Ken VanDine (Canonical)

Google’s goal for Flutter has always been to provide a portable framework for building beautiful UIs that run at native speeds no matter what platform you target. To validate this capability, we started by focusing on the mobile platforms, Android and iOS, where we’ve seen more than 80,000 fast, beautiful Flutter apps published to Google Play.

To build on this success, for more than a year we’ve been expanding our focus to include desktop-class experiences, both for the web and for the desktop OSes: macOS, Windows and Linux. This work includes extensive refactoring of the engine to support desktop-style mouse and keyboard input as well as resizable top-level windows. It also includes new UI capabilities that adapt well to desktop, like Material Density support and the NavigationRail and experiments with deep integration into the underlying desktop OS with experiments in Dart:FFI and access to the system menu bar and standard dialogs. All of this work was to ensure that in addition to being suitable for mobile-style experiences, Flutter is ready to handle full-featured, full-sized desktop apps.

It has long been our vision for Flutter to power platforms. We’ve seen this manifest already at Google with products like the Assistant so now we’re thrilled to see others harnessing Flutter to power more platforms. Today we are happy to jointly announce the availability of the Linux alpha for Flutter alongside Canonical, the publisher of Ubuntu, the world’s most popular desktop Linux distribution.

Why Flutter for Linux?

Last year, when Google announced desktop-class application support with Flutter, Canonical saw an exciting opportunity to make Linux distributions, including Ubuntu, an attractive target platform for Flutter app developers. Flutter’s native cross-platform story is growing rapidly and Canonical wanted to be at the vanguard. By enabling desktop Linux support in Flutter, Canonical is making it very easy for application developers to publish their apps for Linux users via the Snap Store, the app store for Linux. By making Linux a first class Flutter platform, Canonical is inviting application developers to publish their apps to millions of Linux users and broaden the availability of high quality applications available to them.

There were a number of things about Flutter that were exciting for Canonical:

• Fast growing ecosystem of application developers
• Multiple platform support
• Highly optimised native applications
• Modern UI framework supporting declarative, reactive and composable widgets
• Rich development platform using Visual Studio Code, Android Studio and IntelliJ

Google’s initial announcement started with an alpha release supporting macOS and plans for Linux and Windows. Canonical is making a significant investment in Flutter by dedicating a team of developers to work alongside Google’s developers to bring the best Flutter experience to the majority of Linux distributions. Canonical will continue to collaborate with Google to further improve Linux support and maintain feature parity with the other supported platforms.

Flokk: Proving Flutter’s readiness for the desktop

To demonstrate that Flutter was ready for the desktop, we worked with the designers and developers at gskinner.com to create an innovative, beautiful Flutter desktop app. Flokk is a real-world app that works with real-world data, specifically your Google Contacts list.

In addition to being able to manage your contacts, including searching contacts, adding new contacts and editing existing contacts, Flokk also allows you to associate GitHub and Twitter handle information with your contacts.

The display of GitHub and Twitter notifications turns your contacts into your own personal social network. And if you’re not seeing your favorite social networks in Flokk Contacts, then the good news is that Flokk is completely open source, so you can submit a PR to add your favorite.

In addition to innovating in the social space, Flokk uses Flutter features to look and feel great. As just one example, the dark theme not only switches the colors but animates the changes as it does so.

The creative team behind the Flokk Contacts app was led by Grant Skinner, who’s well known for both excellence in design and implementation of innovative user experience. Grant had this to say about working with Flutter on Linux:

“Building the Flokk Contacts app was a breeze! We were able to apply all our previous expertise in Flutter to target Linux with virtually no adjustments, and the app runs fantastically. Working with the Canonical team was a wonderful experience; they were enthusiastic, engaged, and passionate about making Flutter better not just for Linux, but for every platform. It was an amazing project, and I’m thrilled to be able to target another major OS with Flutter.” –Grant Skinner

If you’d like to use the Flokk app on your Linux machine, you can download the latest release on GitHub. Or, if you’re running snapd, you can download the Flokk App from the Snap Store.

Easy install of Flutter on Linux

Now that you’ve seen how well Flutter works for desktop-class applications, especially on Linux, you’re going to want to get it running on your own Linux machine. To make that as simple as possible, we’re pleased to provide the Flutter SDK for Linux as a snap in the Snap Store. The Flutter SDK snap provides everything needed to develop Flutter apps on your favorite Linux distribution. No need to install a bunch of development dependencies; simply install the Flutter SDK snap and your favorite IDE and you have everything you need to create, build and publish your applications for Linux.

For example, if you would like to get started developing Flutter applications for Linux and your IDE of choice is Visual Studio Code, this is all you need to do at your Linux terminal:

$ snap install --classic flutter

$ snap install --classic code

$ code --install-extension dart-code.flutter

If you also want to use Linux to develop mobile apps, you can do so by installing the Android SDK or Android Studio (which includes the Android SDK). For more information on the Flutter SDK as a snap, see https://snapcraft.io/flutter

Flutter for Linux desktop

Once you have the Flutter SDK installed on your Linux machine, to build a desktop app, you need to access the Flutter dev (or the master) channel and to enable Linux desktop support:

$ flutter channel dev

$ flutter upgrade

$ flutter config --enable-linux-desktop

Now when you create a new Flutter project, you’ll get a Linux subdirectory that will enable you to run as a desktop app that runs on your Linux machine:

$ flutter create counter

$ cd counter

$ flutter run -d linux

What you’ll get is a shiny new Linux app built with Flutter running on the latest stable version of GTK+. If you have an existing Flutter project to which you’d like to add Linux support after you have Linux enabled, you can add the Linux subfolder like so:

$ cd my_flutter_app

$ flutter create .

This will create the Linux subfolder with the Runner project that you need to build and run your Flutter app on the Linux desktop.

Accessing native code in Linux from Flutter

In addition to supporting the desktop by writing Dart to create Flutter widgets, your Linux desktop apps can also access all of native Linux using platform channels or the Dart Foreign Function Interface for C/C++. Or, if you’d like to reuse pre-existing code, you can find that code on pub.dev, Dart and Flutter’s package manager site. Most of the packages you’ll find on pub.dev will be pure Dart, most of which will work just fine in your Linux app. Some packages, called plugins, have native code in them that are specific to one or more platforms. As part of this release, we’ve published three plugins on pub.dev that use native functionality of Linux:

• url_launcher: launch the default browser at a URL provided
• shared_preferences: user preferences shared between app sessions
• path_provider: path information about special-purpose folders, e.g. downloads, pictures, etc.

Each of these plugins is available for you to use in your apps as well as examples of how to access Linux natively from your Flutter code, like the Linux implementation of url_launcher.

Deploying to the Snap Store

To deploy your Flutter app to the Snap Store, you’ll first need to install Snapcraft, the tool that you will use to build and publish your application as a snap:

$ sudo snap install snapcraft --classic

To drive the Snapcraft tool, you’ll need to create a snapcraft.yaml file in your app’s project folder. As one example, this is the one for Flokk:

name: flokk-contacts
version: 1.0.0
summary: Flokk Contacts
description: A fresh and modern Google Contacts manager that integrates with GitHub and Twitter.
confinement: strict
base: core18
grade: stable

apps:
   flokk-contacts:
     command: flokk-contacts
     extensions: [flutter-master]
     plugs:
       - network

parts:
  flokk-contacts:
    source: .
    plugin: flutter
    flutter-target: lib/main.dart # The main entry-point file of the application

In the folder with your snapcraft.yaml file, you can now run snapcraft to build a snap of your application.

$ snapcraft

If all goes well, this will produce a file in your current working directory like “flokk-contacts_1.0.0_amd64.snap”

Once you’ve setup your account for publishing in the Snap Store, you’re now ready to publish your snap:

$ snapcraft login

$ snapcraft register flokk-contacts #(registers the snap name in the store, these must be unique)

$ snapcraft upload flokk-contacts_1.0.0_amd64.snap --release edge 

This will upload it to the Snap Store and attempt to publish it to the edge channel. Once your application is published in the edge channel it can be installed either via the Snap Store Desktop client or using the command line:

$ snap install --edge flokk-contacts

For more details on building your first snap and publishing it in the Snap Store, see https://snapcraft.io/first-snap#flutter for a guided tutorial.

Flutter Linux desktop samples

The Flokk Contacts app is an excellent example of a real-world Flutter app targeting the Linux desktop. For a simpler sample, you can check out the Photo Search app, which was also built specifically to show off desktop features.

Photo Search is a simple online photo search app that uses several plugins to access native platform functionality, supporting both macOS and Linux.

For an example of a Linux desktop app with step-by-step instructions, I recommend the Write a Flutter desktop application codelab, which walks you through using OAuth and GraphQL to build a GitHub client in Flutter.

For a more comprehensive app that exercises much more of the surface area of Flutter as well as providing several little applets, then I recommend the Flutter Gallery, which was redesigned last year to support desktop as well as mobile. If you’d like to see that in action, you can check that out on the Snap Store, too.

One more desktop app shows off the fun side of Flutter is a multi-player game built by Thorsten Lorenz called batufo. Set against a beautiful backdrop, it allows players from all over the world to compete against each other in real time.

Thorsten has been building this game to support multiple Flutter platforms including Linux, macOS, Android and iOS. If you’d like to see how he did it and follow along with future updates, he makes his coding sessions available as videos and the code available on GitHub. To install this from Linux, you can pull it down from the Snap Store.

Summary

With this alpha release and the close partnership between Google and Canonical, Linux developers get Flutter support for their operating system of choice. Install the Flutter SDK via snap. Build and test your desktop app on Linux using Visual Studio Code or Android Studio. Deploy your app to the Snap Store. For the latest details, see the desktop page on flutter.dev. And above all else, make sure to provide feedback so that we can continue making Flutter the best it can be on Linux, as we strive to do for every supported Flutter platform.

Flutter for Linux from the Canonical team is a giant step forward for our dream of making Flutter the best way to build an app no matter what platform you’re targeting. Targeting the desktop has made the Flutter engine that much more adaptable to a long tail of devices that Google itself can’t support directly but for which we plan to continue to build partnerships and to enable the ecosystem.

Wherever there are devices that need fast, beautiful apps, that’s where we want Flutter to be.