UIPopover How do I make a popover with buttons like this?
Asked Answered
F

2

19

enter image description here

I'm wondering how I can create a popover with buttons like this.

ANSWER:

UIActionSheet * actionSheet = [[UIActionSheet alloc] initWithTitle: nil 
                                                          delegate: self
                                                 cancelButtonTitle: nil 
                                            destructiveButtonTitle: nil 
                                                 otherButtonTitles: @"Take Photo",
                                                                    @"Choose Existing Photo", nil];

[actionSheet showFromRect: button.frame inView: button.superview animated: YES];

Somewhere else in your delegated object class...

-(void)actionSheet:(UIActionSheet *)actionSheet clickedButtonAtIndex:(NSInteger)buttonIndex {
    if (buttonIndex == 0) {
         // take photo...
    } 
    else if (buttonIndex == 1) {
         // choose existing photo...
    }
}
Frons answered 24/5, 2012 at 19:45 Comment(0)
D
45

This is a UIActionSheet. On the iPhone, it animates in from the bottom. On the iPad it appears in a popover.

Assuming you're doing this on the press of a button:

UIActionSheet * actionSheet = [[UIActionSheet alloc] initWithTitle: nil 
                                                          delegate: self
                                                 cancelButtonTitle: nil 
                                            destructiveButtonTitle: nil 
                                                 otherButtonTitles: @"Take Photo",
                                                                    @"Choose Existing Photo", nil];

[actionSheet showFromRect: button.frame inView: button.superview animated: YES];

In iOS8+, you should use the new UIAlertController class:

UIAlertController * alertController = [UIAlertController alertControllerWithTitle: nil
                                                                          message: nil
                                                                   preferredStyle: UIAlertControllerStyleActionSheet];
[alertController addAction: [UIAlertAction actionWithTitle: @"Take Photo" style: UIAlertActionStyleDefault handler:^(UIAlertAction *action) {
    // Handle Take Photo here
}]];
[alertController addAction: [UIAlertAction actionWithTitle: @"Choose Existing Photo" style: UIAlertActionStyleDefault handler:^(UIAlertAction *action) {
    // Handle Choose Existing Photo here
}]];

alertController.modalPresentationStyle = UIModalPresentationPopover;

UIPopoverPresentationController * popover = alertController.popoverPresentationController;
popover.permittedArrowDirections = UIPopoverArrowDirectionUp;
popover.sourceView = sender;
popover.sourceRect = sender.bounds;

[self presentViewController: alertController animated: YES completion: nil];

or in Swift

let alertController = UIAlertController(title: nil, message: nil, preferredStyle: .ActionSheet)
alertController.addAction(UIAlertAction(title: "Take Photo", style: .Default, handler: { alertAction in
    // Handle Take Photo here
    }))
alertController.addAction(UIAlertAction(title: "Choose Existing Photo", style: .Default, handler: { alertAction in
    // Handle Choose Existing Photo
    }))
alertController.modalPresentationStyle = .Popover

let popover = alertController.popoverPresentationController!
popover.permittedArrowDirections = .Up
popover.sourceView = sender
popover.sourceRect = sender.bounds

presentViewController(alertController, animated: true, completion: nil)
Differ answered 24/5, 2012 at 19:56 Comment(4)
Do I just add this to the Popover view?Frons
No, just use one of the UIActionSheet showFrom... methods. See my updated answer for an exampleDiffer
Okay and 1 more question, how do I set up event handlers to the buttons?Frons
Can one put the new Facebook share button in a UIAlertController or would I need to write a customer popover? I tried the second approach, since Storyboard appears to choke on popover segues linked to a particular UITableViewCell and won't compile.Beaumont
S
2

Similar to the other responses, but this is very easy to implement in comparison.

Make your class use the UIActionSheetDelegate.

Example:

@interface ExampleViewController : UIViewController <UIActionSheetDelegate>

Then add to your ExampleViewController.mm/m

- (void)actionSheet:(UIActionSheet *)actionSheet clickedButtonAtIndex:(NSInteger)buttonIndex  { //Get the name of the current pressed button 
NSString *buttonTitle = [actionSheet buttonTitleAtIndex:buttonIndex]; 
if  ([buttonTitle isEqualToString:@"Remove"]) {
    NSLog(@"Remove this actionSheet"); } 
if ([buttonTitle isEqualToString:@"Button 1"]) {
    NSLog(@"Button 1 pressed"); } 
if ([buttonTitle isEqualToString:@"Button 2"]) {
    NSLog(@"Button 2 pressed"); }
if ([buttonTitle isEqualToString:@"Button 3"]) {
    NSLog(@"Button 3 pressed"); } 
if ([buttonTitle isEqualToString:@"Cancel"]) {
    NSLog(@"Cancel clicked (anywhere away from it)"); } }

Now in a button pressed event or where/when you want this to popup call the following:

    - (IBAction)aButtonPressed:(id)sender {
     NSString *actionSheetTitle = @"Action Sheet"; // Title 
     NSString *destroyTitle = @"Destroy"; // Button titles
     NSString *button1 = @"Button 1"; 
     NSString *button2 = @"Button 2";
     NSString *button3 = @"Button 3";
     NSString *cancelTitle = @"Cancel"; 
    UIActionSheet *actionSheet = [[UIActionSheet alloc]
                                  initWithTitle:actionSheetTitle
                                   delegate:self
                                   cancelButtonTitle:cancelTitle
                                   destructiveButtonTitle:destroyTitle
                                   otherButtonTitles:button1, button2, button3, nil]; [actionSheet showInView:self.view];
}

And more information about this @ : http://developer.apple.com/library/ios/#documentation/uikit/reference/UIActionSheet_Class/Reference/Reference.html

Serieswound answered 23/4, 2013 at 7:0 Comment(1)
Don't forget to add [actionSheet showFromRect:[(UIButton *)sender frame] inView:self.view animated:YES]; to attach the popover to the sender button.Smuts

© 2022 - 2024 — McMap. All rights reserved.