V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
iOS 开发实用技术导航
NSHipster 中文版
http://nshipster.cn/
cocos2d 开源 2D 游戏引擎
http://www.cocos2d-iphone.org/
CocoaPods
http://cocoapods.org/
Google Analytics for Mobile 统计解决方案
http://code.google.com/mobile/analytics/
WWDC
https://developer.apple.com/wwdc/
Design Guides and Resources
https://developer.apple.com/design/
Transcripts of WWDC sessions
http://asciiwwdc.com
Cocoa with Love
http://cocoawithlove.com/
Cocoa Dev Central
http://cocoadevcentral.com/
NSHipster
http://nshipster.com/
Style Guides
Google Objective-C Style Guide
NYTimes Objective-C Style Guide
Useful Tools and Services
Charles Web Debugging Proxy
Smore
yellowV2ex
V2EX  ›  iDev

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

  •  
  •   yellowV2ex · 2014-10-12 14:56:59 +08:00 · 2731 次点击
    这是一个创建于 3701 天前的主题,其中的信息可能已经有所发展或是发生改变。
    有一个图片,在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来说,像素还是不够。
    2 条回复    2014-10-12 15:43:11 +08:00
    blank_dlh
        1
    blank_dlh  
       2014-10-12 15:29:05 +08:00
    Autolayout 是运行时来根据约束确定布局,而矢量资源是在编译时处理的。

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

    矢量资源比较适用的是等比例的变化。比如界面上的 icon ,它在不同设备上的尺寸(pt)是一样的,所以可以直接用一套矢量资源。而对于 lz 提到的情况,在不同设备上的尺寸(pt)发生了变化,如果要保证清晰的话只能设计多套了。
    blank_dlh
        2
    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。
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2710 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 22ms · UTC 05:32 · PVG 13:32 · LAX 21:32 · JFK 00:32
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.