DEV Community

loading...
Cover image for Let docker flutter for you

Let docker flutter for you

matsp profile image Mats Pfeiffer Updated on ・2 min read

After installing the Flutter and Android SDK several times on different machines I always ended up with a broken setup where some part of the puzzle was not working anymore.

I decided to improve this situation but wanted no limitations compared to a local installation. So the image must be able to execute Flutter in my current host directory, start an emulator and hot reload the app and let me test Flutter for Web.

This is what I've come up with:

GitHub logo matsp / docker-flutter

flutter docker image with full android sdk

and support the following features:

  • Use Flutter commandline tool
  • Start an emulator and hot reload the app on it (with hardware accerlation)
  • Serve Flutter app as Web app

On my machines I setup some aliases to transparently map a docker run command. Executing Flutter in the image feels just as executing it locally.

For me the best feature is a predictable behavior on all my machines with no traces. With two commands you will have the flutter example app up and running.

docker run --rm -e UID=$(id -u) -e GID=$(id -g) --workdir /project -v "$PWD":/project matspfeiffer/flutter create .

xhost local:$USER && docker run --rm -ti -e UID=$(id -u) -e GID=$(id -g) -p 42000:42000 --workdir /project --device /dev/kvm --device /dev/dri:/dev/dri -v /tmp/.X11-unix:/tmp/.X11-unix -e DISPLAY -v "$PWD":/project --entrypoint flutter-android-emulator  matspfeiffer/flutter

I agree - the commands are not looking very friendly - but mapped with an alias it's just like:

flutter create .
flutter-start-emulator

Emulator run in docker

I am using Linux as my operating system which could mean that there are bugs for MacOS and Windows. Especially forwarding the X system and qemu accerlation could be an interesting task under Windows and MacOS. I already read that it is possible but I could need help with testing it. A

If your are interested feel free to test the image and issue bugs. I would really appreciate any support to make this image usable for everyone who want's to start with Flutter.

So hopefully we hear again in the comments or at Github!

UPDATE:

Checkout the README to read about solutions for Windows and MacOS users as well!

Discussion (11)

pic
Editor guide
Collapse
makarsky profile image
Igor Makarsky

The following command
xhost local:$USER && docker run --rm -ti -e UID=$(id -u) -e GID=$(id -g) -p 42000:42000 --workdir /project --device /dev/kvm --device /dev/dri:/dev/dri -v /tmp/.X11-unix:/tmp/.X11-unix -e DISPLAY -v "$PWD":/project --entrypoint flutter-android-emulator matspfeiffer/flutter
results in this output:

non-network local connections being added to access control list
The Android emulator exited with code 1 during startup
Android emulator stderr:
Address these issues and try again.
No devices found with name or id matching 'emulator-5554'

flutter doctor shows some issues:

[!] Android Studio (not installed)
[!] Connected device
! No devices available

Collapse
matsp profile image
Mats Pfeiffer Author

Are you really using the latest image? Try to remove the image locally and rerun the command. Normally the emulator created by the Flutter CLI is named "flutter_emulator".

Collapse
matsp profile image
Mats Pfeiffer Author

When you use VSCode try the remote extensions to run your project in a container. That's a huge improvement. You will find the instructions on my GitHub repository.

Thread Thread
makarsky profile image
Igor Makarsky

I tried with both :latest and :beta.
Here is "flutter doctor" output for :beta image:
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel beta, 1.19.0-4.3.pre, on Linux, locale en_US)
[✓] Android toolchain - develop for Android devices (Android SDK version 28.0.3)
[✗] Chrome - develop for the web (Cannot find Chrome executable at google-chrome)
! Cannot find Chrome. Try setting CHROME_EXECUTABLE to a Chrome executable.
[!] Android Studio (not installed)
[✓] Connected device (1 available)

Do I need to install Android Studio on my host?

Thread Thread
matsp profile image
Mats Pfeiffer Author

Now your output is showing a connected device.

To show all emulators execute "flutter emulators".

To launch it "flutter emulators --launch flutter_emulator".

I actually found the issue you have and will push the fix in a few minutes. It comes from an incomplete refactoring.. Afterwards the right emulator will launch ;-)

Thread Thread
makarsky profile image
Igor Makarsky

I get the following message

The Android emulator exited with code 1 during startup
Android emulator stderr:
Address these issues and try again.

when I run

flutter emulators --launch flutter_emulator
Thread Thread
matsp profile image
Mats Pfeiffer Author

You can also use the -v flag to get more info about the issue or problem that is occurring.

Collapse
tromp6 profile image
Max Trompetter

I executed exactly the commands that you wrote down here "docker run --rm -e UID=$(id -u) -e GID=$(id -g) --workdir /project -v "$PWD":/project matspfeiffer/flutter create .

xhost local:$USER && docker run --rm -ti -e UID=$(id -u) -e GID=$(id -g) -p 42000:42000 --workdir /project --device /dev/kvm --device /dev/dri:/dev/dri -v /tmp/.X11-unix:/tmp/.X11-unix -e DISPLAY -v "$PWD":/project --entrypoint flutter-android-emulator matspfeiffer/flutter"

under ubuntu and it doesn't work.
Error Message: No devices found with name or id matching 'flutter_emulator'

Collapse
tromp6 profile image
Max Trompetter

host.docker.internal doesn't resolve, are u sure it isn't deprecated?

Collapse
ciniguezb profile image
ciniguezb

I ran the command:

xhost local:$USER && docker run --rm -ti -e UID=$(id -u) -e GID=$(id -g) -p 42000:42000 --workdir /project --device /dev/kvm --device /dev/dri:/dev/dri -v /tmp/.X11-unix:/tmp/.X11-unix -e DISPLAY -v "$PWD":/project --entrypoint flutter-android-emulator matspfeiffer/flutter

And I saw the "Android Emulator" only for a few seconds, and then I had:
No devices found with name or id matching 'flutter_emulator'

Do you know why?

Collapse
matsp profile image
Mats Pfeiffer Author

Maybe a mistake in my scripts. I will check this out.