18

I seem to enjoy designing new UIViews and UIControls that implement their own -drawRect: method. This work well for me, especially when composed using UIViews in Interface Builder.

But composing them in Interface Builder is annoying because they just show up as boring plain rectangles.

It would be great if the views would actually render themselves as the built-in controls do.

Is there any way I can structure my project so that Interface Builder will render my custom views?

Constantino Tsarouhas
  • 6,846
  • 6
  • 43
  • 54
Frank Krueger
  • 69,552
  • 46
  • 163
  • 208

2 Answers2

18

In order to do this, you actually have to create a plug-in for Interface Builder that uses your custom class. Once you create and install your plug-in, you will be able to drag and drop instances of your class (your view) onto another window/view/whatever just like any other control. To get started with creating IB Plug-Ins, please see the Interface Builder Plug-In Programming Guide. Also, I recommend taking a look at Aaron Hillegass's book, Cocoa Programming for Mac OS X. As well as being very well written and easy to understand, it has a chapter on creating your own IB Palette controls.

Alex Cio
  • 6,014
  • 5
  • 44
  • 74
Jason Coco
  • 77,985
  • 20
  • 184
  • 180
  • 23
    Just a comment for people arriving at this post in 2012+: Xcode 4 doesn't support IB plug-ins anymore. You're out of luck. – Constantino Tsarouhas Dec 08 '12 at 12:27
  • Thanks @RandyMarsh for saving me possibly 30-60 mins :) – Ege Akpinar Jan 06 '13 at 19:33
  • 1
    @EgeAkpinar You're welcome. :-) And I'm sorry for you having to continue searching for an inelegant solution for your problem, whatever it might be. :-p – Constantino Tsarouhas Jan 06 '13 at 23:31
  • In my copy of Hillegass's book (third edition, same as the one you linked to) I can't find a chapter on creating your own IB Palette controls. Could you perhaps give me the page number/chapter title? – 11684 Mar 06 '13 at 10:50
  • 1
    I can't find any differences between the index of the online version and my copy either. Are you sure it is in that book? By the way, the link to Apple's IB Plug-in Programming Guide is dead. – 11684 Mar 06 '13 at 11:01
  • 2
    To be clear: Is this impossible using Xcode 4+ and storyboards? – Daniel Apr 18 '13 at 21:50
  • @JasonCoco I updated the link, 11684 what about updating the link by your self, the name of the document won't change ;) and google gives you the ability to search even JUST a name..... – Alex Cio Mar 24 '15 at 12:15
1

This is achievable by marking your UIView subclass with @IBDesignable. Once you do this, your custom views will render themselves in Interface Builder. You can even add parameters that can be configured by marking them as @IBInspectable. Here's a Swift example:

@IBDesignable class customView: UIView {

    @IBInspectable var count: Int = 0

}

There's an article on NSHipster that provides more detail.

tebs1200
  • 1,205
  • 12
  • 19
  • 1
    By using above approach we can't add the Custom view in Object Library. – ManiaChamp Mar 08 '17 at 09:24
  • @ManiaChamp, You're right, but the question doesn't ask about getting the view added to the object library. – tebs1200 Mar 09 '17 at 14:18
  • 2
    This question is linked to another that asks how to add a custom view in the Object Library - so lots of us are coming here looking for that. ;) – leanne Aug 12 '17 at 23:15