Replace launcher icon for Compose Multiplatform
date
Dec 16, 2025
slug
cmp-launcher-icon
status
Published
tags
Programming
summary
如何在 Compose Multiplatform App Icon 加入自己的 Launcher Icon
type
Post
Introduction
最近使用 Compose Multiplatform (以下簡稱 CMP)開發一個新的 Side Project,上架前一步就是把自己的 App Icon 弄上去,花了點時間看了各方面的資源,想說寫一篇分享給需要的人看,之後自己需要也可以複習。
Mobile
由於手機需要適應不同的螢幕大小,以及各個地方會使用到的 Icon 大小都不一樣,因此網路上有很多工具可以 auto generate 全部需要的檔案。我個人是使用 IconKitchen,你可以設定 Icon 是一張縮圖、文字、圖片,可以客製化你想要的樣子,以及切換不同的圖形去預覽在不同的裝置上漲什麼樣子。個人覺得很夠用了,不過你想使用其他的也沒問題。

下載之後會給你一包東西,會根據平台分類資料夾,從這邊開始 Android 和 iOS 就會有點差別了。

Android
在 Android 這裡會給你一堆
mipmap 開頭的資料夾,這裡面都是不同大小的 Icon 的 PNG 和 XML 檔案,名稱都是 ic_launcher.png 或是 ic_launcher.xml。這些檔案在 Android Native 的路徑會在 app/src/main/res ,CMP 會放在 composeApp/src/androidMain/res ,你只要把 Icon Generator 產出來的那些資料夾貼到對應的位置覆蓋掉就沒問題了。
另外,你如果有更改過 launcher icon 的名稱的話,要注意一下要跟
AndroidManifest.xml 的 android:icon 這個 label 的值一樣。iOS
在 iOS 這裡你會在資料夾裡面看到一堆
AppIcon 開頭的 PNG 檔,以及一個 Contents.json 。你可以在最裡面的 iosApp 資料夾裡面看到 Assets.xcassets,Icon 的資訊都會放在這裡面的 AppIcon.appiconset。我發現最簡單的方法就是用 Finder 把 AppIcon.appiconset 打開,把 Icon Generator ios 資料夾的東西丟進去覆蓋掉就好了。我沒有把 Contents.json 丟過去,但我想有沒有應該都沒差。(我發現 Xcode 跟 Android Studio 這邊都不好操作,果然還是 Finder 好用啊)

Desktop (JVM)
在 Desktop 的部分理論上方法很簡單,因為設定 Icon 都是在 composeApp 的
build.gradle.kts 設定好的,基本上問題都在產生不同平台對應的 Icon 檔案。macOS
由於現在推出 Liquid Glass 的設計,Mac 有出一個 Icon Composer 讓你可以弄出剝離感的 Icon,Mac 有更新的話應該就有內建的了。在左下角的 + 按鈕可以點開新增一張你的 PNG 上去讓你在裡面調一些光線背景之類的,調整好之後可以點 File > Export 一個 PNG 檔案。

接下來轉檔的部分,macOS 需要的檔案是一個 這個專案可以幫你轉換,你只要 Clone 下來跑他的 Shell Script 就好。
.icns 檔案,png-to-icns
BenSouchet • Updated Dec 16, 2025
最後拉到專案對應的路徑,對好檔案名稱就沒問題了。
Windows
Windows 需要的是
.ico 檔案,這裡可以使用 ImageMagick 來幫你轉檔。我是使用他的 CLI 版本,如果有 Homebrew 可以使用 brew install imagemagick 安裝。接下來執行
magick 指令就可以幫你轉換,打你需要的路徑就可以轉檔,完成後就可以丟到專案中的對應位置。Linux
Linux 用的是 PNG 檔,我看你還要問什麼(x