最近準(zhǔn)備面試，坐地鐵的時候突然想到之前一個問題埋酬，三張圖片等間距適配保證不拉伸哨啃，瞬間沒了思路，果斷回來復(fù)習(xí)写妥；
適配的套路主要分為三種：Monsary代碼拳球、AutoLayout+SizeClass、計算比例
還有之前看的關(guān)于適配的原理：本質(zhì)是一個線性公式珍特，具體什么樣子還是要自己親自探索
雖然花時間祝峻，但是一定要記住，只有在追尋的過程中逐漸打好根基才不會以后每次都得翻著看
首先明白一點：
1.渲染像素--屏幕截圖的圖片尺寸扎筒，單位px
2.邏輯像素--程序員開發(fā)所用尺寸莱找，單位pt
3.倍率--渲染像素/邏輯像素，得到倍數(shù)關(guān)系嗜桌。常見倍率@2x,@3x
先來看看新出的XS奥溺、XS Max、XR吧骨宠，看到這三個詞只能想到安全距離+判斷來進(jìn)行適配浮定，可是代碼早都忘的一干二凈了！２阋凇桦卒！
大概還記得之前上面是44+20points，下面是49points吧匿又，現(xiàn)在X系列下面多了34points 變?yōu)?3points方灾，看下圖
判斷的一種方式是采用宏：
// 判斷是否是
ipad
#define isPad ([[UIDevice currentDevice] userInterfaceIdiom] == UIUserInterfaceIdiomPad)
// 判斷iPhone4系列
#define kiPhone4 ([UIScreen instancesRespondToSelector:@selector(currentMode)] ? CGSizeEqualToSize(CGSizeMake(640, 960), [[UIScreen mainScreen] currentMode].size) && !isPad : NO)
// 判斷iPhone5系列
#define kiPhone5 ([UIScreen instancesRespondToSelector:@selector(currentMode)] ? CGSizeEqualToSize(CGSizeMake(640, 1136), [[UIScreen mainScreen] currentMode].size) && !isPad : NO)
// 判斷iPhone6系列
#define kiPhone6 ([UIScreen instancesRespondToSelector:@selector(currentMode)] ? CGSizeEqualToSize(CGSizeMake(750, 1334), [[UIScreen mainScreen] currentMode].size) && !isPad : NO)
//判斷iphone6+系列
#define kiPhone6Plus ([UIScreen instancesRespondToSelector:@selector(currentMode)] ? CGSizeEqualToSize(CGSizeMake(1242, 2208), [[UIScreen mainScreen] currentMode].size) && !isPad : NO)
// 判斷iPhoneX
#define IS_IPHONE_X ([UIScreen instancesRespondToSelector:@selector(currentMode)] ? CGSizeEqualToSize(CGSizeMake(1125, 2436), [[UIScreen mainScreen] currentMode].size) && !isPad : NO)
// 判斷iPHoneXr（注：真機(jī)為750x1624，模擬器828x1792）
#define IS_IPHONE_Xr ([UIScreen instancesRespondToSelector:@selector(currentMode)] ? CGSizeEqualToSize(CGSizeMake(828, 1792), [[UIScreen mainScreen] currentMode].size) && !isPad : NO)
// 判斷iPhoneXs
#define IS_IPHONE_Xs ([UIScreen instancesRespondToSelector:@selector(currentMode)] ? CGSizeEqualToSize(CGSizeMake(1125, 2436), [[UIScreen mainScreen] currentMode].size) && !isPad : NO)
// 判斷iPhoneXs Max
#define IS_IPHONE_Xs_Max ([UIScreen instancesRespondToSelector:@selector(currentMode)] ? CGSizeEqualToSize(CGSizeMake(1242, 2688), [[UIScreen mainScreen] currentMode].size) && !isPad : NO)
#define Height_StatusBar ((IS_IPHONE_X == YES || IS_IPHONE_Xr == YES || IS_IPHONE_Xs == YES || IS_IPHONE_Xs_Max == YES) ? 44.0 : 20.0)
#define Height_NavBar ((IS_IPHONE_X == YES || IS_IPHONE_Xr == YES || IS_IPHONE_Xs == YES || IS_IPHONE_Xs_Max == YES) ? 88.0 : 64.0)
#define Height_TabBar ((IS_IPHONE_X == YES || IS_IPHONE_Xr == YES || IS_IPHONE_Xs == YES || IS_IPHONE_Xs_Max == YES) ? 83.0 : 49.0)
（注：宏來自http://www.reibang.com/p/3e010551f5f1）
以下為機(jī)型分布表：（PPI為分辨率平方后相加然后開平方,比如800×480分辨率那就是√8002+4802開根號/屏幕尺寸）
接著就是字體適配了：
for (UIView *view in viewLayout.subviews) {
CGRect returnRect;
returnRect.size.width = ADAPTATION_WIDTH(view.frame.size.width);
returnRect.size.height = ADAPTATION_HEIGHT(view.frame.size.height);
returnRect.origin.x = ADAPTATION_WIDTH(view.frame.origin.x);
returnRect.origin.y = ADAPTATION_HEIGHT(view.frame.origin.y);
if ([view isKindOfClass:[UIImageView class]] && view.frame.size.width == view.frame.size.height) {
returnRect.origin.y = ADAPTATION_HEIGHT(view.frame.origin.y) + (ADAPTATION_HEIGHT(view.frame.size.height) - ADAPTATION_WIDTH(view.frame.size.height)) / 2.0;
returnRect.size.width = ADAPTATION_WIDTH(view.frame.size.width);
returnRect.size.height = ADAPTATION_WIDTH(view.frame.size.width);
}
view.frame = returnRect;
if ([view isKindOfClass:[UITextField class]]) {
UITextField *viewField = (UITextField *)view;
CGFloat fontSize = viewField.font.pointSize;
NSString *fontName = viewField.font.fontName;
viewField.font = [UIFont fontWithName:fontName? size:(ADAPTATION_WIDTH(fontSize))];
}else if ([view isKindOfClass:[UILabel class]]){
UILabel *viewLabel = (UILabel *)view;
CGFloat fontSize = viewLabel.font.pointSize;
NSString *fontName = viewLabel.font.fontName;
viewLabel.font = [UIFont fontWithName:fontName? size:(ADAPTATION_WIDTH(fontSize))];
}else if ([view isKindOfClass:[UIButton class]]){
UIButton *viewButton = (UIButton *)view;
CGFloat fontSize = viewButton.titleLabel.font.pointSize;
NSString *fontName = viewButton.titleLabel.font.fontName;
viewButton.titleLabel.font = [UIFont fontWithName:fontName? size:(ADAPTATION_WIDTH(fontSize))];
}
}
啟動圖的適配
如果用的是LaunchScreen.storyboard就不需要考慮,如果是LaunchImage啟動圖那么需要準(zhǔn)備正確的啟動圖,注意XR使用的@2x的圖
適配x系列主要是對頂部導(dǎo)航欄+狀態(tài)欄 和底部的距離適配 x系列的狀態(tài)欄是44其他的是20
底部的其他為0 x系列底部要預(yù)留25像素
那么我們根據(jù)設(shè)備判斷是否是x系列然后做相應(yīng)操作
剛發(fā)布的三款新iPhone包括兩款OLED屏幕的iPhone XS和iPhone XS
Max琳省，屏幕尺寸分別為5.8英寸（分辨率為1125*2436）和6.5英寸（分辨率為1242*2688）迎吵，第三款設(shè)備是iPhone
XR躲撰，配備6.1英寸LCD液晶屏（分辨率為828*1792）。三款新iPhone均采用“劉海屏”+Face ID設(shè)計击费，搭載了蘋果A12處理器
設(shè)計如何進(jìn)行適配拢蛋？該使用幾倍圖？
大家最關(guān)心的應(yīng)該就是如何進(jìn)行新機(jī)型的適配了蔫巩，目前在我們設(shè)計界面時谆棱，最主流的方式是基于iPhone8（分辨率750*1334）來進(jìn)行設(shè)計，以@2x為基準(zhǔn)做設(shè)計稿圆仔，然后提供@2x垃瞧、@3x的切圖給到開發(fā)人員。手機(jī)適配采用幾倍圖與PPI有關(guān)系坪郭，也就是像素密度个从，所以我們可以理解為什么iPhone4、5歪沃、6之間分辨率和屏幕尺寸不一樣嗦锐，但是同樣采用@2x二倍圖的原因，是因為它們有同樣的PPI（326ppi）沪曙；
新發(fā)布的5.8英寸的iPhoneXS（458ppi）奕污，分辨率為1125*2436px，與iPhoneX（三倍圖）的數(shù)據(jù)是一致的液走，所以我們可以得出iPhoneXS也是使用的三倍圖@3x碳默。
6.5英寸的iPhoneXS Max（458ppi），分辨率為1242*2688px缘眶，而iPhone8 Plus（三倍圖嘱根，401ppi），分辨率為1242*2208px巷懈，iPhoneXS Max比iPhone8 Plus的PPI僅多了50多儿子，跟iPhoneX（三倍圖）的PPI一致，可以推論出iPhoneXs Max使用的同樣是三倍圖@3x砸喻。
從頁面寬高比例來看：
iPhoneXS Max寬度1242/3=414pt，iPhone8 Plus寬度1242/3=414pt蒋譬，兩者的寬度一致（大家看到寬度一致的時候是不是松了口氣呢割岛？哈哈）；
iPhoneXS Max高度2688/3=896pt犯助，iPhone8 Plus高度2208/3=736pt癣漆；
iPhoneXS Max比iPhone8 Plus長一截，多了160pt剂买。
發(fā)現(xiàn)惠爽，iPhoneXS Max的適配，有些像去年設(shè)計師適配iPhoneX的套路
最后我們來看6.1英寸的iPhoneXR（326ppi），分辨率為828*1792px菠赚，可以看到iPhoneXR與蘋果二倍圖的PPI（326ppi）一致妓美，可以推論出iPhoneXR使用的是二倍圖@2x。
從頁面寬高比例來看：
iPhoneXR寬度828/2=414pt较性，iPhoneXS Max寬度1242/3=414pt用僧；
iPhoneXR高度1792/2=896pt，iPhoneXS Max高度2688/3=896pt赞咙；
我們神奇地發(fā)現(xiàn)责循，iPhoneXR與iPhoneXS Max寬高比是一致的！這意味著iOS開發(fā)者做完iPhoneXS
Max的適配后攀操，直接進(jìn)行等比例縮放2/3就可以得到iPhoneXR了院仿，不用重新進(jìn)行修改布局（也可以先做iPhoneXR的適配，再等比例縮放到iPhone
XS Max）速和。
我們來做一個小結(jié)：
iPhoneXS歹垫、iPhoneXS Max使用的是三倍圖@3x；
iPhoneXR使用的是二倍圖@2x健芭。
像素妹給大家整理了當(dāng)前iOS適配所用到的切圖及對應(yīng)機(jī)型县钥，便于大家記憶，是不是很貼心呢慈迈？
二若贮、新尺寸對設(shè)計布局的影響
新發(fā)布的iPhoneXS、XS Max痒留、XR都采用了全面屏設(shè)計谴麦，因此我們必須保證布局填滿屏幕，并且考慮到交互操作伸头，要留出安全區(qū)域匾效，才不會被圓角、劉海影響使用恤磷，布局的左右邊距可根據(jù)產(chǎn)品自定義面哼，這些點與iPhoneX是相同的。
在上面像素妹提到過扫步，iPhoneXS與iPhoneX尺寸大小完全一致魔策，所以頁面布局也是一樣的。我們只需要懂得怎樣適配到iPhoneXS
Max以及iPhoneXR的布局就可以了（兩者的的邏輯像素是一致的河胎，均為414*896pt闯袒，區(qū)別在于一個是@3x，一個是@2x）。
方式有多個政敢，接下來主要介紹兩種：
方法一：
如果我們在設(shè)計的時候以iPhone8（375*667pt）為基準(zhǔn)做設(shè)計稿其徙，先得到iPhoneXR：由于都是@2x，首先需要將畫板寬度拉寬為414pt喷户，高度拉高為896pt（與我們做iPhone5到iPhone6的寬高變化處理是一樣的道理）唾那，狀態(tài)欄由20pt變高為44pt，在底部加上主頁指示器（HomeIndicator）高度為34pt摩骨，導(dǎo)航欄以及標(biāo)簽欄高度不變通贞。我們發(fā)現(xiàn)iPhoneXR內(nèi)容呈現(xiàn)的比iPhone8要多一些。
有了iPhoneXR后恼五，直接等比例放大1.5倍就可以得到iPhoneXS Max昌罩。
方法二：
如果我們在設(shè)計的時候以iPhoneX（375*812pt）為基準(zhǔn)做設(shè)計稿，先得到iPhoneXS
Max：由于都是@3x灾馒，首先需要將畫板寬度拉寬為414pt茎用，高度拉高為896pt（與方法一同理），狀態(tài)欄睬罗、導(dǎo)航欄轨功、標(biāo)簽欄、主頁指示器的高度均不用更改容达。有了iPhoneXS
Max后古涧，直接等比例縮小2/3就可以得到iPhoneXR，很簡單～花盐。
轉(zhuǎn)載自https://blog.csdn.net/qq_33608748/article/details/82769570
