How to create popover in iPhone app?

Question

I'm looking for popover in iPhone and i want to make it like iOS 5 Reader feature:

After little research i found WEPopover and FPPopover but i'm looking if there anything like this API built-in iphone SDK.

Solution 1

You could make a UIView with some custom artwork and display it with an animation on top of your view as a "popover" with some buttons like so:

UIView *customView = [[UIView alloc] initWithFrame:CGRectMake(25, 25, 100, 50)]; //<- change to where you want it to show.

//Set the customView properties
customView.alpha = 0.0;
customView.layer.cornerRadius = 5;
customView.layer.borderWidth = 1.5f;
customView.layer.masksToBounds = YES;

//Add the customView to the current view
[self.view addSubview:customView];

//Display the customView with animation
[UIView animateWithDuration:0.4 animations:^{
    [customView setAlpha:1.0];
} completion:^(BOOL finished) {}];

Don't forget to #import <QuartzCore/QuartzCore.h>, if you want to use the customView.layer.

Solution 2

Since iOS8 we are now able to create popovers, that will be the same on iPhone, as on iPad, which would be especially awesome for those who make universal apps, thus no need to make separate views or code.

You can get the class as well as demo project here: https://github.com/soberman/ARSPopover

All you need to do is subclass UIViewController, conform to the UIPopoverPresentationControllerDelegate protocol and set desired modalPresentationStyle along with the delegate value:

// This is your CustomPopoverController.m

@interface CustomPopoverController () <UIPopoverPresentationControllerDelegate>

@end

@implementation CustomPopoverController.m

- (instancetype)init {
    if (self = [super init]) {
        self.modalPresentationStyle = UIModalPresentationPopover;
        self.popoverPresentationController.delegate = self;
    }
    return self;
}

- (UIModalPresentationStyle)adaptivePresentationStyleForPresentationController:(UIPresentationController *)controller {
    return UIModalPresentationNone; //You have to specify this particular value in order to make it work on iPhone.
}

Afterwards, instantiate your newly created subclass in the method from which you want to show it and assign two more values to sourceView and sourceRect. It looks like this:

CustomPopoverController *popoverController = [[CustomPopoverController alloc] init];
popoverController.popoverPresentationController.sourceView = sourceView; //The view containing the anchor rectangle for the popover.
popoverController.popoverPresentationController.sourceRect = CGRectMake(384, 40, 0, 0); //The rectangle in the specified view in which to anchor the popover.
[self presentViewController:popoverController animated:YES completion:nil];

And there you have it, nice, neat blurred popover.

Comments

[Xtrician]

If i want to add buttons in it, the problem is all the buttons are stays in one place, you have an idea how i can to place the buttons side by side?

[Aleksander Azizi]

[yourButton setFrame:CGRectMake(5 /*X*/, 2 /*Y*/, 10 /*Width*/, 20 /*Hight*/)]; // change the X(5) Y(2) for placement

[BigSauce]

@AleksanderAzizi: where is the code that makes the triangle shape at the top left of the 'popover' view that you created?

[chandru]

I have created a custom view with a button, when I click the button, the custom view should be dismissed and the previous view controller should be displayed

[Vitalii Gozhenko]

One remark: self.modalPresentationStyle = UIModalPresentationPopover; should be first, because in other case popoverPresentationController will be nil

[Martin]

Marvelous. The API has evolved since the original question, now this should be the accepted answer.