SnapKit throws an error when you try to give constraints to UIView

Question

I have a UIView that is hooked up to my View Controller as IBOutlet. I assigned an AnimationView class instance to this property in my ViewDidLoad method and set constraints to it with animationView.snp.makeConstraints { (make) in make.width.equalTo(view).multipliedBy(0.5) }

But when I run my project, I get this error message saying "Does the constraint or its anchors reference items in different view hierarchies? That's illegal"

I have no idea why I get this error message. Can anyone explain what I am doing wrong?

Below is image of my project:

And the source code in text:

import UIKit
import SnapKit
import Lottie

class ViewController: UIViewController {

    @IBOutlet var myView: UIView!
    
    override func viewDidLoad() {
        myView = AnimationView()
        myView.snp.makeConstraints { (make) in
            make.width.equalTo(view).multipliedBy(0.5)
            make.height.equalTo(view).multipliedBy(0.5)
        }
    }
    
}

Update:

How I fixed this problem was by these steps:

Create a placeholder view in Storyboard and add it as IBOutlet to your File's owner (make sure you type AnimationView as its class in the far right panel).
Create an animation view programmatically and add it to its immediate super view.
Give this animation view the same frame as the placeholder view animationView.frame = placeholderView.frame
Give constraints you want to the placeholder view (placeholderView.snp.makeConstraints { (make) in ... })

Now you hooked up your view created programmatically to your placeholder view in Storyboard. Your programmatic view will change size with the placeholder view's size.

Please post your code as text. – Sweeper Jun 29 '21 at 12:01 — Sweeper, Jun 29 '21 at 12:01

score 1 · Answer 1 · answered Jun 29 '21 at 12:02

1

1- You shouldn't change the type of the view

 @IBOutlet var myView:UIView!
 var animationV:AnimationView!

then

animationV = AnimationView()
view.addSubview(animationV)

2- Add centerX/Y constraints to animationV

BTW you don't have to set a view in IB , make it programmatic one only and give it all suitable constraints

answered Jun 29 '21 at 12:02

Shehata Gamal

98,760
8
65
87

The thing is I'm trying to create UI with Storyboard and if I make this view in code, I will not be able to see it in my Storyboard – Junsu Kim Jun 29 '21 at 12:07
Why should you see a programmatic view in IB ? – Shehata Gamal Jun 29 '21 at 12:08
BTW you can assign class name to view in IB `AnimationView` – Shehata Gamal Jun 29 '21 at 12:09
Just to know where it is on the screen so I can add more UI elements below the animationView. If you add a view programmatically, how do you add constraints to it in Storyboard for other views? – Junsu Kim Jun 29 '21 at 12:10
add it in IB and then link it as outlet and create your animation view in code and give it same constraints as the outlet view meaning top, left ,right and bottom like in answer – Shehata Gamal Jun 29 '21 at 12:12

Ayrton CB · Accepted Answer · 2021-06-29T12:09:34.210

First thing, In your code, you're not call super.viewDidLoad() this is very important and tbh might be causing the issue.

Secondly, change @IBOutlet to a var, so var myView: AnimationView!

Thirdly, you might need to add myView to your view, or to its parent before adding constraints, like this view.addSubView(myView)

var myView: AnimationView!

override func viewDidLoad() {
    super.viewDidLoad()
    myView = AnimationView()
    view.addSubView(myView)

    myView.snp.makeConstraints { (make) in
        make.width.equalTo(view).multipliedBy(0.5)
        make.height.equalTo(view).multipliedBy(0.5)
        make.centerY.equalTo(self.view)
        make.centerX.equalTo(self.view)
    }
}

If you want to keep it in Storyboard:

@IBOutlet weak var myView: AnimationView!

override func viewDidLoad() {
    super.viewDidLoad()

    myView.snp.makeConstraints { (make) in
        make.width.equalTo(view).multipliedBy(0.5)
        make.height.equalTo(view).multipliedBy(0.5)
        make.centerY.equalTo(self.view)
        make.centerX.equalTo(self.view)
    }
}

To keep it as storyboard you will need to set the class of the view in the storyboard to AnimationView

Can you create the same Animation View but with Storyboard? with IBOutlet.. — Junsu Kim, Jun 29 '21 at 12:08
Just updated my answer, you can, you just need to set a custom class on the view, if your using Xcode 12 then select the view and then tap the button that kinda looks like a news paper on the far right panel, you should then see a `Custom Class` field — Ayrton CB, Jun 29 '21 at 12:11
Spent hours trying to figure out what I did wrong and I didn't set the class of my IBOutlet to `AnimationView` in the far right panel in Storyboard. Thank you so much! — Junsu Kim, Jun 30 '21 at 03:42

SnapKit throws an error when you try to give constraints to UIView

Update:

2 Answers2