How to Add Constraint for view inside stack view

Leang Socheat picture Leang Socheat · Jun 30, 2017 · Viewed 13.7k times · Source

I have one stack view that contains with 4 buttons. And each button I also add subview to that. The subview of that 4 buttons, I try to program to add constraint into it. Some constraint such as .Trailing .Leading .Top .Bottom I cannot add to it by error constraint and stack view problem. How any solution to add that constraints to subview of stackview. if have any sample it's really good for me. thank in advance

Answer

vg0x00 picture vg0x00 · Jul 24, 2017

UIStackView's power is to reduce your using of constrains, just give it some setting info such as axis, distribution, alignment, spacing. stack view will layout your subview item automatically, cause stack view's size is based on its' subviews' intrinsicContentSize, you can set subview's size by extra constraints to override.

adding constraints to subview of stackView is the same as other items in UIView. but is not a StackView way, and you should be care about adding conflict constraints.

hope this code demo helps:

let stackView = UIStackView()
let demoView = UIView()
demoView.backgroundColor = UIColor.red

stackView.addArrangedSubview(demoView)
demoView.translatesAutoresizingMaskIntoConstraints = false

// add your constraints as usual
demoView.widthAnchor.constraint(equalToConstant: 300).isActive = true
demoView.heightAnchor.constraint(equalToConstant: 200).isActive = true
demoView.trailingAnchor.constraint(equalTo: stackView.trailingAnchor).isActive = true
demoView.topAnchor.constraint(equalTo: stackView.topAnchor).isActive = true

view.addSubview(stackView)
stackView.translatesAutoresizingMaskIntoConstraints = false
stackView.trailingAnchor.constraint(equalTo: view.trailingAnchor).isActive = true
stackView.topAnchor.constraint(equalTo: view.topAnchor).isActive = true