Flutter apps on AGL with the Web Application Manager
As native support of flutter into the AGL platform is being considered, there is already a way to run flutter applications on the existing demo platform, and have them using the available application framework.
In this document we will be describing the different components that are in place for both having native applications connecting to the available appFw apis, and to bundle flutter apps and run them as web applications with WAM.
There is an issue in JIRA tracking this work https://jira.automotivelinux.org/browse/SPEC-3876
The requirements for creating a wam widget are having a (zipped) package containing a XML configuration file. After adding a configuration file and creating a .wgt zipped package from flutter's build/web directory, it's possitble to install the application as a widget. The following widget was built using the flutter particle sample code:
Flutter particle sample running as a widget:
Configuration file for the particle sample:
<?xml version="1.0" encoding="UTF-8"?> <widget xmlns="http://www.w3.org/ns/widgets" id="webapps-flutter-particles" version="0.0.0"> <name>FlutterDemo</name> <icon src="icon.svg"/> <content src="index.html" type="text/html"/> <description>HTML5 Mediaplayer demo</description> <author>Igalia, S.L.</author> <license>APL 2.0</license> <feature name="urn:AGL:widget:required-permission"> <param name="urn:AGL:permission::public:no-htdocs" value="required" /> <param name="urn:AGL:permission::public:display" value="required" /> </feature> <feature name="urn:AGL:widget:required-api"> <param name="homescreen" value="ws" /> </feature> </widget
Flutter animations sample:
To access the current appFw apis used by the html5 webaaps, a wrapper needs to be implemented. Dart provides a js interop library that can be used to implemented such wrapper. Here's the current work in progress:
Dart WIP agljs wrapper implementation
https://github.com/rogerzanoni/agljs.dart
Using this library it was possible to implement a sample application that display all the "runnable" applications in a list and activates them using the showWindow call:
Flutter WIP implementation of the agl-demo application launcher
https://github.com/rogerzanoni/agl-flutter-web-listview
As native support of flutter into the AGL platform is being considered, there is already a way to run flutter applications on the existing demo platform, and have them using the available application framework.
In this document we will be describing the different components that are in place for both having native applications connecting to the available appFw apis, and to bundle flutter apps and run them as web applications with WAM.
There is an issue in JIRA tracking this work https://jira.automotivelinux.org/browse/SPEC-3876
The requirements for creating a wam widget are having a (zipped) package containing a XML configuration file. After adding a configuration file and creating a .wgt zipped package from flutter's build/web directory, it's possitble to install the application as a widget. The following widget was built using the flutter particle sample code:
Flutter particle sample running as a widget:
Configuration file for the particle sample:
<?xml version="1.0" encoding="UTF-8"?> <widget xmlns="http://www.w3.org/ns/widgets" id="webapps-flutter-particles" version="0.0.0"> <name>FlutterDemo</name> <icon src="icon.svg"/> <content src="index.html" type="text/html"/> <description>HTML5 Mediaplayer demo</description> <author>Igalia, S.L.</author> <license>APL 2.0</license> <feature name="urn:AGL:widget:required-permission"> <param name="urn:AGL:permission::public:no-htdocs" value="required" /> <param name="urn:AGL:permission::public:display" value="required" /> </feature> <feature name="urn:AGL:widget:required-api"> <param name="homescreen" value="ws" /> </feature> </widget
Flutter animations sample:
To access the current appFw apis used by the html5 webaaps, a wrapper needs to be implemented. Dart provides a js interop library that can be used to implemented such wrapper. Here's the current work in progress:
Dart WIP agljs wrapper implementation
https://github.com/rogerzanoni/agljs.dart
Using this library it was possible to implement a sample application that display all the "runnable" applications in a list and activates them using the showWindow call:
Flutter WIP implementation of the agl-demo application launcher
https://github.com/rogerzanoni/agl-flutter-web-listview
Flutter WIP implementation of the HVAC application