/*本文僅用于交流學(xué)習(xí)排苍，如果有誤，歡迎指正学密，共同進(jìn)步淘衙。轉(zhuǎn)載請(qǐng)注明出處。不用私信征求授權(quán)腻暮。
*/
UI布局彤守，要做的事情：顯示靜態(tài)和動(dòng)態(tài)的UI元素，靜態(tài)是將UI元素放在正確的位置哭靖，并且顯示出來具垫；動(dòng)態(tài)的含義就比較豐富一些：
（1）根據(jù)數(shù)據(jù)源的改變，動(dòng)態(tài)顯示不同的UI元素试幽，比如筝蚕，字體顏色變化，圖片的更換和隱藏抡草，動(dòng)態(tài)改變cell的高度饰及；還有，通常還要考慮數(shù)據(jù)源的兩個(gè)極端情況康震，太多和為空的情況燎含；
（2）不同屏幕和系統(tǒng)的適配，4s和4腿短，5以上的iPhone屏箍，ipad三種尺寸绘梦；不同尺寸的屏幕，顯示UI元素的位置和大小可能不一樣赴魁，iOS10消息推送的適配卸奉，iOS8ipad適配alertView等等；
（3）UI元素本身的動(dòng)畫和交互產(chǎn)生的動(dòng)畫颖御，比如榄棵，顯示分?jǐn)?shù)的水波動(dòng)畫，網(wǎng)易音樂播放器的圖片旋轉(zhuǎn)潘拱，360云盤下載圖片時(shí)的圖片歸集動(dòng)畫疹鳄，還有navBar的透明度變化效果，twitter的頭部下拉變大芦岂、知乎日?qǐng)?bào)也有這個(gè)效果等等瘪弓；
就單個(gè)頁面來說，每個(gè)頁面都是放在一個(gè)VC里面的禽最。常見的信息展示方式是：
1腺怯、tableView為界面的主導(dǎo)，比如聯(lián)系人列表川无，網(wǎng)易云音樂的音樂列表等等呛占，此類布局是tableView為主，可能會(huì)在tableView的某個(gè)部位增加按鈕什么舀透，如頂部增加數(shù)據(jù)源切換按鈕栓票，或者在右下角增加一個(gè)購物車按鈕之類，隨著tableView的滑動(dòng)愕够，固定在某個(gè)位置，當(dāng)然佛猛，也有不固定的時(shí)候惑芭；
2、在一般的VC的view中布局继找，零散布局遂跟，當(dāng)然，當(dāng)一個(gè)屏幕顯示不完所有信息的時(shí)候婴渡，可能會(huì)用scrollView幻锁。最常見的零散布局是登陸注冊(cè)頁。當(dāng)然边臼，如果頁面內(nèi)容太多哄尔，而且內(nèi)容變動(dòng)性可能比較大，更新頻率高柠并，還是做成web岭接，性價(jià)比高得多富拗，當(dāng)然，交互效果收到一定的影響鸣戴。
如果整個(gè)View要求在一屏內(nèi)展示所有內(nèi)容啃沪，零散布局時(shí)，需要首先確定整個(gè)界面的視圖重心窄锅，因?yàn)樵O(shè)備屏幕不一樣大创千，會(huì)變化，高矮胖瘦是不同的入偷。說白了追驴，就是單屏信息展示，UI布局要特別考慮一下屏幕適配問題盯串。在這樣的情況下氯檐，視圖重心是那些位置和高度不變或者變化小的UI元素組合。這部分固定了体捏，其他UI元素的適配是建立在這部分固定的UI布局基礎(chǔ)之上冠摄。視圖重心可以在頂部、中部几缭、底部河泳。比如，云音樂的iPhone端年栓，音樂播放界面拆挥，視圖重心應(yīng)該是底部曲目控制bar（列表、上一曲某抓、播放纸兔、下一曲等），這部分的高度相對(duì)固定否副，然后汉矿，在不同的屏幕上，動(dòng)態(tài)調(diào)整頂部和中部的UI元素大小及其間距备禀。
當(dāng)然洲拇，有的界面也沒有視圖重心，布局就是從上到下曲尸，每個(gè)UI控件都要考慮適配的問題赋续。
適配是個(gè)大問題，以后再說另患。
3纽乱、除了上面兩種UI布局情況，還有一種就是混合型的柴淘，規(guī)則化布局和零散布局混合迫淹，可能兩者之間占比不同秘通。規(guī)則化布局UI控制指tableView、collectionView這類敛熬；零散布局UI控件指label肺稀、imageView、button等应民。當(dāng)然话原，也會(huì)出現(xiàn)相互嵌套布局的情況，以App Store為例诲锹，精品推薦繁仁，根據(jù)觀察，可能是這樣的布局方式：主體是tableView归园，頭部是個(gè)圖片輪播器黄虱，實(shí)現(xiàn)方式很多不說了，下面的cell里面有app推薦和對(duì)應(yīng)的信息庸诱，要么是scrollView要么是collectionView展示捻浦，可以左右滑動(dòng)，就單個(gè)app推薦信息的View來說桥爽，內(nèi)部是零散布局朱灿。
4、在嘗試了frame钠四、約束（用的是Masonry）盗扒、autoresizing的布局和適配之后，我開始慌了缀去。因?yàn)槲覀児镜漠a(chǎn)品針對(duì)設(shè)備是Universal侣灶，沒有HD版本，所以缕碎，我面臨的問題是炫隶，適配iPhone 4S 、iPhone 5以上和iPad阎曹，目標(biāo)：
（1）寫最少的適配代碼；
（2）能在各個(gè)設(shè)備上正常跑起來煞檩。
用Masonry的時(shí)候处嫌，我以為約束就可以搞定一切設(shè)備了，實(shí)踐證明斟湃，我錯(cuò)了熏迹，另外在iPhone 4S的iOS 7上，踩坑踩的腳都腫了凝赛，看繃帶都還有血絲注暗。坛缕。。捆昏。赚楚。。不扯了骗卜，接著說宠页。
知己知彼，百戰(zhàn)不殆
先看下圖：
根據(jù)寬高比寇仓，可以將目前常見的蘋果設(shè)備分為三類：0.66举户，0.56，0.75遍烦。
讓我們高興的是俭嘁，目前蘋果新出的設(shè)備基本是等比縮放寬高，基本是0.56服猪。當(dāng)然供填，我這里沒有例舉出所有的蘋果（iOS）設(shè)備，其他的大家有興趣蔓姚，可以自己算算寬高比捕虽。
一句話：適配基于寬高比！
通用適配 = 特定的寬高比 + Masonry的約束 + 布局重心設(shè)計(jì)
// 待續(xù)......
