creating a black transparent modal view controller

Question

I wanted to create a modal view controller with a black background, but I want to make the alpha as 0.9, so I can still see the view behind it partially. How do I do this? I know I can use UIView and then just add that as a subview, however if I have a UINavigationController or UITabBarController, this won't cover the entire screen. Looking for some suggestions on this, as far as I know the solutions I've seen so far never dealt with a colored background.. most only wants a transparent background.

Answer 1

This will help you...

You just have to set background color as per your requirement.

Answer 2

Did you try

[viewController1 presentModalViewController:viewController2 animated:YES];

I haven't tried it myself but the documentation says it always presents it full screen. Then just set its view to have a backgroundColor = [UIColor colorWithWhite:0.0 alpha:0.9];. (white = 0.0 is black). Add whatever subviews you want. Or set the background color to be full black and the alpha of the whole view to be 0.9. It depends if you want the subviews also to be a bit translucent.

Answer 3

I got this idea from https://gist.github.com/1279713

Prepare: In the modal view xib (or scene using storyboard), I setup the full-screen background UIImageView (hook it with the .h file and give it a property "backgroundImageView") with 0.3 alpha. And I set the view (UIView) background color as plain black.

Idea: Then in "viewDidLoad" of the modal view controller I capture the screenshot from the original status and set that image to the background UIImageView. Set the initial Y point to -480 and let it slide to Y point 0 using 0.4-second duration with EaseInOut animation option. When we dismiss the view controller, just do the reverse thing.

Code for the Modal View Controller Class

.h file:

@property (weak, nonatomic) IBOutlet UIImageView *backgroundImageView;
- (void) backgroundInitialize;
- (void) backgroundAnimateIn;
- (void) backgroundAnimateOut;

.m file:

- (void) backgroundInitialize{
    UIGraphicsBeginImageContextWithOptions(((UIViewController *)delegate).view.window.frame.size, YES, 0.0);
    [((UIViewController *)delegate).view.window.layer renderInContext:UIGraphicsGetCurrentContext()];
    UIImage * screenshot = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    backgroundImageView.image=screenshot;
}
- (void) backgroundAnimateIn{
    CGRect backgroundImageViewRect = backgroundImageView.frame;
    CGRect backgroundImageViewRectTemp = backgroundImageViewRect;
    backgroundImageViewRectTemp.origin.y=-480;
    backgroundImageView.frame=backgroundImageViewRectTemp;

    [UIView animateWithDuration:0.4 delay:0.0 options:UIViewAnimationCurveEaseInOut animations:^{
        backgroundImageView.frame=backgroundImageViewRect;
    } completion:^(BOOL finished) {

    }];
}
- (void) backgroundAnimateOut{
    CGRect backgroundImageViewRect = backgroundImageView.frame;
    backgroundImageViewRect.origin.y-=480;

    [UIView animateWithDuration:0.4 delay:0.0 options:UIViewAnimationCurveEaseInOut animations:^{
        backgroundImageView.frame=backgroundImageViewRect;
    } completion:^(BOOL finished) {

    }];
}

In viewDidLoad, simply call:

[self backgroundInitialize];
[self backgroundAnimateIn];

In anywhere we dismiss the modal view controller, we call:

[self backgroundAnimateOut];

Please note that this will ALWAYS animate the background image. So if this modal view controller transition style (or the segue transition style) is not set to "Cover Vertical", you may not need to call the animation methods.

Answer 4

First add an UIImageView in you .h file

UIImageView *overLayImage;

now add below code in .m file on viewDidLoad()

overLayImage=[[UIImageView alloc] initWithImage:[UIImage imageNamed:@"overlay1px.png"]] ;
overLayImage.frame = self.view.frame;
overLayImage.frame = CGRectMake(0, 0, 1024, 748);

Where "overlay1px.png" is a transparent image of your color choice with height and width of 1px X 1px.

Now in your IBAction from where you want add your view with transparent backgroud add the below code

[self.view addSubview:overLayImage];

[vwTermsCondition setFrame:CGRectMake(262, 300, 500, 120)];
[vwTermsCondition.layer setCornerRadius:5.0f];
[vwTermsCondition.layer setShadowColor:[UIColor blackColor]];
[vwTermsCondition.layer setMasksToBounds:YES];
[self.view addSubview:vwTermsCondition];

In the above code vwTermsCondtion is the name of your view. This is for iPad appplication you can adjust height/width for iPhone.

Enjoy :)