Tauri 项目更换默认图标（自定义应用桌面图标）

最新推荐文章于 2024-06-22 14:25:13 发布
最新推荐文章于 2024-06-22 14:25:13 发布
阅读量1k 收藏 3
点赞数 4
分类专栏： 基础 Tauri 文章标签： vue.js 前端 javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_46329670/article/details/129004331
版权

为实现自定义图标，Tauri 提供了一个 tauricon 的命令，可以自动生成各种尺寸的图标。

使用方法

准备一个尺寸为1240 x 1240 的 PNG图片或者正方形的SVG ，文件命名为app-icon.png
将图片文件放置在项目的根目录
在这里插入图片描述

cd进入到项目根目录，执行npm run tauri icon命令
在这里插入图片描述
然后就会自动生成相关尺寸的图标，并自动应用到对应的位置
图标存放和应用路径为项目根目录下的src-tauri\icons\

之后再打包的话就会自动使用新图标了

七七码生
关注
  • 4
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Tauri自带命令生成各平台图标
豪先生的博客
07-14 531
图片最好长宽比是1:1：(其他好像会报错)
Tauri + Rust 系统信息小工具
LeoForBest的博客
02-02 2200
Tauri + Rust 系统信息小工具
创建一个和tauri图标一致的icon和苹果icns图标
最新发布
06-22 216
我们先看一下tauri的图标的样子，然后看一下tauri程序安装之后的样子，其实这里最困难的就是苹果设备的icon图标怎么搞，因为如果你设置的不合适，就会导致生成的苹果图标在安装后比较显大，有的不太好看。所以这里我们就模仿tauri原本的图标尺寸搞一个大小差不多的图标出来。大小和其他的图标差别不大了。
Tauri icon图标生成
九段刀客的博客
09-19 169
这里我制作了一个app-icon.png图标放在src-tauri/icons的目录下，官方推荐。
pnpm tauri icon 一键转换 icon
天问博客-专注于大前端技术
02-01 699
在使用 Electron、Tauri 等框架开发桌面应用时，需要为应用生成不同平台的图标，如：MacOS 中的 icon.icns、Windows 中的 icon.ico、Linux 中的 *.png 等类型图标，这里介绍一种简单快捷一键转换图标的方法。
Tauri 系统托盘图标
豪先生的博客
11-19 760
你的项目/src-tauri/src/main.rs。
使用Tauri自带命令生成各平台图标方法，超级简单，只需要一张png图片
04-19 1124
icon.icnsicon.ico*.png请注意，图标类型可以在上面列出的平台以外的平台上使用(特别是png) 因此，我们建议包括所有的图标，即使你打算只构建一个子集的平台。
【桌面应用开发】Rust+Tauri框架项目打包操作
linhao's 博客
05-03 2182
Tauri 提供了一个 tauricon 的命令，该命令可以输入图片路径（默认情况下为 ./app-icon.png，尺寸为 1240 x 1240 的 PNG ）来创建各种平台所需的所有图标。或者如果是第一次执行tauricon此命令则会提示需要安装命令，输入y回车等待安装就行​​生成好的图标默认放在 src-tauri/icons 目录下。
Tauri 实战总结 系列二（窗口定制）
博客
01-02 2701
Tauri 生成的窗口顶部会有默认的标题栏，默认的效果有时候不符合我们项目需要，接下来我们来实现下如何自定义标题栏。
基于 tauri + vue3 开发的跨平台桌面端应用
03-24
我们使用 tauri 构建项目，使项目包更加小巧精简，资源占用更少，同时适配多个平台。 这意味着您可以在不同的操作系统上都能够使用 ChatGPT-Desktop，并且不会感到卡顿。 可以选择让 app 常驻后台，快捷键(支持...
基于Rust的轻量级Redis桌面端可视化工具源码 - Tauri与Sciter分支
03-25
项目简介：这是一款基于Rust语言的轻量级Redis桌面端可视化工具，源码包含Tauri与Sciter两个分支。项目主要采用Html语言编写，辅以JavaScript、Rust和CSS等。文件总数76个，具体包括：图片(png)18个，网页(html)18个...
vue-cli-plugin-tauri:将您的Vue SPA变成轻量级的跨平台桌面应用程序
04-28
是用于通过Web前端创建更小，更快，更安全的桌面应用程序的工具包。 该插件将Tauri配置为可在您的Vue CLI项目中使用。 安装 如果您有任何问题，请访问或我们的。 一般先决条件： NodeJS / npm Vue CLI（ yarn ...
tauri-docs：所有tauri项目文档的来源
02-24
此命令将给定语言（默认为“ en”）的静态内容生成到build/${language}目录中，并且可以使用任何静态内容托管服务进行服务。 要针对所有启用的语言进行构建，请使用： node build.js support-languages.js是包含...
Tauri 项目：ChatGPT App.zip
11-13
Chatgpt学习资料项目资料 用于实战ChatgptAI技术 源代码 供参考（代码+使用说明） Chatgpt学习资料项目资料 用于实战ChatgptAI技术 源代码 供参考（代码+使用说明） Chatgpt学习资料项目资料 用于实战ChatgptAI技术 ...
用Tauri+Vue3+TypeScript+Pinia写的基础类似百度云开发模板，支持国际化和主题切换，图片音视频播放等，可做图床视频床使用
06-09 1156
一个基础的tauri开发模板，具备国际化多语言切换，暗黑和亮白主题切换，注册登陆页面美化，动态路由自动构建左侧菜单列表，Pinia状态管理等等功能，开箱即用项目地址: https://github.com/Sjj1024/s-hub/tree/tauriv1.0 代码下载后，使用pnpm 安装依赖 运行程序：
Tauri的安装、启动、打包和很多用例(第一部分)
三巧的博客
02-27 9637
Tauri的使用
使用 React 和 Vite 使用 Tauri 构建番茄钟
分享身边生活经验blog
09-24 1280
潮音乐App，所有歌曲支持在线下载，全网资源任意搜！Tauri是一组工具，可让您使用前端框架构建跨平台桌面应用程序。当与 React 和 Vite 结合使用时，它可以用于为所有桌面平台构建极其快速的二进制文件。开发人员可以使用 Tauri 通过 Web 技术编写安全、精简和快速的跨平台桌面应用程序。对于许多开发人员来说， Electron通常是这些应用程序的首选框架，但 Tauri 现在已经做好了竞争的准备。在这篇文章中，我们将构建一个简单的番茄钟计时器，我邀请您按照自己的节奏学习本教程。
tauri+vite3创建登录窗口|tauri自定义拖拽区域
码农ICoding
10-25 2305
运用tauri+vite3自定义拖拽区域、创建登录窗口切换主窗口。
vscode tauri
09-17
VSCode Tauri 是一个将 Visual Studio Code（简称 VSCode）与 Tauri 框架结合使用的工具。VSCode 是一个流行的开源代码编辑器，而 Tauri 则是一个用于构建跨平台桌面应用程序的框架。 通过将 VSCode 和 Tauri 结合使用，开发者可以在同一个项目中同时享受到 VSCode 的强大代码编辑功能和 Tauri 的跨平台桌面应用开发能力。这意味着开发者可以使用 VSCode 提供的丰富的代码编辑器功能，如代码补全、调试器等，来开发一个可在不同操作系统上运行的桌面应用。 VSCode Tauri 提供了一个简单易用的框架，使开发者能够使用常见的网页开发技术（如 HTML、CSS 和 JavaScript）来构建桌面应用程序。开发者可以使用现有的前端知识和工具来开发跨平台应用，而无需学习特定的桌面应用开发技术。 此外，VSCode Tauri 还提供了丰富的插件生态系统，开发者可以利用这些插件来扩展应用程序的功能和界面。这使得开发者能够快速构建出功能丰富、界面友好的跨平台桌面应用。 总之，VSCode Tauri 提供了一种便捷的桌面应用开发方式，它将 VSCode 的代码编辑能力与 Tauri 框架的跨平台能力相结合，使开发者能够快速构建出功能强大、跨平台的桌面应用程序。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值