How to port a Flutter App to run on the new Librem 5 Phone

If you write a Flutter app for Android or iOS, you are likely not targeting a very widely used platform – desktop! This is especially important as the new Librem Phone is basically a Linux desktop. Let’s go over the setup of testing a Flutter app on Linux and the Librem 5:

First, install the Flutter dev environment (it unzips to 1.5GB, yikes!). When unzipped you should add the following to ~/.bashrc so you have the command available always:

export ENABLE_FLUTTER_DESKTOP=true
export PATH="$PATH:/the/path/to/your/flutter/bin"

Now do the setup instructions as posted here… On Ubuntu I run:

flutter config --enable-linux-desktop
git clone https://github.com/google/flutter-desktop-embedding.git
cd flutter-desktop-embedding/example
flutter packages get
The current Flutter SDK version is 1.9.1+hotfix.4.                      
                                                                        
Because example_flutter requires Flutter SDK version >=1.10.2-pre.54, version solving failed.
Running "flutter pub get" in example...                                 
pub get failed (1)

As you can see here, the beta is the best monthly build of Flutter dev environment. Unfortunately that doesn’t work either and you have to switch to master to build their example Flutter desktop:

flutter channel master
flutter upgrade
flutter packages get
sudo apt install clang 
flutter run

Now when running “flutter run” in the /examples directory it should display the app! The executable file is in the build directory like so:

Now try it on the Librem!: If you have not already, use the emulator download instructions here. With the emulator file in the current directory, you can use this command with the tcp forwarding to be able to ssh to the phone:

sudo qemu-system-x86_64 -boot menu=on -drive file=qemu-x86_64.qcow2,format=qcow2 -vga virtio -m 2G -enable-kvm -net nic,model=virtio  -net user,hostfwd=tcp::2222-:22

When running the phone with the above command, open the terminal phone app within the purism phone emulator and run:

sudo apt install openssh-server -y

Note that the password is always “123456” by default as specified in documentation. This should show the IP you can now send to it. Now you can ssh and copy files back and forth with scp command. For example to copy the “release” directory in the current directory you would run:

scp -r -P 2222 ./release/ purism@localhost:/home/purism/release

on your computer, then within the virtual phone terminal run:

/home/purism/release/flutter_desktop_example

and watch the program run! Unfortunately, in this example the screen width is wider than the phone’s display:

That’s not great, and looking in the source of this particular app we see that it is hardcoded in main.cc:

  flutter::FlutterWindowController flutter_controller(icu_data_path);
  flutter::WindowProperties window_properties = {};
  window_properties.title = "Flutter Desktop Example";
  window_properties.width = 800;
  window_properties.height = 600;

Change that 800 to 300 as the screen on the Librem is 1:2 ratio, build, and copy again, and it should be running better: You can see it’s a real working mobile app now!

I’ve added a bug report to be able to have the standard screen size of the phone work correctly. I’m not sure how to set the width/height to be the device screen dimensions, but it shouldn’t be too hard for someone more savvy with C/Dart languages?

One important thing to note in compiling the Flutter apps, as stated in the documentation: “Be aware that neither the API surface of the Flutter desktop libraries nor the interaction between the flutter tool and the platform directories is stable, and no attempt will be made to provide supported migration paths as things change. You should expect that every time you update Flutter you may have to delete your copies of the platform directories and re-copy them from an updated version of flutter-desktop-embedding.” Let’s hope that they have a more stable build path for all users of Flutter in the future. 🙂