iOS开发中PDF矢量素材代替@Nx素材使用

Problem

面对iOS手机不同的分辨率,Xcode很早推出了让同一图片使用@1x, @2x 出iPhone6Plus系列后还有 @3x 来针对不同分辨率将图片分成不同缩放比例的解决办法,但往往一个项目堆积了大量@1x,@2x,@3x图片,让图片资源管理起来相当麻烦,并且针对一个特定的iOS设备使用对应size的素材,而其它不同尺寸的素材都算白白占用了App容量.

Solution

现在Xcode 6以上, 就支持在Asset catalog使用PDF矢量图片来代替原来的不同分辨率的图片.
原来素材图标都是这样

iOS开发中PDF矢量素材代替@Nx素材使用_第1张图片
1

现在素材图标可以是这样的
iOS开发中PDF矢量素材代替@Nx素材使用_第2张图片
2

Begin

首先制作矢量图标,然后用默认的原始尺寸以PDF的格式将图标导出.

iOS开发中PDF矢量素材代替@Nx素材使用_第3张图片
3

然后选择Xcode的指定工程的Assets,将矢量图标直接拖入资源列表中

iOS开发中PDF矢量素材代替@Nx素材使用_第4张图片
4

选中这个刚添加的imageAsset,然后选择Xcode右边工具栏的"Show Attributes inspector",设置Scale Factor
参数选择为 Single Vector

iOS开发中PDF矢量素材代替@Nx素材使用_第5张图片
5

然后该imageAsset就变成了这样


iOS开发中PDF矢量素材代替@Nx素材使用_第6张图片
6

最后将pdf图标拖到所空出来的矩形区域内, 就over了! 剩下的事就交Xcode了.

iOS开发中PDF矢量素材代替@Nx素材使用_第7张图片
2

End

这样之后不论是在IB使用该icon, 还是代码中获取,图片的尺寸都和之前的方式一样 let icon = UIImage(named: "star")
系统就会在编译期间根据设备来自动缩放成适合的矢量位图,这样就算iOS以后有了要求4x图标尺寸也不用担心了,直接一张PDF矢量图标就能代替那些1x, 2x, 3x…Nx相同内容的素材, 也不用管理相同内容却不同尺寸的图片, 极大了提高了生产力.

你可能感兴趣的:(iOS开发中PDF矢量素材代替@Nx素材使用)