乘风破浪，遇见最美Windows 11之现代Windows桌面应用开发 - 通过IconWorkshop制作高质量高兼容性的桌面应用图标

背景

不同历史阶段的Windows版本对图像技术的支持是不一样的，对XP来说，较低尺寸图标需要8位RGB图像才能很好的展示、从Vista开始，Windows才开始支持RGB/A的256x256尺寸的图标，由于Figma等设计软件默认导出的图片就是RGB/A的PNG格式，所以基于原始设计图我们需要通过专用图标工具来创建能适配更多系统版本的Windows图标文件(.ico)，以便最终程序在不同系统都呈现好的图标效果。

安装工具

关于IconWorkshop

IconWorkshop是一款专业的图标制作软件，通过IconWorkshop可以为创建Windows图标，制作Mac图标以及Unix等操作系统创建图标。为Vista/7系统创建256x256的Windows图标，为OSX Lion 系统创建1024x1024的Macintosh图标。以及为Unix/Linux系统制作PNG图标。

新一代的图标采用了可变透明度（Alpha通道），Alpha通道能够使得制作出来的图标拥有光滑的边缘以及平滑的阴影。IconWorkshop完全支持Alpha通道，仅需几步操作即可创建有Alpha通道的PNG图像，包括利用现有的Windows和Mac图标创建PNG图标。

下载IconWorkshop

https://www.iconworkshop.cn/xiazai.html

IconWorkshopshiyongban.exe

安装IconWorkshop

建议在虚拟机或者Windows沙盒里面安装，这样就不用担心试用授权过期的问题。

关于如何启用Windows沙盒？

前往，Windows 11的系统设置-应用-可选功能-底部-更多Windows功能-启用或关闭Windows功能。

找到Windows沙盒，勾选它，点击确定即可。

安装后，需要搜索名称为Windows Sandbox的应用。

示例资源

这里从借用微软的Power产品线资源来做个示例。

https://docs.microsoft.com/en-us/power-platform/guidance/icons

Power_Platform_scalable.zip

创建图标(基于单图)

如果设计师只给了一个最大尺寸，比如256x256的PNG图像，那么我们就要从另外一个角度来制作图标。

拖入单个大尺寸图像

将设计师给的大尺寸图像直接拖进工具。

基于图像创建项目

点击图像设计器左上角的Windows图标按钮，进入由图像新建Windows图标对话框。

这里我们选中主流的规格，其中包括：

256x256 RGBA
128x128 RGBA
96x96 RGBA
80x80 RGBA
72x72 RGBA
64x64 RGBA
48x48 RGBA
32x32 RGBA
24x24 RGBA
16x16 RGBA
48x48 256
32x32 256
24x24 256
16x16 256

这里256x256 RGBA可以用于Windows Vista及其之后的系统版本，这里48x48 256等代表RGB类型的8位图，用于兼容XP系统的小尺寸场景。

点击确认按钮之后，以上全套图标就都加到当前图标项目中了。

创建图标(基于多图)

创建Windows图标项目

这里我们可以先按RGB/A的256x256方案模板进行创建即可。

创建后得到一个空白的图标项目，里面默认存在一个256x256的RGB/A图标位置。

导入设计的图像

从Figma里面下载新版本图标的所有尺寸，在图标设计左侧的区域右键选择由图像文件添加数个图像格式菜单。

选中所有尺寸的图像一口气添加进来。

对于不兼容的可以先忽略。

右键移除其中部分异常的图像

重复上诉步骤，再将异常的图像大小重新添加一次即可。

优化向下兼容性

这时候我们看到已添加进来的图像都是RGB/A格式的，但是这种格式其实在Windows XP及其更早系统的小尺寸时存在兼容性问题，为了提高兼容性，我们还需要添加小尺寸图标的RGB图标进来。

我们在256x256这个图像上右键，选中由此图像添加数个图像格式菜单，以便基于它创建我们所需的RGB图标。

在创建对话框中，我们勾选位于第二排的48x48 - 256、32x32 - 256、24x24 - 256、16x16 - 256，如果发现还有其他规格缺失也一起勾选上，然后点击确认按钮即可。

完成后，即可看到刚才所选的几个RGB的小尺寸图标被添加进来了，它将包括在最终保存的图标中。

导出图标

导出项目的图标

想要导出当前项目的图标，只需要保存项目即可，在图像设计窗口点击左上角的保存按钮，重名最终图标名称，默认格式就是Windows图标文件(.ico)

检查图标效果

将最终得到的Windows图标文件(.ico) 拖到Visual Studio里面即可进行清晰的查看，我们会发现里面存在刚才设计的多个尺寸的32位BMP和32位PNG图像，而且针对小尺寸还有8位的BMP，这样就制作完毕了。

示例项目

https://github.com/TaylorShi/demoForAppIcon

创建基于.Net 6的Winform示例项目

将Ico资源放到上层文件夹并设置

这时候，我们需要设置程序的图标资源为它。

通过Visual Studio Code编辑项目属性，找到PropertyGroup节点下ApplicationIcon中的路径。

这里我们用相对路径：..\Icon\AppLogo.ico

<Project Sdk="Microsoft.NET.Sdk">

  <PropertyGroup>
    <OutputType>WinExe</OutputType>
    <TargetFramework>net6.0-windows</TargetFramework>
    <Nullable>enable</Nullable>
    <UseWindowsForms>true</UseWindowsForms>
    <ImplicitUsings>enable</ImplicitUsings>
    <ApplicationIcon>..\Icon\AppLogo.ico</ApplicationIcon>
  </PropertyGroup>

</Project>