Download to read offline
Uploaded byICS
Webinar On-Demand: Using Flutter for Embedded
The document discusses a case study on using Flutter for developing automotive interfaces within the Automotive Grade Linux (AGL) framework, highlighting collaboration between Integrated Computer Solutions (ICS) and Toyota. It outlines the features of AGL, its architecture, and the integration of Flutter to create intuitive user interfaces for vehicle applications. Additionally, it covers the technical aspects of the Flutter framework relevant to embedded systems, including its development environment, rendering techniques, and the role of Dart programming language.
More Related Content
Similar to Webinar On-Demand: Using Flutter for Embedded
Webinar On-Demand: Using Flutter for Embedded
- 1. Using Flutter for Embedded Featuringan Automotive Grade Linux (AGL) IVI Case Study June 2024
- 2.
- 3. About ICS Established in1987, Integrated Computer Solutions, Inc. (ICS) delivers innovative software solutions with a full suite of services to accelerate development of successful next-gen products. ICS is headquartered outside Boston in Waltham, Mass. with offices in California, Canada and Europe. Currently 160 people. Boston UX is ICS’ design studio, specializing in intuitive touchscreen and multimodal interfaces for high-impact embedded and connected devices. 3
- 4. About Automotive GradeLinux 4 ● Non-profit organization ● Open source Linux-based collaborative project ● Hosted at Linux Foundation ● Collaborating to build the car of the future through rapid innovation by uniting the automotive and software industries
- 5. 5 About AGL -over 100 member companies Bronze Members - Too many for this slide!
- 6. 6 About The LinuxFoundation - over 900 projects
- 7.
- 8. 8 AGL Distro “UnifiedCode Base”
- 9. AGL Distro “UnifiedCode Base” Two major releases per year Minimum of four updates per release Two years of support for QQ (following Yocto 4.0.x) 9 Release notes and source code can be found at https://wiki.automotivelinux.org/agl-distro/release-notes
- 10. AGL Distro “UnifiedCode Base” 10 One Source Tree Multiple Use Cases
- 11. Automotive Gateway -Beyond IVI and IC 11
- 12. AGL and Flutter Driversdemand similar experience to their phones No single OEM can compete with phone manufacturers AGL provides place for industry collaboration Flutter provides ability to create amazing UI/UX Toyota created Flutter embedded for AGL and we have incorporated it into the UCB since 2022 12
- 13. Find out moreabout AGL Web Page https://www.automotivelinux.org Documentation https://docs.automotivelinux.org Weekly Developer Call every Thursday https://wiki.automotivelinux.org/dev-call-info Developer Community Mail List https://lists.automotivelinux.org/g/agl-dev-community Learn More - Videos from Automotive Linux Summit https://confluence.automotivelinux.org/x/UQAXBg 13
- 14. Automotive Grade Linux2024 Reference IVI UI ● AGL asked ICS to implement this year’s reference UI using Flutter ○ Vehicle Data ■ Eclipse Kuksa.val Broker ○ HVAC controls ■ Kuksa - > CAN ○ Media Player ■ gRPC ● AGL itself is UI agnostic ○ Manufacturers bring their own ○ Previous AGL references in ■ Qt ■ HTML5 ● AGL prefers Open Source solutions ● AGL uses a services based architecture 14
- 15. ● Collaborative onlinedesign tool ● Somewhat Object Oriented ○ Reusable collections ○ UI variants ○ Public API for parsing designs ● Becoming the de facto UX tool ○ Adobe tried to buy them for 20B ○ FTC stopped the deal ● ICS has a Figma importer and code generator called GreenHouse ○ Qt/QML now ○ Flutter soon Designed using Figma 15
- 16. ICS Flutter IVI@ CES 2024 16
- 17. What is Flutter? ●Google Cross Platform Framework ○ 1.0 Released in Dec 2018. ○ 3.19 Released Feb 2024 ● BSD License ○ Free for all including commercial ● Reactive / Declarative UI ○ Conceptually similar to QML ● Self contained rendering ○ Similar to Qt’s philosophy ○ Very easy to brand / stylize ● Dart Programming Language ○ Type / Null Safe ○ AOT and JIT Compilation ○ Hot Reload Dev (Edit / Continue) 17
- 18. Flutter Technology Stack ●Basic foundational classes ○ Painting, Animation, Gestures ● Rendering Layer ○ Dynamic layout of items ○ Efficiently and dynamically updating ● Widgets Layer ○ Composition based approach ○ Each render object has a corresponding class in the widgets layer. ○ Reactive programming ■ State and bindings 18
- 19. Application Runtime ● DartRuntime ○ Where the UI runs. ○ AoT or JIT Compiled ○ AoT is native fast ○ JIT is easily debuggable ■ Quick development! ● Flutter Engine ○ Written in C++ for speed ○ Impeller, Skia, OpenGL ● Flutter Embedder ○ Platform specific glue 19
- 20. Flutter for EmbeddedDevices (Embedder) ● Similar concept to Qt Platform Plugins ● Handle GPU / rendering resources ● Handle native input handling ● Plus richer porting options ○ Win32 / POSIX / iOS / Android / New API is pluggable ○ Native event loop ○ Native thread integration ● Plugins for platforms as too ○ Multimedia ○ Bluetooth ○ 3D Engines 20
- 21. Toyota Connected Embedder ●Wayland IVI Support ○ GLES or Vulkan ● Active open development ○ Apache 2.0 License ● Many supported Flutter plugins! ■ Audio / Video / Camera ■ Google Firebase ■ Filament ■ GLFW ■ Lots more in progress! 21
- 22. Wayland / IVI-Shell ●Drive many screens with discrete input devices ● Compose multi process surfaces ○ Layer many surfaces to appear as on “application” to the user 22
- 23. Declarative / ReactiveUser Interface ● Widget trees are regenerated using build() methods ● Describing the widget constructors and associated data 23
- 24. Dart Language ● CStyle Language ○ Type Safe ○ Null Safe ● Object Oriented ○ Encapsulation (Classes) ○ Abstraction & Polymorphism ○ Composition ● Garbage Collected ● Non-shared heap concurrency ○ Isolates ● Bridges to native languages (FFI) ○ C++, Rust, Swift, Kotlin, JAVA 24
- 25. Recommended Embedded SystemArchitecture ● Flutter on embedded works best with a services based backend ● UI is developed in Dart ● Services are developed in C++, Rust, Python or Other Languages ● In-Process can use Foreign Function Interface 25
- 26. AGL w/ Kuksa.val(VSS) Databroker Architecture ● Kuksa.val - Eclipse project to enable software defined vehicles ○ Implements COVESA VSS ○ Provides bridges to vehicle hardware ● VSS - COVESA Vehicle Signal Specification ○ Tree that includes ~1200 standardized vehicle data points ■ Speed, RPM, etc 26
- 27. Riverpod State Management ●Reactive caching data binding framework ○ Marshalling data to/from a services backend ■ Like Kuksa.val! ○ Supports Dependency Injection ■ For easy testing and simulation ● Enables MVC, MVVM and Clean Architectures. 27
- 28. AGL Architecture ● ServicesBased Architecture ● Hypervisor and containers ● COVESA VSS Standard ○ Vehicle Signaling Schema ○ Eclipse Kuksa.val Broker ● Audio Routing ○ PipeWire ○ Wire Plumber ○ gRPC ● BT / Telephony ○ Bluez / oFono ○ gRPC ● And more! Page # 28
- 29. Flutter Embedded withoutAGL ● ICS is working to diversity use of Toyota’s Flutter Embedder ○ Consumer Devices ○ Industrial Automation ○ Scientific and Medical Devices ● More portability. Less dependencies ○ Standard Wayland ○ KMS / DRM rendering ○ Images for common chipsets ■ And development boards ● Meta-flutter Yocto layer is available ○ Includes classes for including flutter apps 29
- 30.