Xcode Question posted in
Whether you're new to Xcode or an experienced developer, our archive has everything you need to know about this integrated development environment (IDE). From basic functionalities to advanced features, our archive covers a wide range of Xcode-related questions and answers. Browse our archive now and find solutions to your Xcode questions, and take your app development skills to the next level

Xcode – UIStackView with UISegmentedControl

I’m trying to create UIStackView with 3 UISegmentedControl with this code, and I want them to be center both vertically and horizontaly:

let segmented = UISegmentedControl(items: ["SOLID","GRADIENT"])
let segmented2 = UISegmentedControl(items: ["SOLID","GRADIENT"])
let segmented3 = UISegmentedControl(items: ["SOLID","GRADIENT"])

segmented.selectedSegmentIndex = 0
segmented2.selectedSegmentIndex = 0
segmented3.selectedSegmentIndex = 0

let st = UIStackView(arrangedSubviews: [segmented, segmented2, segmented3])
st.axis = .vertical
st.spacing = 5;
st.alignment = .center

self.addSubview(st)

st.translatesAutoresizingMaskIntoConstraints = false
st.topAnchor.constraint(greaterThanOrEqualTo: self.topAnchor, constant: 0.0).isActive = true
st.leftAnchor.constraint(equalTo: self.leftAnchor, constant: 0.0).isActive = true
st.rightAnchor.constraint(equalTo: self.rightAnchor, constant: 0.0).isActive = true
st.bottomAnchor.constraint(greaterThanOrEqualTo: self.bottomAnchor, constant: 0.0).isActive = true
st.centerXAnchor.constraint(equalTo: self.centerXAnchor, constant: 0.0).isActive = true
st.centerYAnchor.constraint(equalTo: self.centerYAnchor, constant: 0.0).isActive = true

The problem is that I get this view:

enter image description here

Any idea how I can fix this problem? I want all of them will be at the same height.

Tags:

2

Answers


  1. 0

    I believe this:

    st.bottomAnchor.constraint(greaterThanOrEqualTo: self.bottomAnchor, constant: 0.0).isActive = true

    Should be inverted to:

    st.bottomAnchor.constraint(lessThanOrEqualTo: self.bottomAnchor, constant: 0.0).isActive = true

    Because you want the y-position of the stack view’s bottom anchor to be a smaller value than the y-position of the view’s own bottom anchor.

    In general the constraint constants have to be inverted for the trailing and bottom anchors.

    Login or Signup to reply.
  2. 0

    First, because your constraints are using self (as in self.topAnchor), this code must belong to a UIView subclass.

    It’s not clear what your end goal is… Do you want the stack of segmented controls to determine the height of the view? Or do you want the control heights to be determined by the height of the view? How are you setting the constraints of the custom view that holds this stack of controls?

    In any case, you can get the segmented controls to be equal Heights simply by adding this line:

    st.distribution = .fillEqually

    However, regardless of what else you’re doing, your current constraints for the stack view are probably incorrect.

    Try it like this:

        st.topAnchor.constraint(equalTo: self.topAnchor).isActive = true
    st.leadingAnchor.constraint(equalTo: self.leadingAnchor).isActive = true
    st.trailingAnchor.constraint(equalTo: self.trailingAnchor).isActive = true
    st.bottomAnchor.constraint(equalTo: self.bottomAnchor).isActive = true

    No need for either centerX or centerY constraints.

    Another way to set those constraints, which is a little more concise and readable, is like this:

        NSLayoutConstraint.activate([
        st.topAnchor.constraint(equalTo: self.topAnchor),
        st.leadingAnchor.constraint(equalTo: self.leadingAnchor),
        st.trailingAnchor.constraint(equalTo: self.trailingAnchor),
        st.bottomAnchor.constraint(equalTo: self.bottomAnchor),
    ])
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search