23

I using the desktop flutter and i searched for a way to do that i couldnt find any articles about that sp ii want to know how to change the launcher app icon for windows desktop and also for mac and linux.

Abhilash Chandran
  • 6,803
  • 3
  • 32
  • 50
Ali Nour
  • 383
  • 1
  • 4
  • 12

5 Answers5

42

To change the icon you just need to replace the icon file in your project:

  • Windows: windows/runner/resources/app_icon.ico
  • macOS: macos/Runner/Assets.xcassets/AppIcon.appiconset

Linux doesn't have an icon set up in the template yet; you can follow this issue for updates.

smorgan
  • 20,228
  • 3
  • 47
  • 55
  • 1
    i made an ico file with my logo and replaced it with the ico file at `resources/app_icon.ico` but it did not change the icon – Zuher Abud Said Jun 25 '21 at 19:45
  • 1
    `flutter build windows` doesn't pick up `windows/runner/resources/app_icon.ico` for the release version. What am I missing? – kakyo Jul 26 '21 at 03:12
  • Is there any way we could change the app icon in the runtime? – Mahesh Jamdade Jan 14 '22 at 17:31
  • 1
    To anyone stumbling upon this issue: at first, it seems that replacing `app_icon.ico` won't do anything. I tried several other methods, including specifying another file in `Runner.rc` as mentioned below, but nothing seemed to work. In the end, I invalidated caches for Android Studio, rebooted my PC, run a `flutter clean` then rebuilt my app. In the end, the icon got updated by replacing `app_icon.ico`. – il_boga Jan 27 '22 at 13:38
  • @il_boga You should file a bug; if it requires a `clean` that's something that should be fixed. – smorgan Jan 28 '22 at 01:13
8

To change the icon in windows you have to keep the icon file in this location:

windows/runner/resources/

Then go into windows/runner/resources/Runner.rc file and search for the word app_icon. You will reach here:

IDI_APP_ICON            ICON                    "resources\\app_icon.ico"

Replace the app_icon with your icon file name. Then run the command

flutter build windows
flutter run --release -d windows
Utkarsh Mishra
  • 81
  • 1
  • 2
1

For Linux

Best And Simple way is to use gtk_window_set_icon_from_file function

Edit Your my_application.cc file which is inside Linux folder linux/my_application.cc

  • before line gtk_widget_show(GTK_WIDGET(window));
  • add new line gtk_window_set_icon_from_file(GTK_WINDOW(window),"assets/icon.ico",NULL);
  • Icon recommends 48x48 pixel
Kiyan Ray
  • 11
  • 3
  • 1
    didn't work for me – HII Sep 13 '22 at 14:14
  • please show me your code – Kiyan Ray Sep 18 '22 at 02:51
  • I added the line `gtk_window_set_icon_from_file(GTK_WINDOW(window),"images-icons/out/icons/win/icon.ico",NULL);` and there is no change in the linux executable appearance either. Does the icon need to be in `assets/` and registered as an asset using `pubspec.yaml` perhaps? – abulka Oct 28 '22 at 06:16
  • Actually before I made the above code change, the default app icon was still the same generic grey gear symbol that I'm getting now - not even the classic flutter icon. So if the flutter team can't change the icon then what hope do we have! – abulka Oct 28 '22 at 06:29
  • Turns out that the gtk call above needs the icon file to be present at runtime, e.g. in the directory (or subdir) of the deployed executable. You will see a warning in the terminal when running if the icon file you specify cannot be found. So in the end I got the icon loading OK. However the icon of the deployed executable is still generic, and the icon as displayed in the Ubuntu dock at runtime remains generic - so there is no visible useful effect of this line of code, as far as I can see. – abulka Oct 30 '22 at 04:41
1

I hava the best way, using Flutter Launcher Icons for your Windows, Android etc.

  1. Edit your pubspec.yaml file:

dev_dependencies: flutter_launcher_icons: "^0.10.0"

flutter_icons:
  android: "launcher_icon"
  ios: true
  image_path: "assets/icon/icon.png"
  min_sdk_android: 21 # android min sdk min:16, default 21
  web:
    generate: true
    image_path: "path/to/image.png"
    background_color: "#hexcode"
    theme_color: "#hexcode"
  windows:
    generate: true
    image_path: "path/to/image.png"
    icon_size: 48 # min:48, max:256, default: 48
  1. Go to Terminal, run:
flutter pub get
flutter pub run flutter_launcher_icons:main

Note: Name of your icon is lowercase, don't use capital.

Sapto Sutardi
  • 326
  • 4
  • 11
0

Here is my setup from flutter doctor

Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 2.2.1, on Microsoft Windows [Version 10.0.19043.1110], locale en-CA)
[✓] Android toolchain - develop for Android devices (Android SDK version 30.0.3)
[✓] Chrome - develop for the web
[✓] Visual Studio - develop for Windows (Visual Studio Community 2019 16.10.3)
[✓] Android Studio (version 4.1.0)
[✓] Android Studio
[✓] Connected device (3 available)

• No issues found!

Initially it didn't work by just replacing the icon and run

flutter build windows

and neither did

flutter clean
flutter build windows

I found that in the running mode the icon updates on the GUI, but unfortunately not in the EXE itself.

flutter run --release -d windows
kakyo
  • 10,460
  • 14
  • 76
  • 140