Adding constraints programmatically in UIScrollView with dynamic buttons - Swift

Question

I'm trying to add constraints programmatically in my ScrollView but not working. The problem is it does not work the leading and Trailing for my label and buttons.

I want to put on a scroll view first one label and below the label eg 10 dynamic buttons.

The code is:

var buttons : [UIButton] = []

override func viewDidLoad() {
    super.viewDidLoad()
    // Do any additional setup after loading the view, typically from a nib.
    //Create controller and get view
    //var controller = UIViewController()
    var view = self.view
    var tag:String
    var count = 0

    //Create and layout scroll view
    var scrollView = UIScrollView()
    scrollView.setTranslatesAutoresizingMaskIntoConstraints(false)
    view.addSubview(scrollView)
    view.addConstraint(NSLayoutConstraint(item: scrollView, attribute: NSLayoutAttribute.Top, relatedBy: NSLayoutRelation.Equal, toItem: view, attribute: NSLayoutAttribute.Top, multiplier: 1.0, constant: 0.0))
    view.addConstraint(NSLayoutConstraint(item: scrollView, attribute: NSLayoutAttribute.Bottom, relatedBy: NSLayoutRelation.Equal, toItem: view, attribute: NSLayoutAttribute.Bottom, multiplier: 1.0, constant: 0.0))
    view.addConstraint(NSLayoutConstraint(item: scrollView, attribute: NSLayoutAttribute.Leading, relatedBy: NSLayoutRelation.Equal, toItem: view, attribute: NSLayoutAttribute.Leading, multiplier: 1.0, constant: 0.0))
    view.addConstraint(NSLayoutConstraint(item: scrollView, attribute: NSLayoutAttribute.Trailing, relatedBy: NSLayoutRelation.Equal, toItem: view, attribute: NSLayoutAttribute.Trailing, multiplier: 1.0, constant: 0.0))

    //Create and add content view
    var contentView = UIView()
    contentView.setTranslatesAutoresizingMaskIntoConstraints(false)
    scrollView.addSubview(contentView)
    scrollView.addConstraint(NSLayoutConstraint(item: contentView, attribute: NSLayoutAttribute.Top, relatedBy: NSLayoutRelation.Equal, toItem: scrollView, attribute: NSLayoutAttribute.Top, multiplier: 1.0, constant: 0.0))
    scrollView.addConstraint(NSLayoutConstraint(item: contentView, attribute: NSLayoutAttribute.Bottom, relatedBy: NSLayoutRelation.Equal, toItem: scrollView, attribute: NSLayoutAttribute.Bottom, multiplier: 1.0, constant: 0.0))
    scrollView.addConstraint(NSLayoutConstraint(item: contentView, attribute: NSLayoutAttribute.Leading, relatedBy: NSLayoutRelation.Equal, toItem: scrollView, attribute: NSLayoutAttribute.Leading, multiplier: 1.0, constant: 0.0))
    scrollView.addConstraint(NSLayoutConstraint(item: contentView, attribute: NSLayoutAttribute.Trailing, relatedBy: NSLayoutRelation.Equal, toItem: scrollView, attribute: NSLayoutAttribute.Trailing, multiplier: 1.0, constant: 0.0))

    //Contraint contentView and view
    view.addConstraint(NSLayoutConstraint(item: contentView, attribute: NSLayoutAttribute.Leading, relatedBy: NSLayoutRelation.Equal, toItem: view, attribute: NSLayoutAttribute.Leading, multiplier: 1.0, constant: 0.0))
    view.addConstraint(NSLayoutConstraint(item: contentView, attribute: NSLayoutAttribute.Trailing, relatedBy: NSLayoutRelation.Equal, toItem: view, attribute: NSLayoutAttribute.Trailing, multiplier: 1.0, constant: 0.0))

    //Add Label
    var preguntaLabel = UILabel()
    preguntaLabel.numberOfLines = 0
    preguntaLabel.text = "tenemos al mejor del mundo, que va y hace cuatro goles con el Real Sociedad, y viene acá y no la toca. Vos decís, pero la puta, ¿sos argentino o sueco? Que se dejen de romper las pelotas los que dicen ‘a Messi hay que mimarlo’. A Messi hay que tratarlo como a todo jugador que se pone la camiseta de la Selección. Como el mejor del mundo, para lo bueno y lo malo. Pero ojo que tampoco Messi mató, violó, no hagamos una novela"
    preguntaLabel.setTranslatesAutoresizingMaskIntoConstraints(false)
    contentView.addSubview(preguntaLabel)

    //contraits leading y trailing
    contentView.addConstraint(NSLayoutConstraint(item: preguntaLabel, attribute: NSLayoutAttribute.Leading, relatedBy: NSLayoutRelation.Equal, toItem: contentView, attribute: NSLayoutAttribute.Leading, multiplier: 1.0, constant: 5.0))
    contentView.addConstraint(NSLayoutConstraint(item: preguntaLabel, attribute: NSLayoutAttribute.Trailing, relatedBy: NSLayoutRelation.Equal, toItem: contentView, attribute: NSLayoutAttribute.Trailing, multiplier: 1.0, constant: 5.0))

    //contraits top
    contentView.addConstraint(NSLayoutConstraint(item: preguntaLabel, attribute: NSLayoutAttribute.Top, relatedBy: NSLayoutRelation.Equal, toItem: contentView, attribute: NSLayoutAttribute.Top, multiplier: 1.0, constant: 15.0))

    for var i=0;i<10;i++
    {
        //Create all buttons
        var btn = UIButton.buttonWithType(UIButtonType.System) as! UIButton
        btn.backgroundColor = UIColor.greenColor()
        btn.setTitle("hola"+String(i), forState: UIControlState.Normal)
        btn.titleLabel?.numberOfLines = 0
        buttons.append(btn)
    }
        //Add buttons to view with constraints
        var prevButton:String
        var constH:NSArray
        var constV:NSArray
        var hString:String
        var vString:String
        var index = 0
        for button in buttons{
            button.setTranslatesAutoresizingMaskIntoConstraints(false)
            contentView.addSubview(button)
            //button.bounds.size.height = 90
            button.titleLabel?.numberOfLines = 0
            contentView.addConstraint(NSLayoutConstraint(item: button, attribute: NSLayoutAttribute.Leading, relatedBy: NSLayoutRelation.Equal, toItem: contentView, attribute: NSLayoutAttribute.Leading, multiplier: 1.0, constant: 5.0))
            contentView.addConstraint(NSLayoutConstraint(item: button, attribute: NSLayoutAttribute.Trailing, relatedBy: NSLayoutRelation.Equal, toItem: contentView, attribute: NSLayoutAttribute.Trailing, multiplier: 1.0, constant: 5.0))
            if(index == 0){
                contentView.addConstraint(NSLayoutConstraint(item: button, attribute: NSLayoutAttribute.Top, relatedBy: NSLayoutRelation.Equal, toItem: preguntaLabel, attribute: NSLayoutAttribute.Top, multiplier: 1.0, constant: 8.0))
            }
            else{
                contentView.addConstraint(NSLayoutConstraint(item: button, attribute: NSLayoutAttribute.Top, relatedBy: NSLayoutRelation.Equal, toItem: buttons[index-1], attribute: NSLayoutAttribute.Bottom, multiplier: 1.0, constant: 8.0))
            }
            if(index == buttons.count-1){
                contentView.addConstraint(NSLayoutConstraint(item: button, attribute: NSLayoutAttribute.Bottom, relatedBy: NSLayoutRelation.Equal, toItem: contentView, attribute: NSLayoutAttribute.Bottom, multiplier: 1.0, constant: -8.0))
            }
            index++
        }

}

