@2x 為:for iPhone 6/5s/5/4s/4
@3x為:for iPhone6 plus
iOS各型号尺寸
類型 | 螢幕尺寸 | 顯示像素 | 需要倍數 | 切圖尺寸 | 命名規範 |
---|---|---|---|---|---|
iPhone6 plus | 414*736 | @3 | 1242×2208 | 5.5Retina HD | |
iPhone6 | 375*667 | @2 | 750×1334 | 4.7Retina HD | |
iPhone5 | 320*568 | @2 | 640×1136 | 4Retina HD | |
iPhone4 | 320*480 | @2 | 640×960 | 3.5Retina | |
iPhone3 | 320*480 | @1 | 320*480 | 3.5 |
AppIcon圖檔
可以使用線上移動圖示生成工具:圖示工場http://icon.wuruihong.com/網站自動生成iOS所需的所有對應格式的圖示
類型 | 桌面圖示 | 顯示像素 | 需要倍數 | 切圖尺寸 | 命名規範 |
---|---|---|---|---|---|
notification(iOS 7-10) | 推送通知圖示 | 20pt | 2x 3x | 40pt和60pt | [email protected],[email protected] |
spotlight(iOS5-6) | 手機搜尋 | 29pt | 2x 3x | 58pt和87pt | [email protected],[email protected] |
settings(iOS 5_10) | 設定頁面 | 29pt | 2x 3x | 58pt和87pt | [email protected],[email protected] |
spotlight(iOS7-10) | 搜尋 | 40pt | 2x 3x | 80pt和120pt | [email protected],[email protected] |
APP(iOS 7-10) | 桌面圖示 | 60pt | 2x 3x | 120pt和180pt | [email protected],[email protected] |
APP | 應用市場 | 1024 | APPIconForAppStore.png |
啟動圖檔設定
類型 | 橫豎屏 | 系統版本 | 螢幕尺寸 | 切圖尺寸 | 命名規範(1,表示第一個版本,P豎屏L橫屏) |
---|---|---|---|---|---|
iPhone6 plus | 豎屏 | iOS8,9 | RetinaHD5.5 | 1242×2208 | [email protected] |
iPhone6 | 豎屏 | iOS8,9 | RetinaHD4.7 | 750×1334 | [email protected] |
iPhone6 plus | 橫屏 | iOS8,9 | RetinaHD5.5 | 2208x1242 | [email protected] |
iPhone5/5 | 豎屏 | iOS7-9 | retina 4 | 640×1136 | [email protected] |
iPhone4/4s | 豎屏 | iOS7-9 | 2x | 640×960 | [email protected] |
iPad | 豎屏 | ios7-9 | 1x | 768×1024 | [email protected] |
iPad | 豎屏 | ios7-9 | 2x | 1536×2048 | [email protected] |
iPad | 橫屏 | ios7-9 | 1x | 1024×768 | [email protected] |
iPad | 橫屏 | ios7-9 | 2x | 2048×1536 | [email protected] |
圖檔命名規範
一個簡單的命名規範,作用就不說了~~~~
- 不要用拼音,盡量使用英文
- 下劃線 nav_right_back
- 注意區分倍圖@2x 和@3x 的字尾,不然效果差強人意
命名的組成部分:
邏輯闆塊(可由Tabbar來判斷,如果我:My),定位到哪一個頁面(personMessage),哪一個功能描述(比如說設定setting),狀态(選中,高亮,不可使用,正常狀态)
例:my_personMessage_setting_s 表示個人中心頁籤中的個人資訊中的設定圖示的選中狀态。
除此之外,就是對于一下公共的圖檔:
- 如果是整個項目都要用到的,就為pub_message,pub_nav_back(導航欄傳回按鈕)
- 如果是某個子產品要用到的,就為my_pub_message
這樣效果顯而易見了,當然在設計目錄結構的時候也一定按照相應的層次結構進行設計,千萬不要偷懶,放在同一級目錄裡,版本疊代多了後,你會哭的。