CODEWITHSUNDEEP
flutterflutter-windows
Ali Nour
Ali Nour

Reputation: 473

how to change desktop windows application icon for flutter?

I used the desktop flutter and I searched for a way to do that I couldn't find any articles about that, so I want to know how to change the launcher app icon for Windows desktop and also for Mac and Linux.

[UPDATE] Now flutter_launcher_icons package supports all platforms

To set it up:

  1. Create a file and may name it as flutter_launcher_icons.yaml
  2. Add configuration to flutter_launcher_icons.yaml
  3. Specify image paths and platforms
dev_dependencies:
  flutter_launcher_icons: "^0.13.1"

flutter_launcher_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
  macos:
    generate: true
    image_path: "path/to/image.png"
  1. Run pub get and the package
flutter pub get
flutter pub run flutter_launcher_icons -f flutter_launcher_icons.yaml

Upvotes: 29

Views: 21755

Answers (7)

Noman Karimi
Noman Karimi

Reputation: 131

This is what i did and worked for me 100%

dev_dependencies: flutter_launcher_icons: "^0.13.1"

flutter_launcher_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 macos: generate: true image_path: "path/to/image.png" Run pub get and the package

at the end run these in terminal flutter pub get flutter pub run flutter_launcher_icons -f flutter_launcher_icons.yaml

Upvotes: 0

Gabriel Beckman
Gabriel Beckman

Reputation: 190

After trying all of these steps for weeks, what really worked for me was to change the app description on those fields on Runner.rc:

  • FileDescription
  • InternalName
  • OriginalFilename
  • ProductName

I also changed the BINARY_NAME description field on CMakeLists.txt.

After changing the description for some reason, the icon is updated. I didn't tried, but you can try to switch your app name back to the previous one after you successfully update the launcher app icon.

Upvotes: 1

Sapto Sutardi
Sapto Sutardi

Reputation: 456

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.

Upvotes: 1

Kiyan Ray
Kiyan Ray

Reputation: 21

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

Upvotes: 2

Utkarsh Mishra
Utkarsh Mishra

Reputation: 81

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

Upvotes: 8

kakyo
kakyo

Reputation: 11580

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

Upvotes: 0

smorgan
smorgan

Reputation: 21569

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.

Upvotes: 46

Related Questions