• ...
  • SDK
  • Yocto
  • ...
  • ...
  • your first application
  • tools
  • ...

Getting started with Flutter#

Not available for sm2s-imx93

Due to the limited performance of the GPU of the SOM, flutter can not be used with the sm2s-imx93.

We suggest to go with Getting started with Qt

Before you start#

Before we can use the SimpleSwitch™ SDK for Flutter we need to download the SDK extension. For this you need to run from the sourced SimpleSwitch™ SDK

GITHUB_TOKEN="<your personal access token for Github>" GITHUB_USERNAME="<your Github username>" simpleswitch-sdk-tool install flutter
eval "$(simpleswitch-sdk-tool activate)"

Github personal access token

To create a Github personal access token see Github container registry (GHCR)

Example Flutter Project#

To create an example project, you may use from the sourced SDK (see Source the SDK)

flutter create myapp

myapp can be replaced by the name of your application.

Build the Flutter project using CLI#

In order to build and deploy using Flutter, you will need to add a Flutter custom device.

Adding a Flutter custom device#

A custom device can be added using the command flutter-add-simpleswitch-device coming with the SimpleSwitch™ SDK

flutter-add-simpleswitch-device <device_id> <target_ip>

Building and Running on custom device#

Using flutter command, you will be able to build and deploy the application with a single command

flutter run -d <device_id>

Where <device_id> is the id you specified for your custom device in Flutter configuration file.

If you want to build a package without deploying, please refer to Using an external tool section below.

Managing Flutter custom devices#

You can list existing custom devices

flutter custom-devices list

You can delete a specific custom device

flutter custom-devices delete -d <device_id>

To modify the configuration of an existing custom device, you can directly modify the custom devices configuration file in ${XDG_CONFIG_HOME}/.config/flutter/custom_devices.json. This can be useful to tweak the startup command, modify the install process, etc.

Using an external tool with Flutter#

You can also build from command line using flutter utility

flutter-create-bundle

You can then use the --copy-dir option of the simpleswitch-generate-package the Generate a SimpleSwitch™ package

simpleswitch-generate-package --name simpleswitch-example --copy-dir build:/usr/share/simpleswitch-example \
   --template flutter --startup-command '/usr/bin/flutter-runner simpleswitch-example -f'

For a different than the release profile try

flutter-create-bundle --debug
simpleswitch-generate-package --name simpleswitch-example --copy-dir build:/usr/share/simpleswitch-example \
   --template flutter --startup-command 'FLUTTER_MODE=debug /usr/bin/flutter-runner simpleswitch-example -f'

respectively

flutter-create-bundle --profile
simpleswitch-generate-package --name simpleswitch-example --copy-dir build:/usr/share/simpleswitch-example \
    --template flutter --startup-command 'FLUTTER_MODE=profile /usr/bin/flutter-runner simpleswitch-example -f'

Debugging running Flutter application#

Before debugging a running application, you must get the observatory URI, exposed by Flutter on startup. This can be done using following command

ssh root@<target_ip> journalctl -u simpleswitch-app@simpleswitch-example.service | grep 'Observatory listening on'

Optionally, you can start the Flutter devtools, allowing to debug the running code

flutter pub global run devtools

Then, in your Flutter application source directory, you can then use a Flutter attach command

flutter pub get
flutter attach -d custom-devices --debug-url <observatory URI>
Now you can interact as with an application running locally:

  • Modify the sources and use Hot reload with the r key.

  • If you started the devtools, use the live debugger. It’s URL should be printed in the console: The Flutter DevTools debugger and profiler on imx8 is available at:.

Further reading#

See also