AutoLayout incorrectly rendering subview's position

Question

I am in the process of learning auto layout and I use snapkit. I written some code but working differently than expected. I write code leftMargin but it is working as if it's a rightMargin. You can see on photo. what is wrong on my code?

My Code

let container = View()
 container.backgroundColor=UIColor.greenColor()

 let v1 = View()
 v1.backgroundColor=UIColor.blackColor()
self.view.addSubview(container);
        container.addSubview(v1)

let padding2 : UIEdgeInsets = UIEdgeInsetsMake(20,20,20,20)


        container.snp_makeConstraints { (make) -> Void in


            make.top.equalTo(self.view).offset(padding2.top)

            make.bottom.equalTo(self.view).offset(-padding2.bottom)

            // make.left.equalTo(self.view).inset(padding2.left)

            make.left.equalTo(self.view).offset(padding2.left)

            make.right.equalTo(self.view).offset(-padding2.right)

            //make.width.equalTo(self.view.bounds.width-90)

          /*
            make.top.equalTo(self.view).offset(20)
            make.left.equalTo(self.view).offset(20)
            make.bottom.equalTo(self.view).offset(-20)
            make.right.equalTo(self.view).offset(-20)
             */
        }


        let padding : UIEdgeInsets = UIEdgeInsetsMake(50, 50, 15, 10)




        v1.snp_makeConstraints { (make) -> Void in


         make.topMargin.equalTo(container).offset(padding.top);
         make.leftMargin.equalTo(container).offset(padding.left);

            make.width.equalTo(100);
            make.height.equalTo(100);
        }

score 1 · Accepted Answer · edited May 23 '17 at 12:07

1

replace

make.topMargin.equalTo(container).offset(padding.top);
make.leftMargin.equalTo(container).offset(padding.left);

with

make.top.equalTo(container).offset(padding.top);
make.left.equalTo(container).offset(padding.left);

The difference of left and leftMargin? Check this: https://stackoverflow.com/a/28692783/3331750

edited May 23 '17 at 12:07

Community

1
1

answered Jan 21 '16 at 12:09

Justlike

1,476
10
18

yeah working well .thank you . But @justlike snapkit good or not? if I focus on it , I will have problem on it or good library ? – Erhan Demirci Jan 21 '16 at 18:40
@ErhanDemirci snapkit is same cool as Masonry(OC) for swift. – Justlike Jan 22 '16 at 05:28

score 1 · Answer 2 · answered Jan 21 '16 at 12:12

I've never used snapkit but in regular auto layout you can achieve what you want in the following way.

    let container = UIView()
    container.backgroundColor=UIColor.greenColor()

    let v1 = UIView()
    v1.backgroundColor=UIColor.blackColor()

    self.view.addSubview(container)
    container.addSubview(v1)

    // enable the views to be resized by auto layout
    container.translatesAutoresizingMaskIntoConstraints = false
    v1.translatesAutoresizingMaskIntoConstraints = false

    // pin the container to all edges of the main view
    container.topAnchor.constraintEqualToAnchor(topLayoutGuide.bottomAnchor).active = true
    container.bottomAnchor.constraintEqualToAnchor(bottomLayoutGuide.topAnchor).active = true
    container.trailingAnchor.constraintEqualToAnchor(view.trailingAnchor).active = true
    container.leadingAnchor.constraintEqualToAnchor(view.leadingAnchor).active = true

    // anchor the v1 subview to the
    v1.topAnchor.constraintEqualToAnchor(container.topAnchor, constant: 20).active = true
    v1.leadingAnchor.constraintEqualToAnchor(container.leadingAnchor, constant: 20).active = true

   // set a fixed height and width
    v1.heightAnchor.constraintEqualToConstant(100).active = true
    v1.widthAnchor.constraintEqualToConstant(100).active = true

and for proportional height and width replace the final two lines of code with:

    v1.widthAnchor.constraintEqualToAnchor(view.widthAnchor, multiplier: 0.25).active = true
    v1.heightAnchor.constraintEqualToAnchor(view.widthAnchor, multiplier: 0.25).active = true

I am new on ios . I am learning to autolayout. somebody said apple autolayout is not good . what you think ? good or not ? I am confused . — Erhan Demirci, Jan 21 '16 at 18:29
@ErhanDemirci for iOS 9 and above anchors make AutoLayout much easier to understand and implement, especially when doing so programmatically. Btw these [blogposts](http://sketchytech.blogspot.co.uk/search/label/Fear%20and%20Loathing%20in%20Auto%20Layout) on the subject might help. I wrote them when trying to understand how it all worked. — sketchyTech, Jan 22 '16 at 09:38

AutoLayout incorrectly rendering subview's position

2 Answers2