How to dynamically change UIStackView height based on content size? - swift

Question

I have a view below that I'm trying to dynamically change the height of based on the heights of the subviews in the content view. Currently, I'm setting the scrollView and contentView's contentSize with a static height of "screenHeight + 1000". What steps can I take to dynamically update the height property?
import Foundation
import UIKit
import TinyConstraints
class ViewController: UIViewController {
// MARK: - PROPERTIES
let screenWidth = UIScreen.main.bounds.width
let screenHeight = UIScreen.main.bounds.height
var contentViewSize = CGSize(width: screenWidth, height: screenHeight + 1000)
// MARK: - VIEW METHODS
override func viewDidLoad() {
super.viewDidLoad()
addSubviews()
constrainSubviews()
}
// MARK: - VIEW OBJECTS
lazy var scrollView: UIScrollView = {
let scrollView = UIScrollView(frame: .zero)
scrollView.frame = view.bounds
scrollView.contentSize = contentViewSize
scrollView.autoresizingMask = .flexibleHeight
scrollView.showsHorizontalScrollIndicator = true
scrollView.bounces = true
return scrollView
}()
lazy var contentView: UIView = {
let contentView = UIView()
contentView.frame.size = contentViewSize
return contentView
}()
lazy var topView: UIStackView = { ... }()
lazy var nutritionView: UIStackView = { ... }()
lazy var ingredientsView: UIStackView = { ... }()
lazy var instructionsView: UIStackView = { ... }()
fileprivate func addSubviews() {
view.addSubview(scrollView)
scrollView.addSubview(contentView)
contentView.addSubview(topView)
contentView.addSubview(nutritionView)
contentView.addSubview(ingredientsView)
contentView.addSubview(instructionsView)
}
fileprivate func constrainSubviews() {
let stack = [topView, nutritionView, ingredientsView, instructionsView]
contentView.stack(stack, spacing: screenHeight * 0.03)
contentView.centerXToSuperview()
contentView.topToSuperview(offset: screenHeight * 0.04)
contentView.width(screenWidth * 0.8)
}
}

Answer 1

You should add a scroll view and inside that add and stackview, and inside the stack view add the views, and the scroll view will increase dynamically, like this code.
class ViewController: UIViewController {
let scrollView = UIScrollView()
lazy var contentStackView = UIStackView(arrangedSubviews: [getView(height: 500, color: .red),
getView(height: 600, color: .blue),
getView(height: 70, color: .gray),
getView(height: 80,color: .yellow)])
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view.
self.view.backgroundColor = .white
contentStackView.axis = .vertical
setupConstraints()
}
func setupConstraints() {
self.view.addSubview(scrollView)
self.scrollView.addSubview(contentStackView)
scrollView.translatesAutoresizingMaskIntoConstraints = false
contentStackView.translatesAutoresizingMaskIntoConstraints = false
NSLayoutConstraint.activate([
scrollView.topAnchor.constraint(equalTo: self.view.topAnchor),
scrollView.leadingAnchor.constraint(equalTo: self.view.leadingAnchor),
scrollView.trailingAnchor.constraint(equalTo: self.view.trailingAnchor),
scrollView.bottomAnchor.constraint(equalTo: self.view.bottomAnchor),
contentStackView.topAnchor.constraint(equalTo: self.scrollView.topAnchor),
contentStackView.leadingAnchor.constraint(equalTo: self.scrollView.leadingAnchor),
contentStackView.trailingAnchor.constraint(equalTo: self.scrollView.trailingAnchor),
contentStackView.bottomAnchor.constraint(equalTo: self.scrollView.bottomAnchor),
contentStackView.widthAnchor.constraint(equalTo: self.scrollView.widthAnchor)
])
}
func getView(height: Double, color: UIColor) -> UIView {
let view = UIView()
view.backgroundColor = color
view.translatesAutoresizingMaskIntoConstraints = false
view.heightAnchor.constraint(equalToConstant: height).isActive = true
return view
}
}