矢量图处理还是有小小问题

有一个图片，在iPhone5的内的宽是100，用autolayout，根据iPhone6和plus的宽度会放大一点点到150，那么对应的@3x图就不是3x了，而是更大的基于@1x再大概5x才对。

1x = 100x100
2x = 200x200
3x = 300x300

iPhone6 Plus内放大一些 1x = 150x150，那么图片的 3x = 450x450 才够，但xcode编译出来的3x是没有变化的，本以为用autolayout和size class，xcode就会自动处理一下的，毕竟我在iPhone6+上这个UIImageView是多大，用了autolayout之后xcode应该比我还要清楚。

assets里可以选 Bitmaps and Vectors ，可以手动指定@3x的图，但这样我还不如索性连2x的图也做了算了，用矢量图要导出PDF还要加Image set，间接也增加了工作量。

那么这种情况，Vector的意义就不大了，@3x我要另外做一张尺寸不一样的图片换上。

其实这种情况还是蛮多的，414和320的宽度比起来并不是差一点两点，很多图标按钮，图片资源都要重新布局调整大小，虽然大多情况下那些误差在真机上差别并不大，但还是很纠结这个@3x对于尺寸放大后的UIImageView来说，像素还是不够。

autolayout

Xcode

矢量

2 条回复 • 2014-10-12 15:43:11 +08:00

blank_dlh

2014-10-12 15:29:05 +08:00

Autolayout 是运行时来根据约束确定布局，而矢量资源是在编译时处理的。

这两天正好在看适配，也碰到了类似的问题，我的理解是 iPhone 6 的变化主要影响的是和宽度有关的元素。

矢量资源比较适用的是等比例的变化。比如界面上的 icon ，它在不同设备上的尺寸（pt）是一样的，所以可以直接用一套矢量资源。而对于 lz 提到的情况，在不同设备上的尺寸（pt）发生了变化，如果要保证清晰的话只能设计多套了。

blank_dlh

2014-10-12 15:43:11 +08:00

再举个例子，比如要给 NavigationBar 做个背景图（非 resizable），那么在这张图在不同设备上的分辨率是：
iPhone 6 Plus： 1242px * 192px
iPhone 6： 750px * 128px
iPhone 5 & iPhone 5s 等： 640px * 128px

在一个 Image Set 里面可以把 1242px * 192px 设置为 @3x ，750px * 128px 设置成 @2x，剩下的只能再建一个 Image Set。