Adding autolayout constraint programmatically turns uiview to black

Question

I need a view controller without xib. There should be a webview with fully filled to the view. For that I've added the following code to loadView method.

- (void)loadView {
    CGRect applicationFrame = [[UIScreen mainScreen] applicationFrame];
    UIView *view = [[UIView alloc] initWithFrame:applicationFrame];

    view.translatesAutoresizingMaskIntoConstraints = NO;
    [view setBackgroundColor:[UIColor greenColor]];
    [self setView:view];
//    //create webview
    self.webview = [[UIWebView alloc] initWithFrame:CGRectZero];
    self.webview.translatesAutoresizingMaskIntoConstraints = NO;
    [view addSubview:self.webview];
    [self.webview setBackgroundColor:[UIColor orangeColor]];
    [self.webview setDelegate:self];

    NSDictionary *viewBindings = NSDictionaryOfVariableBindings(view,_webview);
//    //add constraints
    [view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[_webview]|" options:0 metrics:nil views:viewBindings]];
    [view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[_webview]|" options:0 metrics:nil views:viewBindings]];

}

But this turns the entire view to black. If I coment [view addConstraints:... method calls its showing a green view. What's wrong with my code?

If you haven't done so already, put a breakpoint in `viewDidLoad` and then check the frames of your views. Maybe that will give you a clue what could be wrong with your constraints. — koen, Mar 17 '15 at 12:34
If I put breakepoint in view dicload and check frames the result is like (lldb) po self.view > in both cases — Johnykutty, Mar 17 '15 at 12:37
At this point the frame is still `CGRectZero`. Which is why you see a black background. So your constraints are not right. I'm not at my Mac now, so cannot tell you what it should be. — koen, Mar 17 '15 at 14:26
BTW, why not make the webView your view with `applicationFrame `, and then you probably don't even need autolayout. — koen, Mar 17 '15 at 14:42
@Koen I need some more controls in the view, so I'm not setting the webview as view controller's view — Johnykutty, Mar 18 '15 at 05:55

score 5 · Accepted Answer · answered Mar 17 '15 at 16:13

5

I believe that the problem is that the parent view should not set translatesAutoresizingMaskIntoConstraints to false. The only view that must set that attribute to false is the one you are applying autolayout to, in this case webView. If you set view.translatesAutoresizingMaskIntoConstraints to false then you have to add constraints to view.

answered Mar 17 '15 at 16:13

Alvaro

1,188
13
21

hoo... thank you.. just setting view.translatesAutoresizingMaskIntoConstraints = YES; solved my problems – Johnykutty Mar 18 '15 at 05:51
@Johnykutty Happy to help! I would recommend you to keep `translatesAutoresizingMaskIntoConstraints` to false and add top, bottom, left and right constraints. Then, the view will stretch to the whole screen when you rotate it. – Alvaro Mar 18 '15 at 13:07

score 1 · Answer 2 · answered Mar 17 '15 at 15:02

You don't need to change the root view of the UIViewController manually, maybe that's why it does not work.

My suggestion would be to try this out:

- (void) viewDidLoad {
    [super viewDidLoad];

    self.webview = [[UIWebView alloc] init];
    self.webview.translatesAutoresizingMaskIntoConstraints = NO;
    [view addSubview:self.webview];
    [self.webview setBackgroundColor:[UIColor orangeColor]];
    [self.webview setDelegate:self];

    NSDictionary *viewBindings = NSDictionaryOfVariableBindings(view,_webview);
    [view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-0-[_webview]-0-|" options:0 metrics:nil views:viewBindings]];
    [view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-0-[_webview]-0-|" options:0 metrics:nil views:viewBindings]];
    // put a breakpoint after this line to see the frame of your UIWebView. 
    // It should be the same as the view
    [self.view layoutIfNeeded];
}

This should work and your UIWebView should be full screen. Good luck!

Adding autolayout constraint programmatically turns uiview to black

2 Answers2