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
As you embed the buttons in the stack view, they are resized to its intrinsic size. If you want to set the width to 200, you will need to add the size constraint to the stack view. In the document view, control-drag from the stack view to itself to bring up the context menu. Choose Width to add the width constraint.
Stack views don't have an intrinsic content size, so you must set it either implicitly with Auto Layout constraints or explicitly via its intrinsicContentSize property. When nested in a scroll view, constraints between the stack view and the view containing the scroll view are necessary for things to work as expected.
To use a stack view, open the Storyboard you wish to edit. Drag either a Horizontal Stack View or a Vertical Stack View out from the Object library, and position the stack view where desired. Next, drag out the stack's content, dropping the view or control into the stack.
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
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With