什麼是二倍圖、三倍圖?

二倍圖、三倍圖是什麼?它們(在iPhone上)的顯示原理是什麼?


比如你需要一個30pt*30pt的圖標,那麼這時你就需要跟美工(美術工程師)要三個文件:
一個是30px*30px的PNG圖片,用原名來命名即可,例如sample.png。
一個是60px*60px的PNG圖片,這個要用原名@2x來命名,例如sample@2x.png。
一個是90px*90px的PNG圖片,這個要用原名@3x來命名,例如sample@3x.png。
這樣把這三張圖片導入進工程,你會神奇地發現,這三個文件居然會被iOS統一識別為sample.png,用的時候只需要[UIImage imageNamed:@"sample"]就行了。
那麼講一下應用場景。
1x的圖標用於1:1的屏幕,非視網膜屏,例如iPhone 3GS、(/*20140414DEL*/ //早期iPhone 4、感謝 @池谷湧 指正)非視網膜屏的眾多iPad等。
2x的圖標用於1:2的屏幕,大部分視網膜屏,機型如(/*20140414ADD*/ iPhone 4、)iPhone 4S、iPhone 5、iPhone 5s、iPhone 6、iPad with Retina及後續的視網膜屏iPad等。
3x的圖標目前應用於1:3的屏幕,即iPhone 6Plus,這個就比較特殊了,因為蘋果為了方便開發者,想出來一個簡便的實現方案,將2208*1242解析度的圖像壓縮輸出在1920*1080的屏幕上。


怎麼使用大神求回答


推薦閱讀:

學的是設計師,做的是小美工?
玄關隔斷什麼樣的好?
在知乎怎麼找「受關注最多的問題」、「回答次數最多的問題」、「評論最多的問題」?
如何做出 Photoshop CC 2017 啟動畫面的效果?
無印良品muji在上海有類似muji house做裝修設計的部門嗎?

TAG:網頁設計 | 前端開發 | 設計 | iOS開發 | 視覺設計 |