CODEWITHSUNDEEP
iphoneiosipad
BeachRunnerFred
BeachRunnerFred

Reputation: 18578

iOS: Why do I have white, rounded corners on my modal view?

I have a modal view popping up in my iPad app and for some reason it has white, rounded corners.

It might be worth noting I built this model view in my storyboard, not programmatically. However, in my viewWillAppear method, I'm setting the corner radius like so...

- (void)viewWillAppear:(BOOL)animated{
    [super viewWillAppear:animated];
    self.view.layer.cornerRadius = 6.0f;
}

When I set the value above 6, the white corners become visible. How can I set the value higher without these white rounded corners showing?

Thanks so much in advance for your wisdom!

Upvotes: 14

Views: 9709

Answers (9)

Adam Smith
Adam Smith

Reputation: 209

If you are using a popoverpresentationcontroller to show your view controller, try setting the backgroundcolor of the popoverpresentationcontroller to clear

    examplePopUpController = exampleViewController.popoverPresentationController!
    examplePopUpController?.backgroundColor = UIColor.clear

Upvotes: 0

Lynn S
Lynn S

Reputation: 369

In order to make the modal view transparent and make the transparency happen before the view appeared was to move self.view.superview.backgroundColor = [UIColor clearColor] from viewDidAppear to the following:

  • (void)viewWillLayoutSubviews{ [super viewWillLayoutSubviews];

    self.view.superview.backgroundColor = [UIColor clearColor]; }

Upvotes: 0

NathanAldenSr
NathanAldenSr

Reputation: 7961

Your question is ambiguous about what kind of presentation you're using for your view controller, so I'm going to assume you're using a form sheet. The solution is to set the superview's background color to [UIColor clearColor] to prevent the translucent background from appearing:

- (void) viewDidAppear:animated
{
    [super viewDidAppear:animated];

    self.view.layer.cornerRadius = 10;
    self.view.layer.masksToBounds = YES;
    self.view.superview.backgroundColor = [UIColor clearColor];
}

Before setting backgroundColor:

Before

After setting backgroundColor:

After

Upvotes: 20

Matt Becker
Matt Becker

Reputation: 2368

I agree with @PeterPurple's answer, but it took me some time to come up with code that actually worked. My example displays a modal view that is centered horizontally, but put more toward the top of the screen so the view doesn't obstruct the keyboard. Of course I could just move the view up when the keyboard shows, but I'm lazy. Anyhow, here's how I did it.

I created a custom modal segue and in that segue I overrode the perform: method as so:

@implementation CustomSegue

static const CGFloat TOP_MARGIN = 40;
static const CGFloat SUPER_VIEW_GAP = 10;

- (void)perform {
    UIView *destView = [self.destinationViewController view];

    [self.destinationViewController setModalPresentationStyle:UIModalPresentationPageSheet];
    [self.destinationViewController setModalTransitionStyle:UIModalTransitionStyleCrossDissolve];
    [[self sourceViewController] presentViewController:[self destinationViewController] animated:YES completion:nil];

    CGFloat x, y, width, height, yCenter;
    CGSize contentSize = [self.destinationViewController contentSizeForViewInPopover];

    x = destView.superview.frame.origin.x;
    y = destView.superview.frame.origin.y;
    width = contentSize.width;
    height = contentSize.height;
    yCenter = (height / 2.0) + TOP_MARGIN;

    destView.superview.frame = CGRectMake(x + SUPER_VIEW_GAP, y + SUPER_VIEW_GAP, width - (SUPER_VIEW_GAP * 2), height - (SUPER_VIEW_GAP * 2));
    destView.superview.autoresizingMask = UIViewAutoresizingNone;
    destView.superview.autoresizingMask = UIViewAutoresizingFlexibleBottomMargin;
    destView.superview.center = CGPointMake([[self.sourceViewController view] center].x, yCenter);
    destView.frame = CGRectMake(-SUPER_VIEW_GAP, -SUPER_VIEW_GAP, width, height);
}

Upvotes: 0

PeterPurple
PeterPurple

Reputation: 433

I realize this is an old question but it deserves an answer...

On the iPad Modal views (using UIModalPresentationFormSheet) have a default background which is a white bordered image with whitish dog eared corners. Anyway the default background will show through if your modal view background has round or transparent corners.

I spent a fair bit of time trying to figure out how to have my background view show without having the default background show. The trick is to make the superview smaller than your view:

vc.view.clipsToBounds = NO;
vc.view.superview.bounds = CGRectMake(vc.view.superview.bounds.origin.x, vc.view.superview.bounds.origin.y, 300, 480);

NOTES: the vc is the view you are presenting. Don't make the view too small or else your touch event will not work.

Upvotes: 2

cvsguimaraes
cvsguimaraes

Reputation: 13260

I'm my case the white stuff are hidden in the drop shadow's view at layer background color. Solved by changing the background to clear color:

//Monotouch code
View.Superview.Layer.BackgroundColor = UIColor.Red.CGColor;

If it's doesn't get rid of the white corner keep searching, remember to check out some properties of the View, SuperView and BackgroundViews:

  • Background color
  • Layer's background color
  • Layer's Border width and color
  • Heading
  • Clip to bounds

Note: DropShadow is visible as View's SuperView at ViewWillApper

Upvotes: 0

Luke
Luke

Reputation: 3433

Try

[self.view superview].layer.cornerRadius = 21.0f;
[self.view superview].layer.masksToBounds = YES;

Upvotes: 11

QED
QED

Reputation: 9933

Try in app delegate: [[self window] setBackgroundColor:[UIColor blackColor]];

Upvotes: 0

John Estropia
John Estropia

Reputation: 17500

That's weird. Try self.view.layer.masksToBounds = YES; too if that works. You'll probably lose your view's shadows though.

Come to think of it, that white thing probably comes from the view below your navigation bar.

Upvotes: 0

Related Questions