Kodeco Forums

Video Tutorial: Introducing Custom Controls Part 2: Integration With Interface Builder

🎓 Courses & Articles
1

Learn how to properly integrate your custom controls with interface builder, massively improving the design time experience.

This is a companion discussion topic for the original entry at https://www.raywenderlich.com/4276-introducing-custom-controls/lessons/3
2

Hi Sam, is there a way we can integrate the custom control into the object library so you could just drag & drop it into the storyboard?

thanks

3

Hi @giguerea

Unfortunately that is not part of Xcode’s functionality. There is hope though, they did add the ability to write extensions for Xcode last year, so maybe they’ll extend it to include functionality like this.

sam

4

Hi Sam,
In lesson 2, in the class IconControl, you have declared imageView and label as private. When I did that these variables are not accessible in the extension. I had to make them public. Is that a problem? Why are they declared private to begin with?
Cheers
Lars Bevik

5

I noticed that in the downloaded file you have fileprivate, while in the video you are using just private. I am using Swift 3 and you are using an older version. Is that why it’s working for you?

6

When integrating with Interface Builder I’m putting an UIView in the middle of the screen and setting the Custom Class to IconControl. The control is then placed in the top left corner of the screen and not inside the UIView. It’s the same if I’m using your own project. Any explanation to that? Using Swift 3.

7

Hi @lbevik

  1. The problem is that the meaning of private changed between Swift 2 and Swift 3. Back in Swift 2 it meant that it’s accessible anywhere in the same file, whereas in Swift 3 it restricts it to the containing scope. There isn’t really any great problem using public other than a notion of tidiness.

  2. That is precisely why it works. fileprivate in Swift 3 is the equivalent to private in Swift 2, so that’s why it works.

  3. Erm, that sounds like it might be a bug with Xcode. What version are you using? I’ve not tried using @IBDesignable in recent versions of Xcode.

Hope that helps—there’s a fantastic new update to this course heading your way soon that will be fully up-to-date with Xcode and Swift.

sam

8

Sam,
I’m using xcode 8.2.1. I’ll revisit this course once it’s updated.
Cheers

9

Hi Sam,

I noticed that you declared and activated the constraints for the custom control within code. Is there anyway to do this in IB for custom controls. Like layout your uiimage and label the same way you would do so on a storyboard or a xib file. I haven’t been able to figure out a way to do it.

Xcode does not allow you to create a xib file for classes that extend UIViews. And even if you were to create a xib file a UIView, and build your constraints on IB, and have your controls "@IBOutlet"ed into a custom class, I’m not sure when and where these constraints are laid out. On a generic ViewController I believe they happen sometime between init and viewDidLoad but it’s difficult to warp a UIViewController life cycle into a custom control life cycle that only uses a UIView.

10

This happens if there are no constraint on your IconControl against the root view it is placed in. Simply dragging a view and changing the custom class is not enough. You need to set the layout on the IconControl like Sam does at 2:41 on the “Integration With Interface Builder” video

1 Like
11

Hi @kingreza

You definitely can do what you’re asking—it is possible to load a view from a XIB, but it’s not a very pleasant experience.

You might consider making the custom control an actual view controller, so you can use a XIB out-right and then using a container view to display it inside a different view controller. I haven’t actually tried doing this for just a simple control, but it certainly offers some advantages. There could well be many problems that I haven’t considered, but I definitely think it’s worth investigating.

sam