Why can't I set the background color of my custom UIView in Interface Builder?

Question

I'm diving into iOS development and I'm starting with a very simple example to understand using IB to create a custom view. I have a simple view controller...

@interface MyViewController ()
@property (weak, nonatomic) IBOutlet MyView *myView;
@end

@implementation MyViewController
//Boilerplate code...

And my custom view...

@implementation MyView

- (id)initWithCoder:(NSCoder *)aDecoder {
    self = [super initWithCoder:aDecoder];
    if (self) {
        self.backgroundColor = [UIColor redColor];
    }
    return self;
}

and in the app delegate, I set the root view controller to MyViewController...

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
    self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];
    MyViewController *myVC = [[MyViewController alloc] init];
    self.window.rootViewController = myVC;
    [self.window makeKeyAndVisible];
    return YES;
}

So I have a nib for MyViewController and a nib for MyView. In the nib for MyViewController, I dragged a UIView into the center of it and set the class for that view to MyView. When I run the app, I see the MyView view with the red background color. Here's my question: when I comment out the line of code in the MyView implementation file that sets the background color to red, and instead use the nib for MyView to set the background color to some other color in interface builder, the background color of the view is white. Why can't I set the background color of MyView in Interface Builder? Why does it only get set if I set it programmatically?

Thanks in advance for your wisdom!

score 1 · Answer 1 · answered Feb 08 '14 at 16:46

It's ultimately very simple, yet a bit tricky.

You need to realise one important fact. Things you see in Interface Builder are "frozen instances" of objects. They are awaken during initialisation by respective owner classes.

Thouroughly think about the relationships you have set up and the steps that happen during initialisation. Your VC gets set up as root view controller. That means, on your screen you see the content of VCs nib file, that is two views (UIview class instances) 1) ViewController's view 2) another UIview (you have set it's class to MyView)..

Now if you override initWithCoder in your MYview.m, of course it is executed and the color is set to red.It happens because you have set the 2) (up there) instance of UIview in you VCs nib is of custom class i.e.MyView.

On the other hand if you go to the MYView nib file ..you can set anything you want here but you won't see it on screen. Why? Because THIS instance is never awaken. It's simply a nib file that sits there in the project and is not used. The instance you see on screen is the instance that is coming from the main VC's view (it is its subview).

Basically you have 1 interface file MyView.h, 1 implementation file MYView.m and two instances of this class. Both are frozen in nibs. One is in VC's nib, the other one is in MyView.nib. You just do not use the MyView.nib.

The solution to make this work is out of scope of your question.

Ok, thanks Earl. I think I understand. Can I ask then what is best practice for adding a custom view, that is fully styled in a nib, as a subview? Should I just add it programmatically using alloc, initWithFrame, and addSubView? — BeachRunnerFred, Feb 08 '14 at 17:13
here's the correct solution http://stackoverflow.com/questions/5246074/uiview-subclass-with-its-own-xib/6749887#6749887 — Earl Grey, Feb 08 '14 at 17:29

Why can't I set the background color of my custom UIView in Interface Builder?

1 Answers1