Xcode|Xcode AutoLayout布局(三) 自动适配机型准备配置

【Xcode|Xcode AutoLayout布局(三) 自动适配机型准备配置】适配原则
由于不同机型宽高比不同,我们以不同机型屏幕宽度为基准进行等比例缩放,经过数据分析,决定以iPhone 6/6s/7/8 系列机型的宽高比作为基准进行适配。根据下表可以看出,当以该比例进行适配时,当前宽高比较低的机型溢出的高度完全可以接受,当然为了更好的适配,我们也可以对垂直间距按照一定比例进行变更。

Xcode|Xcode AutoLayout布局(三) 自动适配机型准备配置
文章图片

实现方法
为了能够在sb上直接进行设置,我们借助@IBInspectable方法,让自定义属性出现在IB的Attributes inspector中

/// 设置基准宽度 private let default_Width:CGFloat = 375 /// 换算对应机型尺寸(以default_Width为基准) private func calculateScale(_ length: CGFloat) -> CGFloat { return length * (UIScreen.main.bounds.width/default_Width) }/// 由于无法在IB内添加自定义参数,故使用CGSize来替代自定义多元参数/// 视图扩展 extension UIView { /// 基准倒角 /// - width-最小值(无最小值填0) height-基准值 返回值-(width:0, height:真实倒角)@IBInspectable,需要在user Defined Runtime Attributes进行设置 @IBInspectable var fitCornerRadius:CGSize { set { let scaleSize = calculateScale(newValue.height) if scaleSize < newValue.width && newValue.width != 0{ layer.cornerRadius = newValue.width }else{ layer.cornerRadius = scaleSize } } get { return self.fitCornerRadius } } }

Xcode|Xcode AutoLayout布局(三) 自动适配机型准备配置
文章图片
自适应倒角
/// 约束扩展 extension NSLayoutConstraint { /// 基准长度 /// - width-最小值(无最小值填0) height-基准值 返回值-(width:0, height:真实长度) @IBInspectable var fitConstant:CGSize { set{ let scaleSize = calculateScale(newValue.height) if scaleSize < newValue.width && newValue.width != 0{ constant = scaleSize }else{ constant = scaleSize } } get{ return self.fitConstant } } }/// 字体扩展 extension UILabel{ /// - width-最小值(无最小值填0) height-基准值 返回值-(width:0, height:真实字号) @IBInspectable var fitFontSize: CGSize { set{ let scaleSize = calculateScale(newValue.height) if scaleSize < newValue.width && newValue.width != 0 { font = UIFont(name: font.fontName, size: newValue.width) }else{ font = UIFont(name: font.fontName, size: scaleSize) } } get { return self.fitFontSize } } }

Xcode|Xcode AutoLayout布局(三) 自动适配机型准备配置
文章图片
自适应字体字号
/// 按钮扩展 extension UIButton { /// 基准字号 /// - width-最小值(无最小值填0) height-基准值 返回值-(width:0, height:真实字号) @IBInspectable var fitFontSize: CGSize { set{ let scaleSize = calculateScale(newValue.height) if scaleSize < newValue.width && newValue.width != 0 { if titleLabel != nil { titleLabel!.font = UIFont(name: titleLabel!.font.fontName, size: calculateScale(newValue.width)) } }else{ if titleLabel != nil { titleLabel!.font = UIFont(name: titleLabel!.font.fontName, size: calculateScale(scaleSize)) } } } get{ return self.fitFontSize } } }

Xcode|Xcode AutoLayout布局(三) 自动适配机型准备配置
文章图片
自适应按钮字号
/// 输入文本扩展 extension UITextField { /// 基准字号 /// - width-最小值(无最小值填0) height-基准值 返回值-(width:0, height:真实字号) @IBInspectable var fitFontSize: CGSize { set{ let scaleSize = calculateScale(newValue.height) if scaleSize < newValue.width && newValue.width != 0 { if font != nil { font = UIFont(name: font!.fontName, size: newValue.width) } }else{ if font != nil { font = UIFont(name: font!.fontName, size: scaleSize) } } } get{ return self.fitFontSize } } }

    推荐阅读