tauri其实已经集成了一条命令,用于生成各个平台的图标,,,,我之前还苦苦找遍整个互联网上去寻找方法,我真笨啊啊啊啊啊啊啊啊,啥也不说了,有能力的看官方文档吧:图标 | Tauri Apps
不同格式图标文件说明:
icon.icns
= macOSicon.ico
= Windows*.png
= LinuxSquare*Logo.png
&StoreLogo.png
= Currently unused but intended for AppX/MS Store targets.
请注意,图标类型可以在上面列出的平台以外的平台上使用(特别是 png
) 因此,我们建议包括所有的图标,即使你打算只构建一个子集的平台。
命令使用
从 @tauri-apps/cli
/ tauri-cli
版本 1.1 开始 icon
子命令是主 Cli 的一部分:
npm命令:
npm run tauri icon
yarn命令:
yarn tauri icon
命令参数说明:
> cargo tauri icon --help
cargo-tauri-icon 1.1.0
Generates various icons for all major platforms
USAGE:
cargo tauri icon [OPTIONS] [INPUT]
ARGS:
<INPUT> Path to the source icon (png, 1024x1024px with transparency) [default: ./app-icon.png]
OPTIONS:
-h, --help Print help information
-o, --output <OUTPUT> Output directory. Default: 'icons' directory next to the tauri.conf.json file
-v, --verbose Enables verbose logging
-V, --version Print version information
实际操作一下:(注意图片一定要是正方形的)
如果图片不是正方形1:1的比例,就会报错:thread '<unnamed>' panicked at 'Source image must be square', src\icon.rs:60:5
note: run with `RUST_BACKTRACE=1` environment variable to display a backtrace
Done in 0.14s.
1.在项目根目录中放置一个app-icon.png 文件:
且长宽比一定要是1:1:
不是的话,一定要修改一下,windows的用系统自带的图片编辑器就可以,mac应该可以,我这个原来就不是1:1,结果报错了:thread '<unnamed>' panicked at 'Source image must be square', src\icon.rs:60:5
note: run with `RUST_BACKTRACE=1` environment variable to display a backtrace
Done in 0.14s.
2.执行命令: yarn tauri icon
正常执行完,会有上面的输出,说明文件已经生成好了,在src-tauri\icons这个路径下:
如果你想手动修改某个图标,就在src-tauri\tauri.conf.json中修改即可:
默认情况下,图标将被放置在 src-tauri/icons
文件夹中,它们将被自动放置在内置应用程序中。 如果想要从不同的位置来获取图标,可以编辑 tauri.conf.json
文件的这一部分:
{
"tauri": {
"bundle": {
"icon": [
"icons/32x32.png",
"icons/128x128.png",
"icons/128x128@2x.png",
"icons/icon.icns",
"icons/icon.ico"
]
}
}
}
手动创建图标
如果您更喜欢自己构建这些图标,例如,如果您想对小尺寸进行更简单的设计,或者因为不想依赖CLI的内部图像大小调整,则必须确保您的图标符合某些要求:
icon.icns:在Tauri repo中描述了icns文件所需的图层大小和名称
icon.ico:ico文件必须包含16、24、32、48、64和256像素的图层。为了在开发中 最佳显示 国际协力团图像,32像素层应该是第一层。
png:png图标的要求是:宽度==高度、RGBA(RGB+透明度)和每像素32位(每通道8位)。通常预期的大小为32、128、256和512像素。我们建议至少匹配tauri图标的输出:32x32.png,128x128.png,128x128@2x.png,和icon.png。