Okay, we can start.
Hi everyone.
Today I'm here to present Flutter in Embedded System, precisely Linux Embedded.
Quick presentation of me.
I'm André Rikki.
I'm from Italy and I work at Amarulla Solution as Embedded Linux Consultant and Developer.
My background is mostly C++ on both console and UI application using different frameworks and also recently Flutter.
In this talk I'm going to present the Flutter framework from a developer point of view.
So we will not go deeper in how the framework is used in the Embedded and Outworks.
Outintegrate with the most common build systems such as Yokto and Buildroot.
And if there is enough time I'll show a quick video of a commercial product that we developed with one of our customers.
So, what is Flutter?
Flutter is a UI framework developed by Google, was first released in 2015 for Android,
and then was later ported to iOS, Windows, Linux and web application.
The idea behind this framework is to have a single framework and codebase to create a good-looking UI application,
natively complied and multi-platform.
And it uses Dart as programming language and we will talk about that later.
So, let's go through the advantages of Flutter.
First of all, Flutter is fast because it compiles natively for ARM and Intel machine.
You can expect great performance both at startup and at runtime.
Also, the idea was to help the developers to achieve 60 frames per second.
So, you can expect fluid and responsive UI on any kind of devices.
Now, let's talk about Dart.
Dart is the programming language used by Flutter.
Being modern and designed precisely for UI, it comes with multiple advantages and tools that are really helpful when dealing with UI applications.
First of all, is that the language is completely asynchronous, so it's quite impossible to have the application to freeze.
By contrast, for example, with C++, I saw in my experience multiple times where, for example, in the UI loop,
people were opening files or doing some blocking operations and performance were really bad on that.
In this case, it's impossible and the architecture of Dart abstracts the complexity of a multi-threaded typical shell memory multi-threading.
So, this is really, really important in my opinion.
Another important point is that the language is completely no safe, so it's practically impossible to have a segmentation fold in Dart application.
This is another really important point because the UI application is what the final user sees, so it's important to have it always responsive and alive.
Finally, all the error management is handled through exception.
So, even if there are some errors during the execution of the application, simply error exception are thrown.
And even if there are not catch, the application keeps running.
And we will see an example in a future slide.
And all of that in an easy to learn and familiar syntax language.
I came, as I said, from a C++ experience and working with Dart was really, really smooth and really easy to learn.
So, Flutter is fast, Dart is great, but that's not all.
Flutter and the entire framework is also productive.
And with that, I mean that allow development and maintenance of application, which really is.
One of the most important key is Outreload and OutreStart.
Outreload is the ability to apply changes without recompiling and restart the application.
As you can see in the GIF, by simply changing the code from a dark theme to a light theme,
without recompiling, the changes are directly applied in the running application.
This is really important.
We reduce a lot the time of development and maintenance and also the stress on the developer.
Also, being modern, it comes with a set of useful tools such as Stotics Analysis,
Widget Introspection and also debugging and logging and much, much more.
Finally, Flutter Extract is flexible.
As I said, it's meant to work on a multi-platform.
And you can expect the same look and feel of the application on any screen.
This means that from a more commercial point of view,
if you need to deploy application on embedded and also on mobile and Windows,
you can expect the same look and feel.
And this is really important from the final user point of view.
And also, the out-of-time compilation and natively compilation of the code
allow for really fast and great performance on any platform.
All of that in a single programming language, of course.
This is my typical setup.
I use Visual Studio Code with the official Flutter extension
and on the right, it's the running application.
As you can see on the top left, there are the typical running tools
and debugging such as Start, Stop and Step Into, but also the Autrestart.
Autreload is embedded in the Flutter extension.
So if I apply any changes in the code and save the file,
the changes are automatically reloaded in the page.
And in the bottom, there is the Debug console.
As you can see, an exception is thrown because the application tries to save a file when starting.
But even if there are some errors, the application is still running
and works without any problem.
In my opinion, this setup is really important.
It's really easy to use. It's really productive.
And I think that from the developer point of view,
allow the maintenance and development to be really, really easy and less stressful.
I'm happy to see that Flutter is becoming more and more popular in the embedded system,
precisely Linux.
Yesterday I saw a different talk regarding this topic.
And it's important because the community is really active and huge
and it's becoming more popular on Linux.
So if you have any difficulties or if you are facing any problems,
most of the time you will find a solution online.
Then there is a huge list of packages.
There is an online repository where free packages are hosted and developed by the community.
They come in different types.
I use the packages to visualize, for example, a lot of animation or SVG file,
but there are also packages that are more into the code such as MQTT communication or file parsing.
Flutter is actually developed and updated.
In the last year, I had to update the Flutter version both on my laptop and on the target multiple times.
So Google and the community keeps updating the framework and improving security
and adding new features constantly.
Finally, it is used by big tech companies, first of all Google, the creator,
but also BMW and Toyota.
And those companies keep the project alive contributing because Flutter is completely free and open source.
It goes on a BSD3 license so you can use it without any troubles.
Now, let's do a quick comparison with the most famous UI framework for embedded Linux.
First of all, a VGL.
The first point for me is the most important one.
C is not dark.
C is a really powerful language, but when it comes to UI application, it's not so easy to use,
and it's really easy to mess things up.
Instead, Dart is designed to work with, for UI application, and we saw all the advantages that the language come with.
Also, autoload and autrastart, there is no way to achieve that in LVGL.
Of course, you have to rebuild and recompile and redeploy the application every time.
Instead, Flutter has this amazing feature.
Also, it has more platform supported because LVGL can only run on desktop or embedded, and Flutter can also run on mobile.
There are more packages available.
Let's call it, also call it their Libs, as we saw in the previous slide.
And of course, Flutter is a bigger community behind it.
Finally, using Flutter is much, much easier to build the application and publish.
We've seen a later slide, how to integrate the Flutter application inside the Yocto,
and you don't have to mess with the build argument.
It's all handled by the framework and the Yocto project.
Instead, with LVGL, if you need to cross-compile, it can be a bit tricky.
Then, Flutter versus Qt.
C++ and QML versus Dart.
C++ is a step up against C, but still can be quite difficult.
I saw multiple times Qt application having a really bad performer issue because C++ was not optimized.
And QML is designed for UI application like Dart, but first of all, it's an interpreted language.
So if you start doing any kind of logic inside QML, the application will be crap.
And I think that Dart is still much better for UI development.
Here again, autreload and autrestart.
It is possible to achieve autrestart and autreload with QML,
but in my experience, I was never able to do that.
Most of the time, QML is strictly connected to C++ for modeling and such,
so you of course need to recompile everything.
Third point, Flutter, as I said, is completely free and upersoos.
Instead, Qt has commercial licensing.
So if you want to use Qt in a commercial product, you probably end up buying a lot of royalty.
And finally, Flutter, I think that it's rapidly improving.
I mean, Qt is improving too, but the release cycle is much slower compared to Flutter,
so I think that this one is also really important.
So we saw a lot of advantages and good points, but it's not everything is perfect.
So in my experience, one of the, let's say, tricky part of Dart is that when working in embedded Linux,
you can expect coming from C or C++ to be able to do anything you want,
for example, accessing the hardware directly from the U application.
For example, in the product that we showcased later, I added to read proximity sensor input
directly from the U application to simply turn on the display.
This one was not possible because Dart doesn't allow to read directly the hardware
to access directly the hardware.
The structure is a bit complex to use, so long story short, I was not able to do that.
But the solution that is foreign function interface, also known as language bindings.
So what is possible is that we can create a C library with a public interface
and then we can call those methods directly from the Dart application.
This is really important because we can solve a lot of the issue related to more complex stuff from the language
by using a C library.
So start up the application, the library is loaded, and then I can call directly the public function.
By doing so, I was able to solve the issue and read the proximity sensor input from my Dart application.
Now, how to integrate Flutter in your project?
Well, build route, there is the Flutter package developed and maintained by my co-worker Adam Daskat.
It has done a great job on this package and is currently maintaining it.
In my experience, I used Yokto for my project, so I'm a bit more into that.
There is the Metaflutter hosted on GitHub that is the, let's say, official Flutter,
is maintained by some guys from Toyota and the community.
Integrating the Flutter inside your operating system is really, really easy.
Just include the layer, add the dependency in your image, and you are pretty done.
The Flutter engine and Flutter Embedder are automatically compiled and added in your system.
If you need to include, obviously, you will need to include your application.
You can use the Flutter Gallery Recypes as reference, pretty straightforward stuff.
You just copy the Recypes, adapt the repository,
and maybe if you want to adapt some build arguments, and then add as a dependency, and it's done.
You don't need to mess up with any related cross-compiling stuff or any of that.
On GitHub, on my page, I have a repo manifest that I've done almost a year ago, hopefully still working.
For a tinkerboard, simply create the Yocto project and download all the layer needed,
and then add the dependency inside the image.
When you compile, you can simply put the result on SD card,
and you will have the Flutter Gallery on your hardware.
Now I'll show a video of the product that we developed with one of our customers.
The device is an intercom device.
It's running a Rockchip processor, so obviously a bit more powerful than the tinkerboard.
This is the intercom device.
It's able to connect to another device on the other side and have video and audio stream.
Under the hood, there is a lot running, but as you can see, the application is still smooth and responsive,
and the performance is really, really good.
This is a custom keyboard that we developed to achieve the design that the customer wanted,
and those are some lotty animations that are running with the package that I included from the Flutter Dev.
The final result, in my opinion, is really good.
We as developers are really happy with the result.
The customer is happy with the result from the commercial point of view,
so that's why I was presenting Flutter today.
So, if you have any more questions, thank you everyone.
Great.
You mentioned this Dart is a custom language, but there's an MQTT library.
How does it work? Do you have to, for each protocol, implement it in Dart again?
So, Dart is not...
The question is if, for example, MQTT is actually...
There is a custom stuff running under the hood.
Not really, because in reality, Dart can be recompiled as C++.
So, simply, Dart, you can use Dart as you...
It's like you are using C++ code, and MQTT actually didn't really look into it,
because I downloaded the package.
It was working flawlessly, so included on running, and I was really, really happy with the result.
So, yeah.
Thank you for the talk. I'd like to know what is the memory footprint with Flutter Engine, I mean, like Flash and ROM.
Okay, the question is the memory footprint of Flutter Engine.
So, let's say that one of the disadvantages of Flutter is that it's a bit more resource-less hungry compared to Qt or LVGL.
I think that the Flutter Engine was like 14, 15 megabytes on the storage,
and on the memory, I didn't run any kind of profiling on the hardware,
but I think that it's comparable to Qt application when running.
Yeah?
Yachto, do you really need a big operating system underneath,
or is it capable of running on, say, a pre-artore or something like this,
a more lean operating system underneath?
Okay, the question is that if Flutter is able to run in less powerful operating systems such as FiatOS.
Oh, perhaps Bare Metal.
Oh, Bare Metal. I don't think so. I think that at the moment it requires a lean operating system.
Okay, thanks.
I have one more question. You said about integration to a distant project based on Yachto.
So, we just integrate a map of Flutter, and you said we do not have to take care about any cross-compilation.
What was the work? Like, my distant project is compiled by GCC, and Flutter, I read that there is a dependency to C1.
So, the question is how is the end-all the layer, and how is the cross-compilation managed?
So, I think that everything is end-all by Yachto, and the meta-layer, the meta-layer.
The meta-flutter is really well done. You can simply download and add the layer dependency in your Yachto project,
and if you include the dependency in your image of the Flutter engine, it will automatically be compiled,
because Yachto takes manage everything about that, so you don't really need to take care of that.
Hi.
What about Flutter, Yachto, and IRM32?
Sorry?
IRM32, ashtag, too. Have you had any experience?
Actually, the question is if Flutter is capable to run a 32-bit platform.
IRM32?
No.
Simply no.
Do you have any port, any project on Yachto?
No, at the moment, I don't think so.
Yeah, the question is if I know any company that is moving from Qt to Flutter.
The video before explained one of our customers was mainly using Qt for your application, and now is moving to Flutter.
So I think that because of the open-source licensing, this is really tempting from a core-mesh point of view.
Yeah?
It's a bit of a tilt question, so for the current project, did you do the whole project in Flutter and Dart?
Yeah.
Okay.
In your company, do you also have projects where part of the product is made in C++ or something else?
And how do you, would you integrate that with Flutter?
Okay, the question is if the whole project was made in Flutter or if there are also other applications running with C++.
Well, in this case, the UI is run with Flutter, and there are a set of microservices that are running under hood with running C++.
For example, they take care of the video and audio stream and all of that, and the application communicates with those microservices via NQTT, for example.
Okay, I think there's no more questions, so thank you very much.
Thank you.