Creating popover view controllers for Iphone in Interface Builder

10,892

Solution 1

Since You did not specified target device in your question, I gave you Ipad answer

IPAD:

Go to your storyboard drag and drop a viewcontroller or tableviewcontroller its up to you. Then create a segue from desired viewcontroller on your storyboard to newly dragged/dropped viewcontroller. Choose your segue as popOver.

enter image description here

enter image description here

Make sure you choose an anchor in segue settings like above picture. Then you need to edit size of your popover . If its a uiviewcontroller choose its view,if its a tableviewcontroller choose its tableview on left side of interface builder and edit its size.

First:

enter image description here

Second:

enter image description here

After that customize your popover view controller (dragged/dropped view controller) add button,label whatever you want.

If you are going to do additional things in your popover: Dont forget to create new file -> subclass of uiviewcontroller or uitableviewcontroller. Then associate it with your newly created viewcontroller on storyboard.

enter image description here

IPHONE:

There are no Popover controllers in iphone

But you try to use a third party https://github.com/50pixels/FPPopover solution that mimics popover behaviors in iphone by using QuartzCore

I would try following:

First:

Again drag and drop a uiviewcontoller to your storyboard, then create a new file-> subclass of uiviewcontroller .

This new uiviewcontroller will sit in the corner in your storyboard

Then associate your uiviewcontroller in your storyboard with new Created file , lets say you created a new file name with YourViewController . Give your view a storyboard id and choose its class name.

enter image description here

-(IBAction)buttonClicked:(UIButton*)okButton
{
    //the view controller you want to present as popover
    YourViewController *controller = [[YourViewController alloc] init]; 

    //if [[YourViewController alloc] init]; doesn't work try this
   // UIStoryboard* sb = [UIStoryboard storyboardWithName:@"MainStoryboard"
                                                     bundle:nil];
    //YourViewController *controller = [sb instantiateViewControllerWithIdentifier:@"YourViewController"]; 

    //our popover
    FPPopoverController *popover = [[FPPopoverController alloc] initWithViewController:controller]; 

    //the popover will be presented from the okButton view 
    [popover presentPopoverFromView:okButton]; 

    //no release (ARC enable)
    //[controller release];
}

Note: I havent used that FPPopover before so dont know how to arrange screen size but there must be further explanation in their documents just read it.

Solution 2

iPhone solution

Since iOS 8.0 is is possible to realize this for iPhone apps too!

The target view controller (the one, which should appear in a popover) needs to conform to the 'UIPopoverPresentationControllerDelegate' protocol and has to implement the message 'adaptivePresentationStyleForPresentationController:traitCollection:'. In addition to this its 'modalPresentationStyle' should be 'UIModalPresentationPopover' and the controller should be his own 'UIPopoverPresentationController' delegate.

After preparing the view controller this way, just create a storyboard segue (type: 'Present As Popover') from your UINavigationBarItem (or anything else) to the target view controller.

enter image description here

Implementation:

@implementation TestViewController

/*
 initWithCoder:

 */
- (instancetype)initWithCoder:(NSCoder *)pDecoder {
    //FLog;

    if (self = [super initWithCoder:pDecoder]) {

        self.modalPresentationStyle = UIModalPresentationPopover;
        self.popoverPresentationController.delegate = self;
    }
    return self;
}


#pragma mark - POPOVER PRESENTATION CONTROLLER DELEGATE

/*
 adaptivePresentationStyleForPresentationController:traitCollection:

 */
- (UIModalPresentationStyle)adaptivePresentationStyleForPresentationController:(UIPresentationController *)pController
                                                               traitCollection:(UITraitCollection *)pTraitCollection {
    //FLog;

    return UIModalPresentationNone;
}

// ...

@end

Of course the delegate protocol can be implemented in some other class also, but this way is the easiest one :-)

Solution 3

I think the better approach for the iPhone device is, that you create a View Controller whose View has the background colour set to clear. Then in this view you just add a smaller sized view which will give the appearance of a popup.

Presenting this view controller will give the appearance of a popup. This is the approach I took. If the user taps on an area on the parent view that is outside the bounds of the smaller view, you can dismiss the view controller.

Share:
10,892
Doug Smith
Author by

Doug Smith

I'm a web designer playing around with iOS from England

Updated on June 05, 2022

Comments

  • Doug Smith
    Doug Smith almost 2 years

    How do I go about doing this? I know I have to give the popover a view controller that it constructs its view from, but I don't know how to construct this view in Interface Builder (like adding the labels and buttons and whatnot).

    Do I just do it in the normal storyboard and have a storyboard that's randomly not connected to anything else, sitting off in the corner?

    Do I create another storyboard?

    Do I create a xib even though my project is all storyboard?

    Do I create it programatically?

  • Doug Smith
    Doug Smith about 11 years
    Excellent, thank you. However, if I'm using the FPPopover library (iPhone port of the iPad popover), where it just needs a view for the popover, could I just create a normal segue? I understand completely if you don't know, I misguidedly thought that it would be the same for both (most things seem to be).
  • SpaceDust__
    SpaceDust__ about 11 years
    @DougSmith yes not everything is the same for ipad and iphone so no you cant create a popover segue in Iphone Storyboard. When you try to perform segue in iphone (push,modal) segue will replace the current view so it won't work. If you try custom segue may be you can achieve it but I doubt it. So you cant do it with segue for Iphone, I will try yo edit my answer and provide a possible solution for you.
  • SpaceDust__
    SpaceDust__ about 11 years
    @DougSmith try my iphone answer not sure if it will work though.
  • vinothp
    vinothp over 10 years
    @SpaceDust Hi,I have done the popup view. The thing is i have a button in the popup view.When i press that button the pop up view should get dismissed. I am trying this for one day but couldn't find the solution for it. Any idea from you will be really helpful for me. Much Appreciated.
  • SpaceDust__
    SpaceDust__ over 10 years
    @Vino in your buttons method call [self dismissViewControllerAnimated:YES completion:NULL]; if that doesnt work post a question, I am sure if you show your code people will answer it
  • vinothp
    vinothp over 10 years
    @SpaceDust Hi thanks for your reply. Finally found it. [self dismissViewControllerAnimated:YES completion:NULL]; this doesn't work with the popOver. But [self.popOverController dismissPopoverAnimated:YES]; does the trick.
  • LaborEtArs
    LaborEtArs over 7 years
    See other solution below for iPhone apps since iOS 8.0. No third party code needed anymore!