How to create transparent, modal UIViewController on iPhones iOS7+?

Question

I have a relatively simple question that I can't seem to figure out.

I'm inside of a UIViewController (myViewController) that's embedded somewhere inside a UIViewController hierarchy (somewhere underneath a parent UITabBarController).

myViewController has a button. When that button is pressed, I want to overlay the entire screen (including all the goo from the parent UITabBarController) with a black, translucent, modal UIViewController (myModalViewController) with other goo on it.

If I just call

[myViewController presentViewController:myModalViewController..]

the visuals of myViewController disappears as soon as the transition is over, thereby defeating the point of a translucent overlay.

If I set myModalViewController as the child view controller of myViewController and add myModalViewController.view as the subview of myViewController.view, the modal view controller with the translucent black background appears UNDERNEATH all the buttons of the UITabBarController. That's bad, because I want the entire screen to be overlaid.

So, instead, I look for the top-most view controller in the hierarchy and add myModalViewController as the child of it thusly:

UIViewController* root = myViewController;
while (root.parentViewController) {
    root = root.parentViewController;
}

[root addChildViewController:myModalViewController];
[root.view addSubview:myModalViewController.view];

If this the right way to handle this scenario? It seems kludgy.

Also, how do I make myModalViewController behave modally and swallow all touch gestures so that all the UI underneath it doesn't respond to touches? Right now it does and all of my attempts to fix it have failed. Also myModalViewController and all of the UIViews in it don't appear to be receiving any touch notifications what's-so-ever.

TonyMkenu · Accepted Answer · 2015-02-12T20:14:08.850

1

If you want transparent ViewController you must use UIModalPresentationCustom Something like this...

...
[yourModalCtrl setModalPresentationStyle:UIModalPresentationCustom];
[yourModalCtrl setModalTransitionStyle:UIModalTransitionStyleCrossDissolve];
[self setModalPresentationStyle:UIModalPresentationCurrentContext]; //new
//yourModalCtrl.modalPresentationCapturesStatusBarAppearance = YES;
[self presentViewController: yourModalCtrl animated:Yes completion:completion];

[self presentViewController:....] or what is your "Presenting controller"...

http://b2cloud.com.au/how-to-guides/invisible-background-modal-view/

update

for compatibility with iOS 7 you need to add new [self setModalPresentationStyle:UIModalPresentationCurrentContext]; - check the all code. Also, you have to set animate : No (it's working with Yes but You will have a message in console :)

edited Feb 12 '15 at 20:14

answered Feb 11 '15 at 07:48

TonyMkenu

7,367
3
25
47

This doesn't seem to work for me (iOS8.1). You'd think it would be this simple, but the presenting controller still disappears after the animation completes. I'm using a UIViewController that isn't the root. Let me try doing this on the root controller instead... – pfg2009 Feb 11 '15 at 18:48
This totally works. Thank you, thank you, thank you! I was doing things out of order (since all of these UIModelXYZ constants look visually similar to each other). However, using the same order you listed does the trick beautifully. – pfg2009 Feb 11 '15 at 19:13
I take it back. This works on iOS8 like a charm. However, on iOS 7 it doesn't work. Hmm... Is there some way that you may know of that would solve this issue on iOS 7 as well? – pfg2009 Feb 12 '15 at 04:11
Here is another answer that addresses the iOS7 issue: http://stackoverflow.com/questions/11236367/display-clearcolor-uiviewcontroller-over-uiviewcontroller – pfg2009 Feb 12 '15 at 04:18
Yes. Checkout the extra goo you need to add for iOS7 here: http://stackoverflow.com/questions/11236367/display-clearcolor-uiviewcontroller-over-uiviewcontroller – pfg2009 Feb 19 '15 at 19:33

score 0 · Answer 2 · answered Feb 10 '15 at 23:08

In a similar situation what I did was:

I added an UIImageView as the background image of my Modal View Controller.

Then I used the UIImage + ImageEffects category provided by apple, for creating a blurred image of my parent view controller.

I implemented a method in my parent class like:

// Returns the blurred image
- (UIImage *)getBlurredImage
{
    // You will want to calculate this in code based on the view you will be presenting.
    CGSize size = self.view.frame.size;

    UIGraphicsBeginImageContext(size);

    // view is the view you are grabbing the screen shot of. The view that is to be blurred.
    [self.view drawViewHierarchyInRect:(CGRect)self.view.bounds afterScreenUpdates:YES];
    UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();

    // Gaussian Blur
    image = [image applyDarkEffect];

    // Box Blur
    // image = [image boxblurImageWithBlur:0.2f];

    return image;
}

I passed the UIImage generated through this method to my modal view controller and set it as the background image (To the image view I added previously).

Yes, this is one way of handling things, thank you. I'm curious, though, whether I can get by without having to cache anything. — pfg2009, Feb 11 '15 at 02:06
In other words, I'm looking for a less heavy-handed solution. — pfg2009, Feb 11 '15 at 03:43

How to create transparent, modal UIViewController on iPhones iOS7+?

2 Answers2