Skip to content

Instantly share code, notes, and snippets.

@eviathan
Created June 18, 2019 20:35
Show Gist options
  • Save eviathan/3c75d66d01748b42990e2549022efa04 to your computer and use it in GitHub Desktop.
Save eviathan/3c75d66d01748b42990e2549022efa04 to your computer and use it in GitHub Desktop.
Relative Sizing for views on iOS using UIKit
import Foundation
import UIKit
class RelativeView: UIView {
@IBInspectable var width: CGFloat = 1.0
@IBInspectable var height: CGFloat = 1.0
override var intrinsicContentSize: CGSize {
return CGSize(width: width, height: height)
}
}
class RelativeStackView: UIStackView {
@IBInspectable var width: CGFloat = 1.0
@IBInspectable var height: CGFloat = 1.0
override var intrinsicContentSize: CGSize {
return CGSize(width: width, height: height)
}
override init(frame: CGRect) {
super.init(frame: frame)
initStach()
}
required init(coder: NSCoder) {
super.init(coder: coder)
initStach()
}
private func initStach() {
distribution = .fillProportionally
}
}
@IBDesignable
class TestView : UIView {
var wrapper = UIStackView()
var halfView = RelativeView()
var lowerSection = RelativeStackView()
var quarterView1 = RelativeView()
var quarterView2 = RelativeView()
var viewsDict: [String:UIView] = [String:UIView]()
override init(frame: CGRect) {
super.init(frame: frame)
initUI()
}
required convenience init?(coder aDecoder: NSCoder) {
self.init(coder: aDecoder)
initUI()
}
func initUI() {
// Setup view hierarchy
addSubview(wrapper)
wrapper.addArrangedSubview(halfView)
wrapper.addArrangedSubview(lowerSection)
lowerSection.addArrangedSubview(quarterView1)
lowerSection.addArrangedSubview(quarterView2)
// Configure Wrapper Stackview
wrapper.distribution = .fillProportionally
wrapper.axis = .vertical
viewsDict = [
"wrapper" : wrapper,
"halfView" : halfView,
"lowerSection" : lowerSection,
"quarterView1" : quarterView1,
"quarterView2" : quarterView2,
]
_ = viewsDict.map {
$0.value.translatesAutoresizingMaskIntoConstraints = false
}
addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "H:|[wrapper]|", options: [], metrics: nil, views: viewsDict))
addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "V:|[wrapper]|", options: [], metrics: nil, views: viewsDict))
// Configure Child View Heights
// NOTE: THIS IS THE BIT THAT ISN'T WORKING!!!!
halfView.height = 2.0
halfView.backgroundColor = UIColor.red
lowerSection.height = 1.0
quarterView1.width = 1.0
quarterView1.backgroundColor = UIColor.yellow
quarterView2.width = 2.0
quarterView2.backgroundColor = UIColor.blue
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment