一、前言
最近我們iOS適配可以放棄iOS8了（喜大普奔）。想想也是，連微信最新版本都要求使用iOS11版本了。于是我們可以熱情的使用iOS9之后的控件了。例如：UIStackView
UIStackView繼承自UIView，用來管理在它內部的views，確實可以很大程度提高界面開發(fā)效率，每一個iOS開發(fā)者都應該熟練掌握UIStackView的使用。
二、效果
1、UIStackView + UIScrollow 的效果
QQ20210702-152244-HD.gif
2、UIStackView 單獨效果
QQ20210702-152642-HD.gif
三、項目描述
項目代碼比較通俗易懂，布局使用了 SnapKit 。
枚舉類型
因為我們是分享面板，枚舉類型是必不可少的類型，我們定義了分享平臺的枚舉，以及分享樣式的枚舉
//分享平臺枚舉
public enum LGSharePlateformEnum: String {
case wechat = "微信"
case wechatTimeline = "朋友圈"
case qqFriend = "QQ"
case qqZone = "QQ空間"
case dingTalk = "釘釘"
case none = ""
public func info() -> (title: String?, icon: UIImage?) {
switch self {
case .wechat:
return ("微信", UIImage(named: "nav_share_weixin"))
case .qqFriend:
return ("QQ", UIImage(named: "nav_share_qq"))
case .wechatTimeline:
return ("朋友圈", UIImage(named: "nav_share_pengyouquan")
case .qqZone:
return ("QQ空間", UIImage(named: "nav_share_kaliao_qqzone"))
case .dingTalk:
return ("釘釘", UIImage(named: "nav_share_dingding"))
case .none:
return (nil, nil)
}
}
}
//分享樣式枚舉
public enum LGShareTypeEnum {
case normal
case scrollow
}
1、因為我們使用swift開發(fā)，枚舉可以定義字符串類型枚舉，甚至可以調用方法，極大的便利了我們的開發(fā)效率
2、分享平臺枚舉我們定義了.none的枚舉，是因為UIStackView的特性，用空元素補齊。
單行的可滑動的分享面板
public class LGShareScrollView: UIView {
var didSelectItem: ((_ plateform: LGSharePlateformEnum?) -> Void)?
//平臺分享
lazy var platformStackView: UIStackView = {
let stackView = UIStackView()
stackView.spacing = 25
stackView.isUserInteractionEnabled = true
stackView.axis = .horizontal
stackView.distribution = .equalSpacing
return stackView
}()
var plateform: [LGSharePlateformEnum]? {
didSet {
for plateItem in plateform ?? [] {
let itemView = LGShareItemView()
itemView.didSelectItem = didSelectItem
itemView.sharePlateform = plateItem
platformStackView.addArrangedSubview(itemView)
itemView.snp.makeConstraints { (make) in
make.height.equalTo(100)
make.width.equalTo(50)
}
}
}
}
private var scrollow: UIScrollView?
public var safeBottomHeight: CGFloat {
var bottomH: CGFloat = 0.0
if #available(iOS 11.0, *) {
bottomH = UIApplication.shared.delegate?.window??.safeAreaInsets.bottom ?? 0
}
return bottomH
}
override init(frame: CGRect) {
super.init(frame: frame)
setupStackView()
}
override public func layoutSubviews() {
super.layoutSubviews()
let stackViewWidth = platformStackView.frame.size.width
scrollow?.contentSize = CGSize(width: stackViewWidth + 30, height: 0)
}
func setupStackView() {
self.isUserInteractionEnabled = true
let scrollow = UIScrollView()
scrollow.showsHorizontalScrollIndicator = false
self.scrollow = scrollow
scrollow.isUserInteractionEnabled = true
self.addSubview(scrollow)
scrollow.snp.makeConstraints { (make) in
make.top.left.right.equalToSuperview()
make.height.equalTo(100)
make.bottom.equalToSuperview().offset(-safeBottomHeight)
}
scrollow.addSubview(platformStackView)
platformStackView.snp.makeConstraints { (make) in
make.top.bottom.equalToSuperview()
make.left.equalToSuperview().offset(15)
make.height.equalTo(100)
}
}
required init?(coder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
}
1、使用 UIScrollView + UIStackView 的方式
2、設置UIStackView的上、左、下、高度，snapKit的 AutoLayout 會自動計算寬度
3、在layoutSubviews里要設置scrollow.contentSize，否則不能滑動
可自動換行的分享面板
public class LGShareStackView: UIView {
var didSelectItem: ((_ plateform: LGSharePlateformEnum?) -> Void)?
var lineNumber = 5
//縱向的
lazy var platformStackView: UIStackView = {
let stackView = UIStackView()
stackView.isUserInteractionEnabled = true
stackView.axis = .vertical
stackView.distribution = .fillEqually
return stackView
}()
var plateform: [LGSharePlateformEnum]? {
didSet {
let line = (((plateform?.count ?? 0) - 1) / lineNumber) + 1
for i in 0..<line {
let stackView = UIStackView()
stackView.isUserInteractionEnabled = true
stackView.axis = .horizontal
stackView.distribution = .fillEqually
platformStackView.addArrangedSubview(stackView)
stackView.snp.makeConstraints { (make) in
make.left.right.equalToSuperview()
make.height.equalTo(100)
}
for j in 0..<lineNumber {
let plateItem = (((i * lineNumber) + j) < plateform?.count ?? 0) ? plateform?[((i * lineNumber) + j)] : LGSharePlateformEnum.none
let itemView = LGShareItemView()
itemView.didSelectItem = didSelectItem
itemView.sharePlateform = plateItem
stackView.addArrangedSubview(itemView)
itemView.snp.makeConstraints { (make) in
make.height.equalTo(100)
make.top.equalToSuperview()
}
}
}
}
}
public var safeBottomHeight: CGFloat {
var bottomH: CGFloat = 0.0
if #available(iOS 11.0, *) {
bottomH = UIApplication.shared.delegate?.window??.safeAreaInsets.bottom ?? 0
}
return bottomH
}
override init(frame: CGRect) {
super.init(frame: frame)
setupStackView()
}
func setupStackView() {
self.isUserInteractionEnabled = true
self.addSubview(platformStackView)
platformStackView.snp.makeConstraints { (make) in
make.top.left.right.equalToSuperview()
make.bottom.equalToSuperview().offset(-safeBottomHeight)
}
}
required init?(coder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
}
1、邏輯是一個縱向的UIStackView，套著多個橫向的UIStackView
2、可以設置行數(shù)個數(shù)來設置每行的個數(shù)
如圖所示
截屏2021-07-02 下午4.50.03.png
四、最后
iOS9之后 使用UIStackView，不用考慮views坐標，類似安卓的線性布局。使用非常舒服，方便。
項目github地址 ：https://github.com/Qinzhao/LGShareViewTool