Joony · Accepted Answer · 2015-12-08 08:39:27Z

1

The problem was you mapped first button's with label's top so it was not showing properly actually you need to assign first button's top equal to label's bottom:

if(index == 0)
{        
    contentView.addConstraint(NSLayoutConstraint(item: button, attribute: NSLayoutAttribute.Top, relatedBy: NSLayoutRelation.Equal, toItem: preguntaLabel, attribute: NSLayoutAttribute.Bottom, multiplier: 1.0, constant: 8.0))
}

edited Dec 8, 2015 at 8:39

Joony

4,7482 gold badges35 silver badges40 bronze badges

answered Jul 21, 2015 at 6:12

Mihawk

5894 silver badges12 bronze badges

Sign up to request clarification or add additional context in comments.

8 Comments

corocraft Over a year ago

Thanks for your answer, this work but constraints (top and trailing) of "preguntaLabel" do not work. Only work leading constraints. contentView.addConstraint(NSLayoutConstraint(item: preguntaLabel, attribute: NSLayoutAttribute.Trailing, relatedBy: NSLayoutRelation.Equal, toItem: contentView, attribute: NSLayoutAttribute.Trailing, multiplier: 1.0, constant: 5.0)) contentView.addConstraint(NSLayoutConstraint(item: preguntaLabel, attribute: NSLayoutAttribute.Top, relatedBy: NSLayoutRelation.Equal, toItem: contentView, attribute: NSLayoutAttribute.Top, multiplier: 1.0, constant: 15.0))

Mihawk Over a year ago

hi the code you gave above code is working i tested it. i think their might some other problem with that & if you are using the beta version of xocde the use YourObjectName . translatesAutoresizingMaskIntoConstraints = false

corocraft Over a year ago

hi, i have xcode 6,4. it is not beta version, when i run the project, the project look like postimg.org/image/4nbx2rt25. get your other result? Thank for your help.

Mihawk Over a year ago

ok solved that issue too actually for the trailing constrain you will have to give negative constant so put -15 as the constant of the button & label trailing & its done place this constrain in button trailing contentView.addConstraint(NSLayoutConstraint(item: button, attribute: NSLayoutAttribute.Trailing, relatedBy: NSLayoutRelation.Equal, toItem: contentView, attribute: NSLayoutAttribute.Trailing, multiplier: 1.0, constant: -15.0))

corocraft Over a year ago

thank you very much, with all this works well. just out of curiosity, why the trailing must be negative?

|

Collectives™ on Stack Overflow

Adding constraints programmatically in UIScrollView with dynamic buttons - Swift

1 Answer 1

8 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

8 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related