Your Full Featured, Lightweight Linux Distro, Courtesy of Flutter and FoundriesFactory

Photo of Raul Muñoz

Posted on Jan 30, 2023 by Raul Muñoz

7 min read

Applications Developed for Android can't run on Embedded Linux®!

Well that was the case until Google came up with Flutter. If you've been looking for a nice and easy way to design your user interface, you should investigate Flutter!

In my previous blog, I advised that Android is not the best operating system for IoT and Edge devices. However, the combination of FoundriesFactory® with our Linux microPlatform and Flutter brings a significant cost reduction, while enabling a lightweight and simple solution.

If your project ever requires a lightweight Linux distribution, with Over The Air (OTA) capabilities, device management, security, and a straightforward user interface, Flutter with FoundriesFactory is the right combination.

In this blog, I’m going to guide you through creating your own Factory and I’ll provide the steps needed to customize your Linux microPlatform to include Flutter and Flutter Gallery.

By the end of this tutorial, you will be able to boot the Linux microPlatform on a Raspberry Pi 4 or i.MX8 MINI EVK and then launch the Flutter Gallery.

Going through this tutorial should help you appreciate the beauty of having a light distro with OTA capabilities combined with the efficient design of the Flutter application.

The video below shows exactly what you should expect to see at the end of this tutorial.

Flutter

Before we start, here’s a quick intro to familiarize youself with Flutter. Whether you are looking to migrate your application to something flexible for multiple platforms or are starting development now, Flutter can be a great option!

According to Wikipedia: "Flutter is an open-source UI software development kit created by Google. It is used to develop cross-platform applications for Android, iOS, Linux, macOS, Windows, Google Fuchsia, and the web from a single codebase."

One of the main advantages of Flutter, and also a key reason for why it has become so popular, is that it was developed to be cross-platform. The fact that it works on mobile, web, desktop, and embedded gives companies the possibility to reuse code and keep the same design between these different platforms.

This is not the case when it comes to native Android code. When developing an application using native Android code, you’ll have absolutely no issue accessing all the features a phone has. However, on the downside, the code will only work on Android.

With Flutter, you can design interfaces as slick as native Android but you’ll need to invest a little more effort when accessing the interfaces on each platform that you want to have support your application.

So if we’re comparing native Android development with Flutter, native Android uses something very similar to Java. Meanwhile, Flutter uses DART, a less popular language but not considered to be a big deal for Java/Python developers to get started with.

Hands On

With a Raspberry Pi 4 or i.MX8 MINI EVK in hand, together with a display, you’re ready to start. If you are just interested in testing Flutter, allow me to make your life easy!

Download an image from one of the links below:

The links below will immediately download 400MB

Raspberry Pi 4 Image
lmp-factory-image-raspberrypi4-64-files.tar.gz (419M)
i.MX 8M Mini Evaluation Kit Image
lmp-factory-image-imx8mm-lpddr4-evk-files.tar.gz (423M))

And follow the Foundries.io documentation to flash your device:

Next, go to the section "Testing a Flutter Application" of this blog to start the application after booting the device.

If you want to experience a new way to develop Embedded Linux for IoT and Edge devices, keep following the blog where you will be able to:

  • Customize your own Linux microPlatform
  • Build it in the Cloud with a Complete CI/CD toolset (Continuous Integration with Continuous Delivery and Deployment)
  • Over-the-Air update your Device
  • Manage all devices connected to your Factory

FoundriesFactory

By using the Linux microPlatform, Foundries.io customers are not restricted to the distribution as it is defined and proposed. The distribution and workflow have been developed in a way that allows each customer to add their own customization. The situation is the same for Flutter and the steps that follow will enable you to customize the Linux microPlatform, add Flutter support, and create your own image.

In the next stage, devices installed can receive over-the-air updates as you change your source code and build new images in the cloud.

To get started, the best Flutter implementation for Embedded applications can be found on meta-flutter. This project was initially used by Toyota and AGL (Automotive Grade Linux), but today many companies contribute to and make use of it.

Customizing the Linux microPlatform

To customize your distribution it is important to know a little about The Yocto Project®. The Yocto Project (YP) is an open-source collaboration project that helps developers create custom Linux-based systems regardless of the hardware architecture.

The following steps were based on Linux microPlatform v89 but you can still go ahead if you’re created a Factory in a new version. In case you have any questions, contact the Foundries.io team. You can also request a complementary demo walkthrough.

Assuming that you have already created your Factory and have followed the Getting Started guide, you can now download the ci-scripts repository to configure the xWayland Distribution. This will add the Wayland and Weston packages and with these, you will be able to see a desktop when connecting the board to a display, as well as manage your programs that need a graphical interface.

