前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >制作一个标准 ICO 图标

制作一个标准 ICO 图标

作者头像
SkyRiN
发布2018-11-20 16:55:12
4.4K0
发布2018-11-20 16:55:12
举报
文章被收录于专栏:Coding+Coding+

1、ICO

ICO是Windows的图标文件格式,此格式图标文件可以存储单个图案、多尺寸、多色板的图标文件。一个图标实际上是多张不同格式的图片的集合体,并且还包含了一定的透明区域。

2、应用场景

最近发布一个 WPF 程序时,引用 ico 图标发现效果很模糊,后来查其原因是因为我所用的图标是由 png 转换过来的,而这张 png 在高分辨率下可以清晰显示,低分辨率下就模糊了

一张 png 转换出来的 ico 图标效果如下:

image.png

前面的还行 32、16 的就几乎看不清了,这就导致应用这个 ico 图标的程序在小图标显示下效果很差。

所以按对应场景设计不同分辨率图标集成为一个 ico 才是最佳解决方式。

3、Windows 在各个场景对图标分辨率的选择

为了找出 Windows 在各个场景对图标分辨率的选择我设计了如下 ico

image.png

ico_test.ico 是由右边7个 png 合成的,每个 png 上的数字对应了自己的分辨率,然后我把 ico_test.ico 应用到一个测试程序上,得出效果如下

大图模式显示

image.png

详细信息列表显示

image.png

桌面显示

image.png

工具栏及应用左上角小图标

image.png

微信发送

image.png

结果显而易见,常用的这几种场景会显示分辨率为 256*256 48*48 32*32 16*16 的图标

4、制作一个合格的 icon

推荐一个免费 Icon 编辑器 Greenfish Icon Editor Pro,制作过程也很 easy

首先打开一张 png ,然后 点图标-->根据当前布局创建图标

image.png

一般情况下选最下面一行就OK,包含了绝大部分使用场景

image.png

然后 ctrl+a ctrl+x 删除需要修改的分辨率所对应的图标

image.png

拖入准备好的各个分辨率图标 ctrl+a ctrl+c ctrl+v 粘近对应的位置就OK,左侧竖排图标可以预览效果

image.png

完成之后 ctrl+s 另存为 ico 文件即可。

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2017.12.29 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 1、ICO
  • 2、应用场景
  • 3、Windows 在各个场景对图标分辨率的选择
    • 大图模式显示
      • 详细信息列表显示
        • 桌面显示
          • 工具栏及应用左上角小图标
            • 微信发送
            • 4、制作一个合格的 icon
            领券
            问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档