通过缩放一个View同时适配iPad和iPhone

面对庞大的iOS家族
那么如何优雅的用同一个View适配所有屏幕?

2642028-6fecad9c31a00b7d.png
iOS各种屏幕

iPhone系列屏幕是 16:9
iPhone X系列屏幕是 19.5:9
iPad是12:9

在为iPhone和iPad设计的UI图改变不是很大时
只需要使用代码或xib做好 iPad(1024/768)或 iPhone(736/414)的界面
通过缩放View
再判断不同比例设备稍微改变View里控件Frame的Origin来适配所有屏幕

如果分别设计iPad和iPhone的UI
那么做好 iPad(1024/768)和 iPhone(736/414)的界面
通过缩放View就OK

这种方案用于不使用NavigationBar较好

那么打个广告

2642028-20479dec91421190.png
iPad Pro (12.9-inch).png
2642028-be28515ddbfd265f.png
iPhone 5s.png
2642028-c92658b49694dc48.png
iPhone X.png

这是基于 iPad(1024*768)逻辑分辨率和@3x切图 实现的一个View
可以看到通过比例缩放完全适配各种屏幕

//是横屏界面, 所以以高为基准
//不管是什么设备, 都按设计图具体逻辑分辨率来, 所以大小是(695*605)
let viewRect = CGRect.init(x: 0, y: 0, width: 695, height: 605)

allV.addSubview(addressV)
addressV.frame = viewRect

if __MainScreenWidth<999 {//判断是iPhone
    let scale: CGFloat = 0.6//0.6大致是iPad缩放为iPhone
    let baseRectScale = __MainScreenHeight/414//在iPhone中以414为基准

    //设定Frame时也是按照缩放前的分辨率(1024*768)
    backBtn.frame = CGRect.init(x: 20/scale, y: 16/scale, width: backBtn.frame.width, height: backBtn.frame.height)
    //iPhone X的x需要相对普通iPhone加大
    v0.frame = CGRect.init(x: 92.sizeXLong/scale, y: 16/scale, width: v0.frame.width, height: v0.frame.height)
    
    //(1024*768)iPad界面*scale(0.6)=(736*414)iPhonePlus界面
    //(736*414)iPhonePlus界面*baseRectScale = 5s或iPhone7界面
    //self里的所有View例如Tableview都被缩放
    self.transform = CGAffineTransform.init(scaleX: scale*baseRectScale, y: scale*baseRectScale)
}

链接: https://pan.baidu.com/s/1BseVyKkx-tO6t3mixEu1PQ 提取码: 6tyv

展开阅读全文

没有更多推荐了,返回首页