ios適配方法

首先要了解到容劳,iPhone6與iPhone6plus的加入辉词,ios適配的難度變大必孤,很多人都不明白具體用多少分辨率去設(shè)計,如何最快捷的適配全部尺寸瑞躺。
下面我來講解一下我的理解敷搪,可能會和各位的想法有沖突,不喜勿噴幢哨。先給大家看一組IOS尺寸規(guī)范购啄。


先說說我的理解,IOS界面設(shè)計嘱么,不應(yīng)該一味的去考慮iPhone的分辨率(這就是蘋果的聰明之處)狮含,而是控件的大小和清晰度,因為控件尺寸規(guī)范官方給定了曼振,也是整個app里面一成不變的東西几迄!舉個例子,iPhone5s和iPhone6分辨率分別是:640x1136冰评、750x1334映胁,但是控件規(guī)范尺寸卻都是一樣的!抓住一點:我們做UI甲雅,是要保持控件的清晰度解孙!非控件大部分都是數(shù)據(jù)內(nèi)容,內(nèi)容的話抛人,我們只要標注“距屏幕邊緣xx像素弛姜,距頂部xx像素,字號多少”就可以了妖枚,然后交給程序猿就不干我們毛事了廷臼,autolayout會自動拉伸布局。

iPhone5s和iPhone6,分辨率不一樣但是控件大小是一樣的荠商,那多余的部分去哪里了寂恬?看藍色標注,沒錯莱没!多余的像素空出來了3跞狻!不要被640饰躲、750這樣的數(shù)值所誤解牙咏,分辨率再怎么變控件尺寸規(guī)范是固定的!iPhone6的屏幕尺寸比iPhone5s大属铁,顯示的內(nèi)容自然就多了眠寿,但是僅僅是多了躬翁,尺寸規(guī)范還是iPhone5s的規(guī)范焦蘑!那設(shè)計的時候用640還是750的?這個都不重要盒发,只要遵循官方的尺寸規(guī)范就行例嘱。當然了我個人還是比較喜歡640,習(xí)慣宁舰。
看完iPhone5s和iPhone6的拼卵,下面看iPhone6 Plus的,在xcode中iPhone6 Plus的分辨率是1242x2208蛮艰,所以需要適配iPhone Plus要用1242x2208下的尺寸規(guī)范才會有物理尺寸和老人版腋腮,還是按照上面的理解,咱們不看分辨率壤蚜,咱們只看控件尺寸規(guī)范即寡!拿導(dǎo)航欄高度來說(這也是為什么規(guī)范里不會出現(xiàn)寬度,因為寬度隨著拉伸填充空白袜刷,而非寬高等比縮放)iPhone5s聪富、6的是88px(@2x),iPhone6 Plus的是132px(@3x)著蟹,iPhone6 plus尺寸規(guī)范其實就是iPhone5s墩蔓、6設(shè)備的1.5倍(@2x和@3x命名也很直接)!那么假設(shè)我用640分辨率的萧豆,設(shè)計完了奸披,直接圖像大小調(diào)到640x1.5=960,然后分別導(dǎo)出切圖涮雷。有人會說源内,小到大像素會糊掉。天,你們做UI的時候真的不用多邊形矢量工具和智能圖層嗎膜钓?勾選“對齊邊緣”和使用“像素貼合”插件(下面提供下載)嗽交,要是這樣邊緣都糊掉了你來罵我!

放大后颂斜,雖然多邊形的框偏移了夫壁,但是在“對齊邊緣”和“像素貼合”插件作用下沒有出現(xiàn)毛邊!其實只要保證官方給出的尺寸規(guī)范正確就行了沃疮,管他分辨率多少盒让,不是嗎?因為這個是ios司蔬,安卓請無視邑茄。。即使最后分辨率是960俊啼,但是這個不重要肺缕,重要的是切圖的素材尺寸對了就行。因為尺寸規(guī)范高是固定的授帕,要是像變成1224的同木,拉一拉留點空、填充點內(nèi)容不就可以了跛十?控件大小不影響的彤路。
總結(jié): 只要按照官方給出的尺寸規(guī)范,不要去管設(shè)備的分辨率芥映,即使你用500x500這樣奇葩的分辨率洲尊,只要把狀態(tài)欄設(shè)定成40導(dǎo)航欄設(shè)定成88然后切圖,同樣是可以適配的奈偏,因為APP適配要的是零散的切圖素材坞嘀,正確的分辨率單純的只是為了視覺美觀。
講到這里霎苗,你還在糾結(jié)到底用多少分辨率的設(shè)計圖嗎姆吭?還在糾結(jié)怎么去適配ios?其實蘋果設(shè)計團隊都已經(jīng)考慮好了唁盏。規(guī)范既然有内狸,遵循規(guī)范必定事半功倍,而不是分辨率厘擂。