git clone  https://source.foundries.io/factories/<factoryname>/ci-scripts.git
cd ci-scripts/
gedit factory-config.yml

factory-config.yml

   params:
     IMAGE: lmp-factory-image
     DOCKER_COMPOSE_APP: "1"
+    DISTRO: lmp-xwayland

Add and commit your changes:

git add factory-config.yml
git commit -m "Enabling Distro xWayland"
git push

The next step will add the meta-flutter layer. Start by cloning the lmp-manifest:

git clone -b devel https://source.foundries.io/factories/<factoryname>/lmp-manifest.git
cd lmp-manifest

Create the file meta-flutter.xml:

gedit meta-flutter.xml

+<?xml version="1.0" encoding="UTF-8"?>
+<manifest>
+  <remote fetch="https://github.com/meta-flutter" name="meta-flutter"/>
+  <project name="meta-flutter"   revision="578e464528ee03f9d3c87484239c088bb5a5a686"
+           path="layers/meta-flutter"
+           remote="meta-flutter"/>
+</manifest>

Include it on <factoryname>.xml

gedit <factoryname>.xml

+# Add meta-flutter layer
+BASELAYERS += "${OEROOT}/layers/meta-flutter"

Add the layer as part of your Layers:

gedit conf/bblayers-factory.inc

+BSPLAYERS += " \
+  ${OEROOT}/layers/meta-flutter \
+"

Add and commit your changes with [ci skip] to skip to the build:

git add conf/bblayers-factory.inc meta-flutter.xml <factoryname>.xml
git commit -m "Adding meta-flutter [skip ci]"

Now, just configure some details in the meta-subscriber-overrides and your configuration will be ready.

git clone -b devel https://source.foundries.io/factories/<factoryname>/meta-subscriber-overrides.git/
cd meta-subscriber-overrides/

Add these two lines to lmp-factory-custom.inc:

gedit conf/machine/include/lmp-factory-custom.inc

+DISTRO_FEATURES:remove = "vulkan "
+GLIBC_GENERATE_LOCALES:append = " en_US.UTF-8 es_US.UTF-8 en_GB.UTF-8"
+IMAGE_LINGUAS:append = " en-us en-gb es-us"
+DEFAULT_TIMEZONE = "America/Los_Angeles"

Add the necessary package to run the Flutter example:

gedit recipes-samples/images/lmp-factory-image.bb

+IMAGE_INSTALL:append = "\
+    tzdata-core \
+    tzdata-americas \
+    flutter-auto \
+    flutter-gallery \
+    "

Now add the files and commit to trigger a new build in the CI:

git add recipes-samples/images/lmp-factory-image.bb conf/machine/include/lmp-factory-custom.inc
git commit -m "Adding Flutter config"
git push

Check https://app.foundries.io/factories/<factoryname>/targets/ to follow your build.

FoundriesFactory Targets
FoundriesFactory Targets

Once it is done, follow the documentation to install the image on your device. If you’ve already connected a device to your Factory, it might receive an OTA update with your new image depending on the device and Factory configuration.

Testing a Flutter Application

Once the device boots, run the commands below to start the Gallery, Flutter application:

fio@<machine>:~$ sudo su
Password: fio
root@<machine>:~# export WAYLAND_USER="weston"
root@<machine>:~# export XDG_RUNTIME_DIR="/run/user/63"
root@<machine>:~# ls /run/user/63/
bus  systemd  wayland-1  wayland-1.lock
root@<machine>:~# export WAYLAND_DISPLAY="wayland-1"
root@<machine>:~# flutter-auto --b=/usr/share/flutter/gallery/3.3.10/release/ --w=1920 --h=1024

Watch your screen!

Flutter Gallery
Flutter Gallery

Conclusion

As Flutter is growing in popularity, and allows developers to take advantage design patterns for mobile applications, we’re at a point where it definitely seems worth giving Flutter a try.

In my next blog, I will containerize the Linux microPlatform distribution together with the Flutter Gallery application and give that a try. It is important to remember that FoundriesFactory allows you to customize the Linux microPlatform to add applications such as I described in this tutorial, but also allows customers to run Docker Applications on top of the Linux microPlatform.

Our platform also allows you to leverage other hardware platforms as well. It is possible to rewrite this blog regarding Flutter experiences on many different platforms, when you use FoundriesFactory.

We are here to help, so please open a support ticket if you need some guidance on how to port this project to other HW platforms. Your specific journey will depend on the application you’re working on and what works best for you.

Related posts