How can I load a ViewController or View into another ViewController with transparent background?

Question

In my app I want to have a custom popup to appear when called from a UIButton. Currently I'm using TSAlertView, but I want to implement more UI items and have a more custom build. So what I would like to do is load a viewcontroller or view within another viewcontroller and be able to pass information along between them both. See the example below:

From what I've read, supposedly it is not good practice to load another viewcontroller within another. In this case I would assume a uiview would be the recommended way. Is this correct?

I would like the viewcontroller behind the popup to have dimmed look, maybe a dark color with the opacity set at 70%. How can I achieve this?

Essentially I'm trying to build something similar to an AlertView with the appearance of another view.

Answer 1

If you intend to completely block the background view, you could set viewControllerB to Form Sheet .

When you are ready to show viewControllerB , use:

[viewControllerA presentViewController:viewControllerB animated:TRUE completion:nil]

You will need a way to dismiss viewControllerB ; a button, network action, etc.

An example with Storyboards:

- (void)someMethod {
  UIStoryboard *storyboard = self.storyboard;
  ViewControllerB *viewCotrollerB = [storyboard instantiateViewControllerWithIdentifier:@"ViewControllerB"];
  [self presentModalViewController:viewControllerB animated:YES];
}

Answer 2

Hi SReca,I was also having same requirement(like shown in above image) to create view like UIalertview which you are saying.

Here you will have to create a new UIView class instead of UIViewController, with no need of .xib.

In the new UIView's class in init method you will require to create your userinterface programmatically. And keep its height width as much as you want.

And for loading this new UIView you will have to just create object of that uiview and and call initwithframe it will present that view programmatically like uialerview.

Here is code for referece.

ModalPreviewViewController_iPhone.h

@interface ModalPreviewViewController_iPhone : UIView
@end

ModalPreviewViewController_iPhone.m

just modify this example code as per your need in initWithFrame

