Fluttercon 2023: Making Coffee with Flutter

We may not have realized it yet, but Flutter could become the next big player for UIs on embedded devices.We'll take a dive into running Flutter on embedded Devices. What's currently supported and what custom embedder can we use to achieve this?

1. Fluttercon Berlin 2023 2023 Making Coffee with Flutter MORITZ@SNAPPX.IO Making Coffee with Flutter
2. Fluttercon Berlin 2023 2023 Making Coffee with Flutter MORITZ@SNAPPX.IO Agenda • Intro • The Coffeemachine • Why eFlutter • How to eFlutter 2
3. Fluttercon Berlin 2023 2023 Making Coffee with Flutter MORITZ@SNAPPX.IO Intro 3
4. Fluttercon Berlin 2023 2023 Making Coffee with Flutter MORITZ@SNAPPX.IO Who am I 4
5. Fluttercon Berlin 2023 2023 Making Coffee with Flutter MORITZ@SNAPPX.IO Who am I 5 2015 2023
6. Fluttercon Berlin 2023 2023 Making Coffee with Flutter MORITZ@SNAPPX.IO Where it all began 6
7. Fluttercon Berlin 2023 2023 Making Coffee with Flutter MORITZ@SNAPPX.IO Where it all began 7
8. Fluttercon Berlin 2023 2023 Making Coffee with Flutter MORITZ@SNAPPX.IO Where we are now 8
9. Fluttercon Berlin 2023 2023 Making Coffee with Flutter MORITZ@SNAPPX.IO The Coffeemachine 9
10. Fluttercon Berlin 2023 2023 Making Coffee with Flutter MORITZ@SNAPPX.IO Illy FrancisFrancis X1 • Production: 1995 – today • Aluminium-Boiler • Single-Circuit 10
11. Fluttercon Berlin 2023 2023 Making Coffee with Flutter MORITZ@SNAPPX.IO Coffee-Theory Parameters: • Duration: 20s – 40s • Temperature: 88°C – 96°C • Ratio: 1:1,5 - 1:2,5 • Degree of Roasting • Grinding degree • …. 11
12. Fluttercon Berlin 2023 2023 Making Coffee with Flutter MORITZ@SNAPPX.IO Coffee-Theory 12
13. Fluttercon Berlin 2023 2023 Making Coffee with Flutter MORITZ@SNAPPX.IO Illy FrancisFrancis X1 – Original 13
14. Fluttercon Berlin 2023 2023 Making Coffee with Flutter MORITZ@SNAPPX.IO Illy FrancisFrancis X1 – New 14
15. Fluttercon Berlin 2023 2023 Making Coffee with Flutter MORITZ@SNAPPX.IO Illy FrancisFrancis X1 – New 15
16. Fluttercon Berlin 2023 2023 Making Coffee with Flutter MORITZ@SNAPPX.IO The Software – Pt1 (PID) Requirements: • Temperature Input • Adjustable PID-Controller • Drive a Solid State Relais • Run on ESP8266 16
17. Fluttercon Berlin 2023 2023 Making Coffee with Flutter MORITZ@SNAPPX.IO The Software – Pt1 (PID) Solution: • Temp accuracy up to +/- 0,1°C • Ready for ESP8266 & ESP32 • Ready for several Temp-Sensors • Freely adjustable PID - Parameters • MQTT-Support and ….. 17 github.com/rancilio-pid/clevercoffee/
18. Fluttercon Berlin 2023 2023 Making Coffee with Flutter MORITZ@SNAPPX.IO Illy FrancisFrancis X1 – New v2 18
19. Fluttercon Berlin 2023 2023 Making Coffee with Flutter MORITZ@SNAPPX.IO Illy FrancisFrancis X1 – Future 19
20. Fluttercon Berlin 2023 2023 Making Coffee with Flutter MORITZ@SNAPPX.IO The Software – Pt2 (UI) Requirements: • Display multiple Temperatures on a Chart • Display and adjust multiple Numeric-Values • Connect trough MQTT • (Future) Connect trough D-Bus 20
21. Fluttercon Berlin 2023 2023 Making Coffee with Flutter MORITZ@SNAPPX.IO The Software – Pt2 (UI) Solution: • Uses “flutter_riverpod” for State-Mgmt • Uses “fl_chart” for the Charts • Uses “mqtt_client ” for MQTT-Connection • Will use “dbus ” for D-Bus 21 github.com/Snapp-X/coffeemachine
22. Fluttercon Berlin 2023 2023 Making Coffee with Flutter MORITZ@SNAPPX.IO The Coffeemachine 22
23. Fluttercon Berlin 2023 2023 Making Coffee with Flutter MORITZ@SNAPPX.IO The Coffeemachine 23
24. Fluttercon Berlin 2023 2023 Making Coffee with Flutter MORITZ@SNAPPX.IO Why eFlutter? 24
25. Fluttercon Berlin 2023 2023 Making Coffee with Flutter MORITZ@SNAPPX.IO Why eFlutter? “A lot of UI frameworks available for Linux are desktop oriented, lack (good) support for touch screen control and look like recovered from the 90s.” -Florian Kromer 2021 Medium: “ Flutter could revolutionize UIs on embedded Linux Device" 25
26. Fluttercon Berlin 2023 2023 Making Coffee with Flutter MORITZ@SNAPPX.IO Prominent GUI Frameworks 26 Origin Name Software License Web Chromium BSD 3-Clause WebKit LGPL, BSD Electron MIT License Desktop GTK LGPL v2.1+ Mono MIT, BSD, GPL, … Cross-Platform Qt Commercial License (or GPL/LGPL v3.0) Flutter BSD 3-Clause Games Unreal Engine Commercial License Unity Commercial License
27. Fluttercon Berlin 2023 2023 Making Coffee with Flutter MORITZ@SNAPPX.IO Chromium 27 • HTML5/Javascript • Running a Web UI connected to a Webserver Contra: • Huge source Code • High Resource Footprint • Difficult accessing local files & HW Pro: • Low Cost (Money wise) • Easy to develop
28. Fluttercon Berlin 2023 2023 Making Coffee with Flutter MORITZ@SNAPPX.IO Qt 28 • C++ Framework Launched 1995 • Widely adopted in IoT/Embedded-Industry Contra: • Pronounced „cute“ • Licensing-Model • Developer-Experience Pro: • Industry Standard • Reliability
29. Fluttercon Berlin 2023 2023 Making Coffee with Flutter MORITZ@SNAPPX.IO Why eFlutter? 29
30. Fluttercon Berlin 2023 2023 Making Coffee with Flutter MORITZ@SNAPPX.IO The lack of good alternatvies 30
31. Fluttercon Berlin 2023 2023 Making Coffee with Flutter MORITZ@SNAPPX.IO How to eFlutter? 31
32. Fluttercon Berlin 2023 2023 Making Coffee with Flutter MORITZ@SNAPPX.IO eFlutter Options 32
33. Fluttercon Berlin 2023 2023 Making Coffee with Flutter MORITZ@SNAPPX.IO eLinux – Display Servers 33 VS TL;DR: • X11 works better on Raspberry Pi OS and most others • In Production you will use Wayland! (or directly DRM) X11 Wayland
34. Fluttercon Berlin 2023 2023 Making Coffee with Flutter MORITZ@SNAPPX.IO Flutter-eLinux – Main Difference 34
35. Fluttercon Berlin 2023 2023 Making Coffee with Flutter MORITZ@SNAPPX.IO Flutter-eLinux – Tested Devices 35 github.com/sony/flutter-elinux/wiki/Support-status
36. Fluttercon Berlin 2023 2023 Making Coffee with Flutter MORITZ@SNAPPX.IO Flutter-eLinux • Goal: Merge into the Flutter Engine • arm64/x64 devices support • More lightweight than official Flutter-Linux ◦ Not relying on GTK/GDK • Display Backend Support for ◦ X11 ◦ Wayland ◦ DRM (GBM & EGLStream) • APIs such as MethodChannel and EventChannel are the same • Packages work, Plugins won’t 36
37. Fluttercon Berlin 2023 2023 Making Coffee with Flutter MORITZ@SNAPPX.IO Flutter-eLinux – Step by Step Raspberry Pi (X11) 37
38. Fluttercon Berlin 2023 2023 Making Coffee with Flutter MORITZ@SNAPPX.IO Flutter-eLinux – Step by Step Raspberry Pi 38 Thanks to Payam Zahedi!
39. Fluttercon Berlin 2023 2023 Making Coffee with Flutter MORITZ@SNAPPX.IO Flutter-eLinux – D-Bus 39