研發gg表示蛋疼。。。(根本是庫克沒調研清楚,小道訊息說iphone8又要回歸4寸屏)
由於經驗不足,發版過程介面適配bug一直反覆。為了將來不再受制於介面適配影響工作進度,總結5.0的經驗之後,今天手雷ios小夥伴們坐下來一起定製了這份ui規範。
以iphone6為標準,對iphone其他解析度,制定了不同型別的適配方案。
首先了解iphone主流裝置:
將控制項分為這幾類:
一、文字流
文字流控制項定義了一種方案: 1、
字型大小、行高都不變; 2、
行數,是否定行需看具體內容; 3、
控制項整體以iphone6為標準,進行等比縮放。iphone6在此基礎上乘以1.10倍,iphone5在此基礎上除以1.17。
二、彈性控制項
方法一:控制項不變、間距變;
(如**底部導航)
方法二:間距不變,縮放控制項;
(如手雷輪播圖下四個入口)
(家裡打不開store,無法截圖 /(ㄒoㄒ)/~~)
三種方案中,方案一最適合手雷這個產品,方案二為輔助。
方案三目前沒用,最為備選。
三、
方案二:小圖,則進行等比縮放。以iphone6為標準,進行等比縮放。iphone6在此基礎上乘以1.10倍,iphone5在此基礎上除以1.17。
四、兩種控制項疊加
後三種情況,在很多同行分享的部落格上並沒有提到,或許他們籠統的歸納到前三種之中,但我們還是覺得需要單獨定義。
兩種控制項疊加的情況就要分視覺設計來分類了:
若與上層控制項與底部密切關聯較強,就可按等比的方案來操作。
(手雷「熱門資源」模組中的疊加效果)
若關聯性不夠強,則可以上層控制項大小不變,間距也不變而僅縮放下層控制項。
(搜尋中的圖示沒變,輸入框等比拉伸)
五、table view
1、左右固定; 2、
中間拉伸; 3、
高度不變;
(手雷我的首頁list)
六、模組間
保持模組間高度不變,不需要過多處理。
團隊總結的適配方案,總結出來當分享了
參考文獻:
iphone 6 / 6 plus 出現後,如何改進工作流以實現乙份設計稿支援多個尺寸?
iOS多裝置解析度適配
1 選擇一種尺寸作為設計和開發基準 2 定義一套適配規則,自動適配剩下兩種尺寸 3 特殊適配效果給出設計效果。第一步,視覺設計階段,設計師按寬度750px iphone 6 做設計稿,除外所有設計元素用向量路徑來做。設計定稿後在750px的設計稿上做標註,輸出標註圖。同時等比放大1.5倍生成寬度11...
iOS各種裝置資訊獲取總結
這個方法後面會列出來 nsstring devicename self getdevicename nslog 裝置型號 devicename nsstring iphonename uidevice currentdevice name nslog iphone名稱 iphonename cgfl...
IOs裝置解析度總結
在做ios裝置解析度適配的過程中,尋找裝置配置花費了很多不必要的時間,因此把成果記錄下來,供以後使用,也是讓後來者不必像我一樣花費那麼多時間。型號尺寸 邏輯解析度 物理解析度 渲染解析度 倍素iphone 3.5320x480 320x480 1xiphone 3g 3gs 3.5320x480 3...