Custom UI: Popup in iOS Objective-C

Question

I want to create a custom popup and I want to generate a code dynamically without using UI drag and drop.

The view should look like:

I am using the following code to call the popup :

 CustomPopUp *cp = [[CustomPopUp alloc]init];
 cp.view.frame = CGRectMake(0.0, 0.0, 300, 300);
 KLCPopup* popup = [KLCPopup popupWithContentView:cp.view];
 [popup show];

The custom popup code looks like:

- (void)viewWillAppear:(BOOL)animated
{
    [super viewWillAppear:animated];
    self.gaScreenName = @"Login";
    if (firstPageLoad) {          
        return;
    }
    LinearLayoutPageHeading *heading = [[LinearLayoutPageHeading alloc] initWithText:@"Sign in." maxWidth:[LayoutValues getMaxWidthClipped]];

    [self.topContainerContent addObject:heading];
    NSString *content = @"New patient? Register here.";

    LinearLayoutLinksViewItem *contentItem = [[LinearLayoutLinksViewItem alloc] initLinksViewWithText:content font:[PPFonts genericParagraphFont] maxWidth:[LayoutValues getMaxWidthClipped] links:nil];
    [self.topContainerContent addObject:contentItem];
    LinearLayoutTextInputAndLabel *emailField = [[LinearLayoutTextInputAndLabel alloc] initWithLabelText:@"EMAIL ADDRESS" maxWidth:[LayoutValues getMaxWidthClipped]];
    emailField.textField.autocapitalizationType = UITextAutocapitalizationTypeNone;        
    LinearLayoutButton *continueButton = [[LinearLayoutButton alloc] initWithText:@"SIGN IN" maxWidth:[LayoutValues getMaxWidthClipped] url:nil type:@"primary"];
    [self.topContainerContent addObject:continueButton];
    LinearLayoutLinksViewItem *noticesPar = [[LinearLayoutLinksViewItem alloc] initLinksViewWithText:@"By clicking Sign In you agree to our Consent to Telehealth, Consent to Request Medical Services, Privacy Policy and Terms of Use." font:[PPFonts signInTermsParagraph] maxWidth:[LayoutValues getMaxWidthClipped] links:nil];
    noticesPar.padding = CSLinearLayoutMakePadding(0, noticesPar.padding.left, 10, noticesPar.padding.right);
    [self.topContainerContent addObject:noticesPar];
    [self renderPageContainers];
    firstPageLoad = YES;
}
@end

I am using custom created view controller but am getting a blank popup.

Is there a way to get the above layout using standard UIViewController? I am new to iOS development and have not dynamically generated UI views so far.

Tj3n · Answer 1 · 2016-12-23T09:18:35.610

1

If CustomPopUp is a viewcontroller, you need to instantiate it with a storyboard vc or a xib, something like this:

//For xib:
let a = UIViewController(nibName: "CustomPopUp", bundle: NSBundle.mainBundle()) as! CustomPopUp

//For storyboard
let b = UIStoryboard(name: "main", bundle: NSBundle.mainBundle()).instantiateViewControllerWithIdentifier("CustomPopup") as! CustomPopUp

Not totally sure how you are dealing with this, but I recommended you to create a custom view, not a custom viewcontroller, easier to create and use

edited Dec 23 '16 at 09:18

answered Dec 23 '16 at 08:58

Tj3n

9,837
2
24
35

Thanks will try that and let you know :) – Ackman Dec 23 '16 at 09:05

score 1 · Answer 2 · answered Dec 23 '16 at 10:10

Create a custom View with xib and add subview of your current view contoller.

make property instance of popupView

in your viewController.h

@property (strong,nonatomic) YourPopUpViewClass *popupView;

in your viewController.m

setUp Popup View

  self.popUpView.hidden = YES;
  self.popUpView.frame = [UIScreen mainScreen].bounds;
  self.popUpView.alpha = 0.0;
  self.popUpView.delegate = self; // for hide PopupView and Other Functinality if you need
 [self.view addSubview:self.popUpView];

Now Display On Button Click With Animation

-(void)showPopupView{

   self.popUpView.hidden = No;
    [UIView animateWithDuration:0.0 delay:0
                    options:UIViewAnimationOptionCurveEaseInOut
                 animations:^ {
                      self.popUpView.alpha = 0.0
                 }completion:^(BOOL finished) {

                     [UIView animateWithDuration:0.3
                                           delay:0
                                         options:UIViewAnimationOptionCurveEaseInOut
                                      animations:^ {
                                          self.popUpView.alpha = 1.0
                                      }completion:^(BOOL finished) {

                                      }];

                 }];
}

And Hide like this

-(void)hidePopupView {
    self.popUpView.hidden = No;
    [UIView animateWithDuration:0.3 delay:0
                        options:UIViewAnimationOptionCurveEaseInOut
                     animations:^ {
                         self.popUpView.alpha = 0.0
                     }completion:^(BOOL finished) {
                         self.popUpView.hidden = Yes;
                     }];
}

hope this will help you.

i applied . you have to remove this line --> self.popUpView.frame = [UIScreen mainScreen].bounds; . otherwise this will occupy whole screen . then our view will appear but this code does make background transparent . if you can figure it out then let me know how to do it ? — Moxarth, Jun 28 '17 at 12:47
i am just pushing another view from one view . the pushed view would appear transparent after this code . i have used it many times earlier . it is as simple as this . --> settings *set = [[settings alloc] initWithNibName:@"settings" bundle:nil]; --> set.view.backgroundColor = [ [UIColor blueColor] colorWithAlphaComponent:0.3f]; --> [self.navigationController pushViewController:set animated:YES ]; .... but with latest ios and xcode , pushed view does not become transparent anymore . so if you have any other solution for this then please let me know . — Moxarth, Jun 28 '17 at 12:49
you can check this questions. https://stackoverflow.com/questions/34994027/push-viewcontroller-with-transparent-background and https://stackoverflow.com/questions/18732715/viewcontroller-with-transparent-background-entering-current-viewcontroller-with — Pankaj K., Jun 29 '17 at 12:17
i have looked it earlier . then i have raised the question for this too . look into that . this [ https://stackoverflow.com/questions/44803428/pushed-view-should-appear-with-transparent-background/44818744?noredirect=1#comment76622073_44818744 ] . you will get idea , what i am looking for . — Moxarth, Jun 29 '17 at 12:40

score 0 · Accepted Answer · answered Dec 23 '16 at 13:21

0

Here is the good example for custom popup. Custom PopUP View. Just add your container in it.

answered Dec 23 '16 at 13:21

Ankit Saini

284
2
14

score 0 · Answer 4 · answered Dec 25 '16 at 02:20

Found a feasible solution. I used a third party library to achieve the result KLCPopup

However I have a new question. My popup does have a custom view but it comes from a separate class (view). How do I make my current view change based on input to the popup view? Can I have links to a few useful documents. I do not need code, just need to be pointed in the right direction.

Custom UI: Popup in iOS Objective-C

4 Answers4

Linked