Swift UIStackView: Positioning elements from center programmatically
Thats odd. Normally a horizontal UIStackView with center alignment and equal centering distribution should do exactly that:
But maybe I'm not understanding you correct and you actually want something like this:
In which case you have to chose Fill Equally as the distribution method and make the labels itself center their text:
Comments
-
JamesG almost 2 years
I am trying to get elements inside a UIStackView to position themselves equally from the center.
This is the desired effect I would like:
As you can see, I would like the two text fields to be equally spaced from each other and aligned center within the stack view.
This stack view will have either 1 - 7 textfields that I need lined up.
Here is what is currently coming out:
This is how I am setting the Text Fields
let textLabel = UILabel() textLabel.backgroundColor = UIColor.red textLabel.widthAnchor.constraint(equalToConstant: 40.0).isActive = true textLabel.heightAnchor.constraint(equalToConstant: 20.0).isActive = true textLabel.text = "Hi" textLabel.textAlignment = .center let textLabel1 = UILabel() textLabel1.backgroundColor = UIColor.red textLabel1.widthAnchor.constraint(equalToConstant: 40.0).isActive = true textLabel1.heightAnchor.constraint(equalToConstant: 20.0).isActive = true textLabel1.text = "Hi" textLabel1.textAlignment = .center
I am generating the stack view like so:
//Stack View let stackView = UIStackView() stackView.axis = UILayoutConstraintAxis.horizontal stackView.distribution = UIStackViewDistribution.equalCentering stackView.alignment = UIStackViewAlignment.fill stackView.spacing = 16.0 stackView.addArrangedSubview(textLabel) stackView.addArrangedSubview(textLabel1) stackView.translatesAutoresizingMaskIntoConstraints = false; self.view.addSubview(stackView) //Constraints stackView.leftAnchor.constraint(equalTo: self.view.leftAnchor, constant: 50).isActive = true stackView.rightAnchor.constraint(equalTo: self.view.rightAnchor, constant: -50).isActive = true stackView.topAnchor.constraint(equalTo: self.view.topAnchor, constant: 100).isActive = true
How do I get the elements inside to align center?
I thought it was
UIStackViewDistribution.equalCentering
However, that didn't do much.
-
Norman almost 7 yearsI have found Interface Builder to show stale values for stack alignments and distributions, you might try restarting Xcode and see if it renders differently.
-
xxtesaxx almost 7 yearsI don't know what you mean, nor have I had problems with stackviews in IB. :/
-
xxtesaxx almost 7 yearsThis was just a visual demo of the stackview modes.
-
Norman almost 7 yearsIt's a really clear and helpful answer. I have experienced Interface Builder occasionally not reflecting the current alignment or distribution setting on the visual representation of the storyboard.
-
xxtesaxx almost 7 yearsAh i see. What usually could help as well is change the device orientation in the storyboard or resize the view if it is free-forming.