❶ 切圖常說的@1X@2X@3X是什麼意思
蘋果IOS程序開發不同解析度的設備統一為一個尺寸而標記的。@3X就是@1X解析度的3倍。
iPad2 是768 x 1024,iPad Retina 是1536 x 2048,開發時都按 768 * 1024 操作。但實際上兩者有一倍差異。為了達到最佳效果,使用的圖片大小不一樣。這時候就用同一個名稱,但 Retina 的圖加上 @2x 後綴。系統載入圖片時,在 iPad2 上會載入 @1x 的圖在 1536 * 2048 的設備上,會載入 @2x 的。@3x 現在用於 iPhone 6/6+ 上。
附帶一提:iOS8渲染操作中使用前綴帶有@1x、@2x 和@3x 的測試圖像,代碼會優先載入3x 圖像。@2x圖像不被載入。使用圖像文件和XCAsset均不行。
❷ APP切圖詳細規范終極指南2020
我們都知道一套完整的 App 通常會有很多張切圖,不管是 iPhone 需要 1x、2x、3x 圖檔,Android 需要至少 3 種 hdpi、xhdpi、xxhdpi。在龐大的切圖數穗豎舉量下如何讓負責套圖的 RD 快速找到所需圖檔纖卜,檔名的命令方式就需要雙方統一格式方便大家作業。所以,制定一套非常有效而方便的APP切圖命名規范非常有用的。
目前iPhone有10種型號,5種屏幕尺寸,再加上6plus的「降采樣」(Downsampling)(1080-1920),還有iPhone6和6+上的放大模式(1125-2001)和默認模式(1242-2208),是不是感覺好恐怖?但是不用怕,我分享一套超簡單的適配方法,看完你都不信有這么簡單~
UI交付給開發的資料有
開發看到這份標注圖,可以自己用上面的數字,乘以1.5得出3X的數字。
iOS圖標尺寸: https://developer.apple.com/ios/human-interface-guidelines/graphics/app-icon/
iPhone Portrait iOS 8,9-Retina HD 5.5 (1242×2208) @3x
iPhone Portrait iOS 8,9-Retina HD 4.7 (750×1334) @2x
iPhone Portrait iOS 7,9-2x (640×960) @2x
iPhone Portrait iOS 7,9-Retina 4 (640×1136) @2x
iPhone Portrait iOS 5,6-1x (320×480) @1x
iPhone Portrait iOS 5,6-2x (640×960) @2x
iPhone Portrait iOS 5,6-Retina4 (640×1136) @2x
LaunchImage:
android: 720 1280
iOS:( 2020年6月30日後強制全部使用LaunchScreen.storyboard顯示啟動閃屏*)
750x1334 iPhone 8
基本上 App 的切圖可分為下面幾大類:
背景、按鈕、圖示、圖片、照片、TabBar icon 等。
為了讓切圖便於管理,通常會依圖片性質命名。例如 bg-xxx.png、btn-xxx.png、img-xxx.png、tab-xxx.png。當圖檔要做給 Retina 屏幕使用時,只要在文檔名前加上「@2x」猜碧就可以了。如[email protected]、[email protected] 、[email protected]。在命名時 bg-xxx.png 中間的 – 可以改為 _ 。
iOS 上寫 Desktop icon 檔案命名使用 -,如果切圖只給 iOS 使用,可以和 iOS 採用相同的命名方式。請注意 Android 不支援 - 的命名方式,如果圖檔要運用在 Android 上,請把所有的 - 改成 _ 底線。最好不要把數字或符號當成檔名的開頭,如 3-icon.png 、+abc.png之類。
前綴是一種簡單記憶、節約成本的純文本標記語言,使用前綴能快速知道切圖是用作那一組件類別,好的前綴也無非就以下幾種:
後綴一般是來表示切圖的顏色、透明度、狀態等信息:
通過上述介紹,一般遇到的情況也就這么一些,只需要按照前綴+位置用途+後綴就差不多了,這里列舉一些比較好的命名:
1、畫布大小定位 720 x 1280 或 1080 x 1920,72 dpi等;
2、只使用偶數單位的尺寸,比如 96 px 的列表項高度,16 px 的邊距,64 px 的圖標邊長;
3、只使用偶數單位 24 pt,28 pt,36 pt等字體大小;
4、設計完成以後,所有尺寸的 px 值除以 2(需要約定的倍數) 作為 dp 數值交給工程師;
5、所有字體的 pt 值除以 2 (需要約定的倍數)作為 sp 數值交給工程師;
6、所有切圖變成三份,分別是原始大小、縮小 1.5 倍,縮小 2 倍,分別作為 xhdpi,hdpi,mdpi 的資源交給工程師;
只需要全局標出共用字體即可,特殊字體特殊標注。
顏色值一般使用十六進製表示,如 #FFFFFF, #90FFFFFF 其中90兩位代表透明度。透明度計算:
225∗透明度百分比轉16進制
FF 代表不透明,7F代表半透明,00代表不透明
https://help.apple.com/app-store-connect/#/devd274dd925
❸ 安卓/ios中,app設計時常見的尺寸有哪些
大家都知道手機採用的:一個是蘋果的iOS系統,另一個就是谷歌公司的安卓系統。華為的鴻蒙系統雖然早就上線,但是還沒有真正運用在手機移動端上,小阿在這里期待著,希望有一天也能寫「華為『鴻蒙系統』的界面尺寸規范。」
這兩者之間有一個明顯的區別就是iOS系統是非開源的,簡單來說就是不能別隨意改動的,連圖標都是必須帶圓角的,對交互設計師很友好的。
主標題的字體大小設置一般是32-36左右,加粗居中。列表中的文字就要小一些,字體大小為30,不會加粗。輔助性字體大小一般24-26。說明文字一般不會小於22,最小設置為20,再小就看不到啦。
另外需要注意的一點是所有的字型大小設置都必須為偶數,上下級內容字型大小極差關系為2-4號。