DEV Community

loading...
Cover image for Package Flutter Linux App Into AppImage Part 2

Package Flutter Linux App Into AppImage Part 2

Hosam Hasan
I really like apps that add value to the society
・2 min read

Now, We are ready to build our first Flutter AppImage app 🚀

Firstly , we will change our working directory to the project directory.

$ cd flutter_appimage
Enter fullscreen mode Exit fullscreen mode

Then follow these steps:

1- Create folder AppDir

$ mkdir AppDir
Enter fullscreen mode Exit fullscreen mode

2- Generate the YAML recipe file required to build the AppImage

$ appimage-builder --generate
Enter fullscreen mode Exit fullscreen mode

this command will prompt some questions. Here is the final output :

INFO:Generator:Searching AppDir
? ID [Eg: com.example.app]: com.example.flutter_appimage
? Application Name: Flutter AppImage
? Icon: flutter_appimage_icon
? Executable path relative to AppDir [usr/bin/app]: flutter_appimage
? Arguments [Default: $@]: $@
? Version [Eg: 1.0.0]: latest
? Update Information [Default: guess]: guess
? Architecture: x86_64
Enter fullscreen mode Exit fullscreen mode

Now, you will notice a new file AppImageBuilder.yml added to the root directory of our project.

Wait a second, What the hack this flutter_appimage_icon comes from 🙄🤔

Stop rubbing your head. Here is why :

  • copy your favorite icon to the root directory and make sure its extension is SVG

  • rename you icon to flutter_appimage_icon.svg

Now, let's open AppImageBuilder.yml and edit some stuff:

  • add starting script that will delete old AppDir:
  script:
   - rm -rf AppDir | true
   - mkdir AppDir
Enter fullscreen mode Exit fullscreen mode
  • add after bundling scripts to add the Flutter App to the bandle
  AppDir:
    after_bundle:
    - cp build/linux/x64/release/bundle/flutter_appimage AppDir
    - cp -r build/linux/x64/release/bundle/lib/. AppDir/lib
    - cp -r build/linux/x64/release/bundle/data AppDir
    - cp flutter_appimage_icon.svg AppDir/usr/share/icons/
Enter fullscreen mode Exit fullscreen mode
  • Add gtk3 required for flutter app also define the repositories where dependencies comes from
    pacman:
      Architecture: x86_64
      repositories:
        core:
          - https://mirror.rackspace.com/archlinux/$repo/os/$arch
        extra:
          - https://mirror.rackspace.com/archlinux/$repo/os/$arch
      include:
        - gtk3
        - python # I don't know why we need but build fails without it  
        - perl # I don't know why we need but build fails without it
Enter fullscreen mode Exit fullscreen mode

Alright, Here is the moment we have been waiting for:

$ appimage-builder --skip-test 
Enter fullscreen mode Exit fullscreen mode

🥁🥁🥁🥁🥁🥁🥁🥁🥁🥁🥁🥁🥁🥁🥁🥁🥁🥁🥁.....................Voila 🥳🥳🥳🥳🥳

New file added to the root directory Flutter AppImage-latest-x86_64.AppImage

Flutter Counter App packaged in AppImage.

But wait a second ...... not again 😫.

The bundled AppImage file is about 225 MB , your kidding me 😠.

I know the bundle size needs some optmization , I wil pospone this to part 3.

References :

GitHub :

Discussion (0)