CODEWITHSUNDEEP
iosswiftuiviewnslayoutconstraint
J.Doe
J.Doe

Reputation: 725

Add constraint to UIView programmatically

I want to add a smaller subview in a view and add constraint to it. The leading and trainling constraint should be 50.0 and the height and botton should be 80.0 .

I create my subview in this way 

let mySubview = UIView(frame: CGRect(x: 50.0, y: 80.0, width: 540.0, height: 220.0))

and then I try to add it to the view with this code

let topConstraint = NSLayoutConstraint(item: mySubview, attribute: .top, relatedBy: .equal, toItem: self.view, attribute: .top, multiplier: 1, constant: 80.0)
let bottomConstraint = NSLayoutConstraint(item: mySubview, attribute: .bottom, relatedBy: .equal, toItem: self.view, attribute: .bottom, multiplier: 1, constant: 80.0)
let leadingConstraint = NSLayoutConstraint(item: mySubview, attribute: .leading, relatedBy: .equal, toItem: self.view, attribute: .leading, multiplier: 1, constant: 50.0)
let trailingConstraint = NSLayoutConstraint(item: mySubview, attribute: .trailing, relatedBy: .equal, toItem: self.view, attribute: .trailing, multiplier: 1, constant: 50.0)

mySubview.translatesAutoresizingMaskIntoConstraints = false
self.view.addSubview(mySubview)
self.view.addConstraints([topConstraint, bottomConstraint, leadingConstraint, trailingConstraint])
self.view.layoutIfNeeded()

But the contraints dose not do any effect. The view looks nice on iPad, probably because of the first init CGRect(x: 50.0, y: 80.0, width: 540.0, height: 220.0), but on smaller screen it looks very big. Shall I try to init the UIView depending on the screen or is it possible to solve this by adding constrains?

Upvotes: 1

Views: 6885

Answers (5)

Simplexory
Simplexory

Reputation: 1

I think this can solve the problem

mySubview.translatesAutoresizingMaskIntoConstraints = false

Like this

let mySubview: UIView = {
    let thisView = UIView(frame: CGRect(x: 50.0, y: 80.0, width: 540.0, height: 220.0))
    thisView.translatesAutoresizingMaskIntoConstraints = false
    return thisView
}()

Upvotes: 0

André Slotta
André Slotta

Reputation: 14040

Since you want to use auto layout it is enough to instantiate the subview without a frame (since the frame gets calculated taking the constraints into account): let mySubview = UIView().

Then you have to set translatesAutoresizingMaskIntoConstraints to false for your subview.

You also have to change the constants for the bottom constraint to -80 and for the trailing constraint to -50. if you want to keep the positive constants you can also switch the items (self.view / mySubview):

let bottomConstraint = NSLayoutConstraint(item: self.view, attribute: .bottom, relatedBy: .equal, toItem: mySubview, attribute: .bottom, multiplier: 1, constant: 80.0)
let trailingConstraint = NSLayoutConstraint(item: self.view, attribute: .trailing, relatedBy: .equal, toItem: mySubview, attribute: .trailing, multiplier: 1, constant: 50.0)

Last but not least you can delete the self.view.layoutIfNeeded() line.

Upvotes: 1

Michael Henry
Michael Henry

Reputation: 722

you should try to use http://snapkit.io/docs/

let box = UIView()
superview.addSubview(box)

box.snp.makeConstraints { (make) -> Void in
    make.top.equalTo(superview).offset(80)
    make.left.equalTo(superview).offset(50)
    make.bottom.equalTo(superview).offset(-80)
    make.right.equalTo(superview).offset(-50)
}

Upvotes: 1

Prashant Tukadiya
Prashant Tukadiya

Reputation: 16456

You forgot to set the translatesAutoresizingMaskIntoConstraints to false

let mySubview = UIView(frame: CGRect(x: 50.0, y: 80.0, width: 540.0, height: 220.0))

mySubview.translatesAutoresizingMaskIntoConstraints = false

Upvotes: 0

Puneet Sharma
Puneet Sharma

Reputation: 9484

You need this:

mySubview.translatesAutoresizingMaskIntoConstraints = false

translatesAutoresizingMaskIntoConstraints is a Boolean value that determines whether the view’s autoresizing mask is translated into Auto Layout constraints.

Upvotes: 3

Related Questions