wpf Windows 10 所有 DPI 设置的所有图标分辨率?格式?像素艺术作为图标?开始菜单中的大尺寸图标?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/40749785/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Windows 10 all icon resolutions on all DPI settings? Format? Pixel art as icon? Large size icon in start menu medium tile?
提问by z4k
Just skip to the answer at the answer section, the question part has speculations and mistakes. The answer is based on experiment and it is accurate.
直接跳到答案部分的答案,问题部分有猜测和错误。答案是基于实验,是准确的。
For a long time I have used a single png packed 256px ico file for my Visual Studio projects, and it worked well, cause scaling works fine on those icons and they take almost no space, and I did not care that much before.
很长一段时间以来,我为我的 Visual Studio 项目使用了一个 png 打包的 256 像素 ico 文件,它运行良好,因为这些图标的缩放效果很好,而且它们几乎不占用空间,而且我以前并不在意。
But now I have an icon that needs to "retain hard edges", it is "pixel art". If I build with a 256px version downscales terribly or if I build with 16px upscales slightly less terribly but not good enough. So my questions are:
但是现在我有一个需要“保留硬边”的图标,它是“像素艺术”。如果我使用 256px 版本构建会严重缩小,或者如果我使用 16px 构建会稍微降低一些但还不够好。所以我的问题是:
What are the sizes I have to generate to merge into the ico (I don't care about pre win7 icons)?
If I got that list, do I have to generate 1.25x, 1.5x and 2.0x versions for high dpi settings?
Finally, some apps like firefox has a large icon on start menu inside the medium square block, my apps have a smaller one in the center like Visual Studio does, how can I put a large icon in the start menu medium sized square?
我必须生成什么尺寸才能合并到 ico 中(我不关心 pre win7 图标)?
如果我得到了那个列表,我是否必须为高 dpi 设置生成 1.25x、1.5x 和 2.0x 版本?
最后,一些像 firefox 这样的应用程序在开始菜单中的中方形块内有一个大图标,我的应用程序像 Visual Studio 一样在中心有一个较小的图标,我怎样才能在开始菜单中的方形块中放置一个大图标?
I did found it: Unfortunately VS says: VisualElements is not supported in a Windows Presentation Foundation (WPF) project. Is there a way around this?
我确实找到了:不幸的是 VS 说:Windows Presentation Foundation (WPF) 项目不支持 VisualElements。有没有解决的办法?
I looked around and collected possible sizes @1x(96DPI):
16, 20, 24, 30, 32, 40, 48, 50, 64, 128, 150, 256, 512, 768
Mostly I collected these from Which icon sizes should my Windows application's icon include?.
我环顾四周,收集可能的大小@ 1X(96DPI):
16,20,24,30,32,40,48,50,64,128,150,256,512,768
主要是我收集这些从哪个图标大小应该我Windows 应用程序的图标包括?.
Not that bad, but if I add 1.25x, 1.5x, 2.0x then we get:
16, 20, 24, 25, 30, 32, 36, 38, 40, 45, 48, 50, 60, 62, 64, 72, 75, 80, 96, 100, 128, 150, 160, 188, 192, 225, 256, 300, 320, 384, 512, 640, 768, 960, 1024, 1152, 1536In my case it makes a 500k ico file and as it seems the 1024 is the max resolution you can put into an ico file, my icon is pixelated so compresses really well with png and still ~500k.
还不错,但如果我加上 1.25x, 1.5x, 2.0x 那么我们得到:
16, 20, 24, 25, 30, 32, 36, 38, 40, 45, 48, 50, 60, 62, 64, 72, 75, 80, 96, 100, 128, 150, 160, 188, 192, 225, 256, 300, 320, 384, 512, 640, 768, 960, 10524, 10524,10525 k ico 文件,似乎 1024 是您可以放入 ico 文件的最大分辨率,我的图标是像素化的,因此使用 png 压缩得非常好,并且仍然约为 500k。
I also made an ico has all of the above resolutions in rgba, and every one has its size on it, so you can see which windows loads on which dpi setting. you can download it from hereand use it in a vs project to test.
我还在 rgba 中制作了一个具有上述所有分辨率的 ico,并且每个都有其大小,因此您可以看到哪些窗口在哪个 dpi 设置上加载。你可以从这里下载它并在 vs 项目中使用它进行测试。
As I understand everything under 256px can't be png compressed, is this right?
据我了解,256px 以下的所有内容都不能被 png 压缩,对吗?
And do I need all these sizes to retain a pixel perfect icon? Are only 32bit(RGBA) pngs okay? I hope I don't need to include other depths.
我是否需要所有这些尺寸才能保留像素完美的图标?只有 32 位(RGBA)png 可以吗?我希望我不需要包括其他深度。
After i wrote an ico writer from the spec I realized that pngs can have 0 for resolution cause 1 byte is available for x or y(but i have never seen an ico that is non square, maybe curs can be non square), in this case probably the first one in the file with zeros for resolution going to be used...This is not sure but I think its not far from the truth. See images. Rescaling issues are still confusing me, if I'll have some time tomorrow I'll test it. A pixel perfect icon seems to be imposible to do: having one image to rescale to anything above 256px.
在我从规范中写了一个 ico writer 之后,我意识到 pngs 可以有 0 分辨率,因为 1 个字节可用于 x 或 y(但我从未见过非方形的 ico,也许 curs 可以是非方形的),在这个case 可能是文件中第一个将使用的分辨率为零的文件......这不确定,但我认为它与事实相去甚远。查看图片。重新缩放问题仍然让我感到困惑,如果我明天有时间我会测试它。一个像素完美的图标似乎是不可能的:让一张图片重新缩放到 256 像素以上的任何东西。
回答by z4k
The answers:
答案:
Are PNGs are acceptable under 256px inside ICO file?
Microsoft states that the sizes under 256px should be a BMP without the first 14 bytes.
But at least in the case of windows 10, the answer is YES.
ICO 文件中 256 像素以下的 PNG 是否可以接受?
Microsoft 声明 256px 以下的大小应该是没有前 14 个字节的 BMP。
但至少在 Windows 10 的情况下,答案是肯定的。
Can you add larger than 1024px image into the ICO?
YES. As long as it is a PNG it can be as big as you want.
Note the "one icon over 255px" limitation:
You can only add one image larger than 255px ( you can add more but windows will only read the first image block in the ICO head where the resolution is 0,0). The format specifies 1 byte for each dimension. See table #2.
您可以将大于 1024 像素的图像添加到 ICO 中吗?
是的。只要它是 PNG,它就可以随心所欲。
请注意“一个图标超过 255 像素”的限制:
您只能添加一个大于 255 像素的图像(您可以添加更多图像,但 Windows 只会读取分辨率为 0,0 的 ICO 头中的第一个图像块)。该格式为每个维度指定 1 个字节。见表#2。
What sizes to include for all DPI setting?
Windows 10 uses the following icon sizes (see table below):
16, 20, 24, 28, 30, 31, 32, 40, 42, 47, 48, 56, 60, 63, 84 and one larger than 255px.
所有 DPI 设置要包含哪些尺寸?
Windows 10 使用以下图标大小(见下表):
16、20、24、28、30、31、32、40、42、47、48、56、60、63、84 和一个大于 255px 的图标。
Note that Windows RT apps do not use ICO files, they use PNGs or Fonts, this is from Firefox's source:
请注意,Windows RT 应用程序不使用 ICO 文件,它们使用 PNG 或字体,这是来自 Firefox 的来源:
<Application xmlns:xsi='http://www.w3.org/2001/XMLSchema-instance'>
<VisualElements
ShowNameOnSquare150x150Logo='on'
Square150x150Logo='browser\VisualElements\VisualElements_150.png'
Square70x70Logo='browser\VisualElements\VisualElements_70.png'
ForegroundText='light'
BackgroundColor='#0996f8'/>
</Application>
So how Firefox has a large icon on start menu in the medium tile?
Well its include this above file in the exe directory before the shortcut added to start menu, this article explains it how. My app has an example.
那么 Firefox 如何在中等磁贴的开始菜单上有一个大图标?
好吧,它在将快捷方式添加到开始菜单之前将上述文件包含在 exe 目录中,本文解释了它如何. 我的应用程序有一个示例。
If you make icons for Windows 10 you are better off with my tool and photoshop (or something like that) than anything else, I tried editors and they suck.
如果你为 Windows 10 制作图标,你最好使用我的工具和 photoshop(或类似的东西)而不是其他任何东西,我尝试过编辑器,但它们很糟糕。
You can create ICO files (as MS recommendation or not) or create icons with resolution printed on them, the latter is what I used to make the table.
Supports multiple resize modes including nearest neighbor.
If you want to you can use it on other windows versions, it works with .net2, test another windows, send me the results and I extend the table for the good of mankind.
您可以创建 ICO 文件(无论是否作为 MS 推荐)或创建带有打印分辨率的图标,后者是我用来制作表格的。
支持包括最近邻在内的多种调整大小模式。如果您愿意,您可以在其他 Windows 版本上使用它,它可以与 .net2 一起使用,测试另一个 Windows,将结果发送给我,我为人类的利益扩展表格。
As for pixel art in icons it is not possible to be perfect :(, unless we can change the scaling algorithm in windows 10. So a wide range 84-256 gets the scaled to "0" (see above), so there is no real point adding something bigger that 256 as I see it now you should create a 256px image for "0". (See table why)
至于图标中的像素艺术,它不可能是完美的 :(,除非我们可以在 Windows 10 中更改缩放算法。所以 84-256 的范围很广,缩放到“0”(见上文),所以没有真正的点是添加大于 256 的东西,就像我现在看到的那样,您应该为“0”创建一个 256px 的图像。(请参阅表格原因)
If Windows gets all icons 16 to 255 + the 1 larger than 255 (0 in the table) chooses these sizes: (so no markdown tables here?, its kind of wide, the tables are in the app readme also)
如果 Windows 获取所有图标 16 到 255 + 大于 255 的 1(表中的 0)选择这些尺寸:(所以这里没有降价表?,它的种类很宽,这些表也在应用程序自述文件中)
| | Windows 10 |
| | 96DPI | 120DPI | 144DPI | 168DPI |
| icon |disp.|load|disp.|load|disp.|load|disp.|load|
|-------------------------------------------|-----|----|-----|----|-----|----|-----|----|
| alt-tab | 24 | 32 | 30 | 32 | 36 | 32 | 42 | 32 |
| desktop large | 96 | 0 | 120 | 0 | 144 | 0 | 168 | 0 |
| desktop medium | 48 | 48 | 60 | 60 | 72 | 72 | 84 | 84 |
| desktop small | 32 | 32 | 40 | 40 | 48 | 48 | 56 | 56 |
| explorer content, inc0 | 32 | 32 | 40 | 40 | 48 | 48 | 56 | 56 |
| explorer extra large | 256 | 0 | 256 | 0 | 256 | 0 | 256 | 0 |
| explorer large | 96 | 0 | 120 | 0 | 144 | 0 | 168 | 0 |
| explorer medium | 48 | 48 | 60 | 60 | 72 | 72 | 84 | 84 |
| explorer small:inc4,list:inc3,details:inc2| 16 | 16 | 20 | 20 | 24 | 24 | 28 | 28 |
| explorer tiles, inc1 | 48 | 48 | 60 | 60 | 72 | 72 | 84 | 84 |
| startmenu medium | 32 | 32 | 40 | 40 | 48 | 48 | 56 | 63 |
| startmenu programs | 24 | 24 | 30 | 30 | 36 | 36 | 42 | 42 |
| startmenu search | 32 | 60 | 40 | 60 | 48 | 60 | 56 | 0 |
| startmenu tile small | 24 | 24 | 30 | 31 | 36 | 39 | 42 | 47 |
| taskbar normal | 24 | 32 | 30 | 40 | 36 | 48 | 42 | 56 |
| taskbar small | 16 | 16 | 20 | 20 | 24 | 24 | 28 | 28 |
| window icon | 16 | 16 | 20 | 16 | 24 | 16 | 28 | 16 |
| desktop inc0 | 16 | 16 | 20 | 20 | 24 | 24 | 28 | 28 |
| desktop inc1 | 18 | 32 | 23 | 40 | 27 | 48 | 32 | 56 |
| desktop inc2 | 20 | 30 | 25 | 40 | 30 | 48 | 35 | 56 |
| desktop inc3 | 22 | 32 | 28 | 40 | 33 | 48 | 39 | 56 |
| desktop inc4 | 24 | 32 | 30 | 40 | 36 | 48 | 42 | 56 |
| desktop inc5 | 27 | 32 | 34 | 40 | 41 | 48 | 47 | 56 |
| desktop inc6 | 30 | 32 | 38 | 40 | 45 | 48 | 53 | 56 |
| desktop inc7 | 33 | 48 | 41 | 60 | 50 | 72 | 58 | 84 |
| desktop inc8 | 37 | 48 | 46 | 60 | 56 | 72 | 65 | 84 |
| desktop inc9 | 41 | 48 | 51 | 60 | 62 | 72 | 72 | 84 |
| desktop inc10 | 46 | 48 | 58 | 60 | 69 | 72 | 82 | 84 |
| desktop inc11 | 51 | 0 | 64 | 0 | 77 | 0 | 89 | 0 |
| desktop inc12 | 57 | 0 | 71 | 0 | 86 | 0 | 100 | 0 |
| desktop inc13 | 63 | 0 | 79 | 0 | 95 | 0 | 110 | 0 |
| desktop inc14 | 70 | 0 | 88 | 0 | 105 | 0 | 123 | 0 |
| desktop inc15 | 78 | 0 | 98 | 0 | 117 | 0 | 137 | 0 |
| desktop inc16 | 87 | 0 | 109 | 0 | 131 | 0 | 152 | 0 |
| desktop inc17 | 97 | 0 | 121 | 0 | 146 | 0 | 170 | 0 |
| desktop inc18 | 108 | 0 | 135 | 0 | 162 | 0 | 189 | 0 |
| desktop inc19 | 120 | 0 | 150 | 0 | 180 | 0 | 210 | 0 |
| desktop inc20 | 133 | 0 | 166 | 0 | 200 | 0 | 233 | 0 |
| desktop inc21 | 148 | 0 | 185 | 0 | 222 | 0 | 256 | 0 |
| desktop inc22 | 164 | 0 | 205 | 0 | 246 | 0 | 256 | 0 |
| desktop inc23 | 182 | 0 | 228 | 0 | 256 | 0 | 256 | 0 |
| desktop inc24 | 202 | 0 | 253 | 0 | 256 | 0 | 256 | 0 |
| desktop inc25 | 224 | 0 | 256 | 0 | 256 | 0 | 256 | 0 |
| desktop inc26 | 249 | 0 | 256 | 0 | 256 | 0 | 256 | 0 |
| explorer inc5 | 18 | 32 | 23 | | | | | |
| explorer inc6 | 20 | 32 | 25 | | | | | |
| explorer inc7 | 22 | 32 | 28 | | | | | |
| explorer inc8 | 23 | 32 | 29 | | | | | |
| explorer inc9 | 25 | 32 | 31 | | | | | |
| explorer inc10 | 27 | 32 | 34 | | | | | |
| explorer inc11 | 29 | 32 | 36 | | | | | |
| explorer inc12 | 31 | 32 | 39 | | | | | |
| explorer inc13 | 33 | 48 | 41 | | | | | |
| explorer inc14 | 35 | 48 | 44 | | | | | |
| explorer inc15 | 38 | 48 | 48 | | | | | |
| explorer inc16 | 41 | 48 | 51 | | | | | |
| explorer inc17 | 44 | 48 | 55 | | | | | |
| explorer inc18 | 47 | 48 | 59 | | | | | |
| explorer inc19 | 50 | 0 | 63 | | | | | |
| explorer inc20 | 54 | 0 | 68 | | | | | |
| explorer inc44 | 239 | 0 | 256 | 0 | | | | |
| explorer inc45 | 256 | 0 | 256 | 0 | | | | |
There are 27 zoom increments on desktop
and 45 zoom increments on explorer (including the defaults from the menu on the "bottom level")
桌面上有 27
个缩放增量,资源管理器上有45 个缩放增量(包括“底层”菜单中的默认值)
Icon format specification:
图标格式规范:
|**block** |**offset** |**offset** |**length** |**description** |
|-----------|-----------|-----------|-----------|-------------------------------|
|main header| 0 | | 2 |Reserved=0 |
| | 2 | | 2 |Image type: 1(.ICO) 2(.CUR) |
| | 4 | | 2 |Number of images in container |
|image head1| 6 | 0 | 1 |Pixel width |
| | 7 | 1 | 1 |Pixel height |
| | 8 | 2 | 1 |Color palette size or 0 |
| | 9 | 3 | 1 |Reserved=0 |
| | A | 4 | 2 |Color planes=0 or 1 |
| | C | 6 | 2 |Bits per Pixel |
| | E | 8 | 4 |Image raw size |
| | 12 | C | 4 |Offset of imageblock from BOF |
|image head2| 16 | 0 | 1 |Pixel width |
| ... | ... | ... | ... |... |
|imageblock1| ... | ... | ... |all image data goes here: |
| | ... | ... | ... | pngs included in whole |
| | ... | ... | ... | bmps missing first 14 bytes |
回答by RaminMT
The icons you see in Windows 10 are packed into a icon font named Segoe MDL2 Assets& all built-in UWP apps like Groove Music are using this font for icons. Also some apps in the Windows store using it.
您在 Windows 10 中看到的图标被打包成一个名为的图标字体Segoe MDL2 Assets,并且所有内置的 UWP 应用程序(如 Groove Music)都使用这种字体作为图标。Windows 商店中的一些应用程序也在使用它。

