這是本文件的舊版!
iOS部分
- 所有檔案請以PNG格式輸出。
- 1x/2x/3x的三種檔案的檔名以及尺寸需有連鎖關係,同一張圖檔:
- 1.檔名: abc.png abc@2x.png abc@3x.png 只能使用英文、數字,且不可以有任意兩個檔案名稱重複。建議一律採用小寫英文檔名。
- 2.尺寸: abc.png(50Wx50H) abc@2x.png(100Wx100H) abc@3x.png(150Wx150H)
- 主程式Icon: 需為PNG 1024Wx1024H的格式,且沒有Alpha或者透明層以及不用切圓角。
- 歡迎頁(Launch Image): 即裝置的全螢幕尺寸,有多種款式,請參考Apple官方說明
- 所有檔案請依照1x、2x、3x、示意圖、主程式Icon分成四個大目錄,底下再包含個功能的分類子目錄,以下圖為範例:
- 格式的補充資料: Apple官方文件:Icon and Image Sizes
- 若是有底圖的按鈕,請切出底圖即可,但是請提示上方的文字Size以及字型。
- 歡迎頁上面若有多種元素,不用分別切開,直接提供一整張跟示意圖一樣的圖檔即可。
- 切圖時,圖片周圍的透空色區域越小越好。
- 除非特殊情況,所使用的字型務必使用iOS所支援的字型:
- iOS Device Size:
iPhone:
iPad:
- navigation bar(上圖綠色部分)與status bar(上圖紅色部分)部分,在iOS6是無法更換status bar的background image,只能改變顏色(需要色碼)。但在iOS7之後,navigation bar與status bar是連為一體的,故可以放置background image。因此在設計iOS7的navigation bar background image時需注意尺寸為44+20=64H(1x),而設計iOS6之前的navigation bar background image時只需要44H(1x)就好。
- navigation bar上的標題是可以不放文字放圖片的,但不論iOS7或iOS6均須符合44H的限制。
- 設計iOS7的Navigation bar時可不包含Status bar,這時候只需44H(1x)的圖就好,整個版面部分也可以算成延長20H。
- 參考文章:iOS Device Sizes
Android
Android上是以dpi(dots per inch)為單位計算螢幕大小, 依照dpi可分為幾種尺寸
- ldpi (low) ~120dpi
- mdpi (medium) ~160dpi
- hdpi (high) ~240dpi
- xhdpi (extra-high) ~320dpi
- xxhdpi (extra-extra-high) ~480dpi
目前市面上常見的尺寸為
- ldpi (low) - 240×320 pixels
- mdpi (medium) - 320×480 pixels
- hdpi (high) - 480×800 pixels
- xhdpi (extra-high) - 720×1280 pixels
- xxhdpi (extra-extra-high) - 1080×1920 pixels
在Android內coding時採用dp(Density Independent Pixels)此種虛擬的解析度單位來方便dpi和pixels之間的換算, 當螢幕為mdpi的時候, 1px = 1dp, 所以用mdpi的160dpi為基準, 則換算公式為:
px = dp * (dpi / 160)
以此計算倍率為下圖, 而xxhdpi為3.0x
所以建議的做法是, 先在mdip上確定了圖片的位置大小和效果都是你所想要的, 在用倍率乘上去就可以算出各種不同解析度所要的圖片大小, 例如圖片的啓動icon:
- 36×36 (0.75x) for low-density
- 48×48 (1.0x baseline) for medium-density
- 72×72 (1.5x) for high-density
- 96×96 (2.0x) for extra-high-density
- 144×144 (3.0x) for extra-extra-high-density
- 192×192 (4.0x) for extra-extra-extra-high-density (launcher icon only; see note above)
檔案命名規則: 小寫a-z, 0-9, 不能包含特殊符號($%#^等等), 空白, 建議命名規則:ic_launcher