- (id)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self) {
        // Initialization code
        popUpView  = [[UIView alloc] initWithFrame:CGRectMake(30,30,260,420)];

        popUpBgView = [[UIView alloc] init];
        popUpBgView.frame =CGRectMake(0,0,260,420);
        [popUpBgView setBackgroundColor:[UIColor colorWithRed:51.0/255 green:51.0/255 blue:51.0/255 alpha:1]];
        [popUpView addSubview:popUpBgView];


        imageGalleryView=[[UIWebView alloc]initWithFrame:CGRectMake(0, 0, 260, 360)];
        [imageGalleryView setBackgroundColor:[UIColor redColor]];

        CGRect btnTempFrame=CGRectMake(5, 385, 90, 30);
        btnTemp=[[UIButton alloc]initWithFrame:btnTempFrame];
        [btnTemp setBackgroundImage:[UIImage imageNamed:@"btn_plain_iphone.png"] forState:UIControlStateNormal];
        [btnTemp.titleLabel setFont:[UIFont boldSystemFontOfSize:13]];
        [btnTemp.titleLabel setTextColor:[UIColor whiteColor]];
        [btnTemp addTarget:self action:@selector(onDownloadClick:) forControlEvents:UIControlEventTouchUpInside];

        CGRect btnSubscribeFrame=CGRectMake(100, 385, 90, 30);
        UIButton *btnSubscribe=[[UIButton alloc]initWithFrame:btnSubscribeFrame];
        [btnSubscribe setBackgroundImage:[UIImage imageNamed:@"btn_plain_iphone.png"] forState:UIControlStateNormal];

        [btnSubscribe.titleLabel setFont:[UIFont boldSystemFontOfSize:13]];
        [btnSubscribe.titleLabel setTextColor:[UIColor whiteColor]];
        [btnSubscribe setTitle:@"Subscribe" forState:UIControlStateNormal];
        [btnSubscribe addTarget:self action:@selector(moveTosubscribe:) forControlEvents:UIControlEventTouchUpInside];

        CGRect closeButtonFrame=CGRectMake(195, 385, 60, 30);
        UIButton *closeButton=[[UIButton alloc]initWithFrame:closeButtonFrame];
        [closeButton setBackgroundImage:[UIImage imageNamed:@"btn_plain_iphone.png"] forState:UIControlStateNormal];
        [closeButton.titleLabel setFont:[UIFont boldSystemFontOfSize:13]];
        [closeButton.titleLabel setTextColor:[UIColor whiteColor]];
        [closeButton setTitle:@"Close" forState:UIControlStateNormal];
        [closeButton addTarget:self action:@selector(closeView:) forControlEvents:UIControlEventTouchUpInside];

        CGRect swipeLabelFrame=CGRectMake(0, 0, 140, 15);
        UILabel *swipeLabel=[[UILabel alloc]initWithFrame:swipeLabelFrame];

        [swipeLabel setBackgroundColor:[UIColor clearColor]];
        [swipeLabel setText:@"> SWIPE TO SEE MORE"];
        [swipeLabel setTextColor:[UIColor lightGrayColor]];
        [swipeLabel setFont:[UIFont systemFontOfSize:12]];

        CGRect dateLabelFrame=CGRectMake(5, 365, 100, 15);
        dateLabel=[[UILabel alloc]initWithFrame:dateLabelFrame];

        [dateLabel setBackgroundColor:[UIColor clearColor]];
        [dateLabel setText:@"July 2013 #93"];
        [dateLabel setTextColor:[UIColor whiteColor]];
        [dateLabel setFont:[UIFont systemFontOfSize:13]];

        CGRect priceLabelFrame=CGRectMake(155, 365, 100, 15);
        priceLabel=[[UILabel alloc]initWithFrame:priceLabelFrame];

        [priceLabel setBackgroundColor:[UIColor clearColor]];
        [priceLabel setText:@"$3.9"];
        [priceLabel setTextColor:[UIColor colorWithRed:71.0/255 green:191.0/255 blue:226.0/255 alpha:1]];
        [priceLabel setFont:[UIFont systemFontOfSize:13]];
        [priceLabel setTextAlignment:NSTextAlignmentRight];



        CGRect labelFrame=swipeLabel.frame;
        labelFrame.origin=CGPointMake(popUpView.frame.origin.x+popUpView.frame.size.width - labelFrame.size.width, popUpView.frame.origin.y - labelFrame.size.height);


        [swipeLabel setFrame:labelFrame];

        [popUpView addSubview:imageGalleryView];
        [popUpView addSubview:btnTemp];
        [popUpView addSubview:closeButton];
        [popUpView addSubview:btnSubscribe];
        [popUpView addSubview:dateLabel];
        [popUpView addSubview:priceLabel];

        [UIView beginAnimations:@"curlup" context:nil];
        [UIView setAnimationDelegate:self];
        [UIView setAnimationDuration:.5];
        [UIView setAnimationTransition:UIViewAnimationTransitionCurlUp forView:popUpView cache:YES];
        [self addSubview:popUpView];

        [self addSubview:swipeLabel];
        [UIView commitAnimations];

        UIColor *color = [[UIColor alloc] initWithRed:0.0 green:0.0 blue:0.0 alpha:0.5];
        self.backgroundColor = color;

        [[[UIApplication sharedApplication] keyWindow] addSubview:self];
        [self initializeVariables];
    }
    return self;
}

And in Parent View controller just create object of UIView Class and call it with initWithFrame and size which you want

ModalPreviewViewController_iPhone *mpvc=[ModalPreviewViewController_iPhone alloc];

        if(appDelegate.isIphone5)
            mpvc=[mpvc initWithFrame:CGRectMake(0,0,320,480)];
        else
            mpvc=[mpvc initWithFrame:CGRectMake(0,0,320,568)];

And for dismissing UivewClass

write just following sentence to dismiss it ,in one of its(UIviewClass's) method like closeView

[self removeFromSuperview];

And let me know if you face any problem