iOS Dynamic Content View inside ScrollView not scrolling properly - ios

Question

I have created a ViewController that has ScrollView direct child of its View now I have added a View inside ScrollView that has constrains :
I have added a VerticalLayout class with following code:
class VerticalLayout: UIView {
var yOffsets: [CGFloat] = []
var heightValue : CGFloat = 0.0
init(width: CGFloat) {
super.init(frame: CGRect(x:0, y:0, width:width, height:0))
}
required init(coder aDecoder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
override func layoutSubviews() {
var height: CGFloat = 0
for i in 0..<subviews.count {
let view = subviews[i] as UIView
view.layoutSubviews()
height += yOffsets[i]
view.frame.origin.y = height
height += view.frame.height
}
self.frame.size.height = height
self.heightValue = height
}
override func addSubview(_ view: UIView) {
yOffsets.append(view.frame.origin.y)
super.addSubview(view)
}
func removeAll() {
for view in subviews {
view.removeFromSuperview()
}
yOffsets.removeAll(keepingCapacity: false)
}
}
And ViewController code as :
class ViewController: UIViewController {
#IBOutlet var contentview: UIView!
#IBOutlet var scrollview: UIScrollView!
override func viewDidLoad() {
super.viewDidLoad()
contentview.backgroundColor = UIColor.lightGray
let vLayout = VerticalLayout(width: view.frame.width)
vLayout.backgroundColor = UIColor.cyan
contentview.addSubview(vLayout)
vLayout.addSubview(getView(color: UIColor.red))
vLayout.addSubview(getView(color: UIColor.magenta))
vLayout.addSubview(getView(color: UIColor.green))
vLayout.addSubview(getView(color: UIColor.blue))
vLayout.addSubview(getView(color: UIColor.yellow))
contentview.frame.size.height = vLayout.heightValue
contentview.layoutIfNeeded()
}
func getView(color:UIColor) -> UIView
{
let view = UIView(frame: CGRect(x:100, y:50, width:100, height:100))
view.backgroundColor = color
return view
}
}
But when I run this code I get this screen:
And the content of this screen is not scrollable. What am I missing?

Answer 1

This works well with me , Also I think that vertical UIStackView is perfect for issues like that instead of manually handling views
class ViewController: UIViewController{
#IBOutlet var contentview: UIView!
#IBOutlet var scrollView: UIScrollView!
override func viewDidLoad() {
super.viewDidLoad()
contentview.backgroundColor = UIColor.lightGray
let vLayout = VerticalLayout(width: view.frame.width)
vLayout.backgroundColor = UIColor.cyan
contentview.addSubview(vLayout)
vLayout.addSubview(getView(color: UIColor.red))
vLayout.addSubview(getView(color: UIColor.magenta))
vLayout.addSubview(getView(color: UIColor.green))
vLayout.addSubview(getView(color: UIColor.blue))
vLayout.addSubview(getView(color: UIColor.yellow))
vLayout.addSubview(getView(color: UIColor.red))
vLayout.addSubview(getView(color: UIColor.magenta))
vLayout.addSubview(getView(color: UIColor.green))
vLayout.addSubview(getView(color: UIColor.blue))
vLayout.addSubview(getView(color: UIColor.yellow))
vLayout.addSubview(getView(color: UIColor.red))
vLayout.addSubview(getView(color: UIColor.magenta))
vLayout.addSubview(getView(color: UIColor.green))
vLayout.addSubview(getView(color: UIColor.blue))
vLayout.addSubview(getView(color: UIColor.yellow))
}
func getView(color:UIColor) -> UIView
{
let view = UIView(frame: CGRect(x:100, y:50, width:100, height:100))
view.backgroundColor = color
return view
}
}
class VerticalLayout: UIView {
var yOffsets: [CGFloat] = []
var heightValue : CGFloat = 0.0
init(width: CGFloat) {
super.init(frame: CGRect(x:0, y:0, width:width, height:0))
}
required init(coder aDecoder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
override func layoutSubviews() {
var height: CGFloat = 0
for i in 0..<subviews.count {
let view = subviews[i] as UIView
view.layoutSubviews()
height += yOffsets[i]
view.frame.origin.y = height
height += view.frame.height
}
// main edit is here
self.frame.size.height = height
self.heightValue = height
let ff = self.superview
let dd = ff?.superview as! UIScrollView
dd.contentSize = CGSize.init(width: self.frame.size.width, height: height)
}
override func addSubview(_ view: UIView) {
yOffsets.append(view.frame.origin.y)
super.addSubview(view)
}
func removeAll() {
for view in subviews {
view.removeFromSuperview()
}
yOffsets.removeAll(keepingCapacity: false)
}
}

Answer 2

Here You are missing scroll view content size. Please set scrollview content size after adding views.
scrollView.contentSize = CGSize(width: height of total no of views, height: width of the screen)

Answer 3

You just set constraint of content view as like
Top to super view
leading to a super view
trailing to a super view
bottom to super view
Equal width to a super view
Equal height to super view
And the last in tap on equal height constraint and set low priority(250).
Your scroll will work perfectly.