当前位置：首页>数据库>正文

iOS 开发HEIC图标实践总结

数据库2024-10-18 16:01:59

这里记录下自己了解的HEIC及其在iOS开发中的实践。

一、`HEIC`简介

发展史.png

HEIF(High Efficiency Image Format)，即高效图像格式。HEIF是由MPEG组织开发的，它的目标是在保持较高的图像质量的同时减小文件大小。HEIF广泛地应用于移动设备和互联网环境中。它已被苹果公司选作其手机和平板电脑上的默认图像格式。

HEIF使用的主要压缩算法有HEVC和HEIC

HEIF使用的主要压缩算法有：HEVC（High Efficiency Video Coding）和HEIC（High Efficiency Image Coding）。
HEVC是一种视频编码标准，也被用于压缩HEIF图像。它使用了先进的压缩技术，包括帧间预测、变换编码和熵编码，以减小图像数据的存储空间.
HEIC综合使用了HEVC和CE-BC算法。

HEIF格式文件的扩展名有.heic和.heif

.heic和.heif扩展名都可以用于包含静态图像、动态图像、音频和其他多媒体内容的HEIF文件。这两种扩展名在功能和文件格式上没有区别，只是在命名上略有不同。通常情况下:

.heif扩展名用于表示包含多媒体内容的HEIF文件，如动态图像（例如，由多个图像帧组成的动态图像）或包含音频的HEIF文件。

.heic扩展名则更多地用于表示单个静态图像的HEIF文件。

HEIC图标相比PNG和JPEG格式

如果图像的内容具有较高的细节和颜色变化，或者存在大面积的纹理和细微的图像细节，HEIF格式可能实现更高的压缩率和更小的文件大小。然而，如果图像是简单的图形或颜色块，PNG格式可能会产生更小的文件。我尝试将截图转换成HEIC，发现比PNG文件小3/4左右!!

压缩比高，在相同的图片质量情况下，平比 JPEG 高两倍。

能增加如图片深度信息，透明通道等辅助图片。(苹果正是通过这个就能实现动态的调整图片的景深)。

支持存放多张图片，类似相册和集合。（实现多重曝光的效果）
支持多张图片实现 GIF 和 livePhoto 的动画效果。

无类似 JPEG 的最大像素限制。支持透明像素。分块加载机制。支持缩略图。

iOS 开发中的图标如果使用HEIC格式可以减小包体积，那么正确的姿势是什么呢？

二、`HEIC`在`iPhone`上的兼容性

首先我们需要了解HEIC在iPhone上的兼容性。

硬解码: A9 及以上芯片 iOS 设备（iPhone6s）
硬编码：iPhone 7及之后（A10芯片）
软解码：iOS 12及以后（官方说iOS11开始支持，但实测将Mac上的heic图片隔空投送到8plus是iOS 11不支持，iOS 12才支持）

/* 可以调用ImageI/O相关函数获取支持的图片编解码支持的格式，
* 这里值得注意的是，在iPhone6p，iOS11.0.4实测不支持HEIC，
  即调用CGImageSourceCopyTypeIdentifiers();查询可解码格式包含public.heic，依旧是无法正常显示出HEIC图片；
* 在iPhone6p，iOS12.5.6测试机上可以正常显示HEIC图片。*/
//获取所支持的图片格式数组,解码
CFArrayRef decodeArr = CGImageSourceCopyTypeIdentifiers();
NSArray *decodeUTI = (__bridge NSArray *)decodeArr;
NSLog(@"解码支持%@", decodeUTI);

//获取所支持的图片格式数组,编码
CFArrayRef encodeArr = CGImageDestinationCopyTypeIdentifiers();
NSArray *encodeUTI = (__bridge NSArray *)encodeArr;
NSLog(@"编码支持%@", encodeUTI);

对于iOS 11及以下的设备如何兼容？
如果你的APP需要支持iOS 11及以下，可以集成三方库来支持：
pod 'SDWebImageHEIFCoder', '~> 0.10.1’
或者使用HEICConverter。
可以比较HEIC替代PNG的收益和导入库的大小来决定是否采用HEIC；如果是网络图片需要支持HEIC，那么也可以导入三方库来支持。
如果APP是只适配iOS 12及以上，建议使用；如果是需要适配iOS 12以下，但网络资源想使用HEIC，那么也建议使用。

三、PNG图标如何转换成HEIC

1. 格式转换的方式网上有很多，我这边使用简单的方式：

选中PNG图右键“转换图像”	选择HEIF格式即可
选中要转换的PNG右键.png	转换图像选择HEIF格式.png

2. 转换后的文件大小与原先对比

首先我选择了13个大于30KB的APP里的图标

PNG图大小为2.1M	转换HEIF后500KB
PNG.png	HEIF.png

可以看到压缩后节省了大概3/4的空间。

再次选择了一些小于20KB的图标来转换

PNG图大小为26KB	转换HEIF后65KB
PNG小图标.png	HEIF.png

我们发现转换为HEIC后文件变大了，那么有什么特点呢？

如果图像的内容具有较高的细节和颜色变化，或者存在大面积的纹理和细微的图像细节，HEIF格式可能实现更高的压缩率和更小的文件大小。然而，如果图像是简单的图形或颜色块，PNG格式可能会产生更小的文件。

所以我们出现将小图标转换后更大的原因是小图标一般是“简单的图形或颜色块”。

3. 需使用原PNG转换

在实践中，发现将压缩过的且有透明度值的PNG图标转换为HEIC时，在低版本系统iOS12、iOS13上会出现图片透明度的地方显示为白色或绿幕；而iOS 14及以上是正常的。但是，如果把原图PNG图标转换为HEIC展示则是正常的。

iOS 12上显示.png

四、iOS开发中如何使用HEIC

1. 图片资源放在`Asset Catalog`中

在iOS开发中，图标一般会放在Bundle中或者Assets.xcassets, 这里是建议都放在Assets.xcassets中，因为首先这在APP Store能享受到APP Slicing，其次是可以享受到苹果官方的持续更新的压缩算法优化。

我们可以通过比对转换后的HEIC和PNG大小，选在文件更小的那个放入Assets.xcassets中

2. 使用.heic

使用时就跟PNG一样的写法:

let img = UIImage(named: "haha")

五、和webP的对比

常常拿来与 HEVC 来做对比的是 VP9。两者的性能相近，但是 VP9 是开源的，而 HEVC 是需要专利费的（ $2 每设备）。目前暂时没有通过 VP9 进行编码的图片，所以这里主要对比的是 webp 就是通过 VP8 进行编码的图片。

HEIF与WebP图片对比.png

压缩效率对比：heif 确实比 webp 压缩效率高 10-20%。

压缩效率对比.png
解码的消耗测试
用第一张 7.7 mb 的 jpeg 压缩后大小 1.1mb
jpeg 7.43 2.77 1.46 1.9 2.14 2.00 【占用率 6 %】
hevc 41.0 3.45 3.35 2.62 2.92 2.66 【占用率 6 %】
webp 216.6 216.8 217.5 261.9 195.2 【占用率 21 %】

解码时间.png

测试结果由于硬解码的支持，jpeg 和 hevc 解码速度和 CPU 占用率都比 webp 快和小很多，jpeg 和 hevc 不相伯仲，可见苹果内部对其优化也相当到位，才把它放到 iOS 中。