http://www.ui.cn/detail/52425.html

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末昆淡,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子刽严,更是在濱河造成了極大的恐慌昂灵,老刑警劉巖,帶你破解...
    沈念sama閱讀 222,464評論 6 517
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異眨补,居然都是意外死亡管削,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 95,033評論 3 399
  • 文/潘曉璐 我一進店門撑螺,熙熙樓的掌柜王于貴愁眉苦臉地迎上來含思,“玉大人,你說我怎么就攤上這事甘晤『耍” “怎么了?”我有些...
    開封第一講書人閱讀 169,078評論 0 362
  • 文/不壞的土叔 我叫張陵线婚,是天一觀的道長遏弱。 經(jīng)常有香客問我,道長塞弊,這世上最難降的妖魔是什么漱逸? 我笑而不...
    開封第一講書人閱讀 59,979評論 1 299
  • 正文 為了忘掉前任,我火速辦了婚禮居砖,結(jié)果婚禮上虹脯,老公的妹妹穿的比我還像新娘驴娃。我一直安慰自己奏候,他們只是感情好,可當我...
    茶點故事閱讀 69,001評論 6 398
  • 文/花漫 我一把揭開白布唇敞。 她就那樣靜靜地躺著蔗草,像睡著了一般。 火紅的嫁衣襯著肌膚如雪疆柔。 梳的紋絲不亂的頭發(fā)上咒精,一...
    開封第一講書人閱讀 52,584評論 1 312
  • 那天,我揣著相機與錄音旷档,去河邊找鬼模叙。 笑死,一個胖子當著我的面吹牛鞋屈,可吹牛的內(nèi)容都是我干的范咨。 我是一名探鬼主播,決...
    沈念sama閱讀 41,085評論 3 422
  • 文/蒼蘭香墨 我猛地睜開眼厂庇,長吁一口氣:“原來是場噩夢啊……” “哼渠啊!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起权旷,我...
    開封第一講書人閱讀 40,023評論 0 277
  • 序言:老撾萬榮一對情侶失蹤替蛉,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體躲查,經(jīng)...
    沈念sama閱讀 46,555評論 1 319
  • 正文 獨居荒郊野嶺守林人離奇死亡它浅,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 38,626評論 3 342
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了镣煮。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片罚缕。...
    茶點故事閱讀 40,769評論 1 353
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖怎静,靈堂內(nèi)的尸體忽然破棺而出邮弹,到底是詐尸還是另有隱情,我是刑警寧澤蚓聘,帶...
    沈念sama閱讀 36,439評論 5 351
  • 正文 年R本政府宣布腌乡,位于F島的核電站,受9級特大地震影響夜牡,放射性物質(zhì)發(fā)生泄漏与纽。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 42,115評論 3 335
  • 文/蒙蒙 一塘装、第九天 我趴在偏房一處隱蔽的房頂上張望急迂。 院中可真熱鬧,春花似錦蹦肴、人聲如沸僚碎。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,601評論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽勺阐。三九已至,卻和暖如春矛双,著一層夾襖步出監(jiān)牢的瞬間渊抽,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,702評論 1 274
  • 我被黑心中介騙來泰國打工议忽, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留懒闷,地道東北人。 一個月前我還...
    沈念sama閱讀 49,191評論 3 378
  • 正文 我出身青樓栈幸,卻偏偏與公主長得像愤估,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子侦镇,可洞房花燭夜當晚...
    茶點故事閱讀 45,781評論 2 361

推薦閱讀更多精彩內(nèi)容