Is it possible to lay out 2 buttons vertically on UIAlertView?

Question

I want to create UIAlertView with two buttons. I need to lay out these buttons vertically (my text is too big). Is it possible ?

Screen1

Screen2

Solution 1

It's not possible by default. The appearance shown in nycynik's answer is what happens when you have more than two buttons.

So, either add another button, or you could look into a third-party solution such as this library, although I have not tested it.

Solution 2

There seems to be no SDK support for this behavior. Two buttons in a UIAlertView will always be shown in a horizontal layout.

However, it's pretty easy to just subclass UIAlertView to get the intended behavior. Let's call the class VerticalAlertView.

The following code only works for alert views with two buttons as more than two buttons in a UIAlertView will automatically be shown in a vertical layout.

VerticalAlertView.h is as simple as this:

#import <UIKit/UIKit.h>

@interface VerticalAlertView : UIAlertView
@end

VerticalAlertView.m:

#import "VerticalAlertView.h"

@implementation VerticalAlertView

- (void)layoutSubviews
{
    [super layoutSubviews];

    int buttonCount = 0;
    UIButton *button1;
    UIButton *button2;

    // first, iterate over all subviews to find the two buttons;
    // those buttons are actually UIAlertButtons, but this is a subclass of UIButton
    for (UIView *view in self.subviews) {
        if ([view isKindOfClass:[UIButton class]]) {
            ++buttonCount;
            if (buttonCount == 1) {
                button1 = (UIButton *)view;
            } else if (buttonCount == 2) {
                button2 = (UIButton *)view;
            }
        }
    }

    // make sure that button1 is as wide as both buttons initially are together
    button1.frame = CGRectMake(button1.frame.origin.x, button1.frame.origin.y, CGRectGetMaxX(button2.frame) - button1.frame.origin.x, button1.frame.size.height);

    // make sure that button2 is moved to the next line,
    // as wide as button1, and set to the same x-position as button1
    button2.frame = CGRectMake(button1.frame.origin.x, CGRectGetMaxY(button1.frame) + 10, button1.frame.size.width, button2.frame.size.height);

    // now increase the height of the (alert) view to make it look nice
    // (I know that magic numbers are not nice...)
    self.bounds = CGRectMake(0, 0, self.bounds.size.width, CGRectGetMaxY(button2.frame) + 15);
}

@end

You can now use your class like any other UIAlertView:

[[[VerticalAlertView alloc] initWithTitle:@"Title" 
                                  message:@"This is an alert message!" 
                                 delegate:self 
                        cancelButtonTitle:@"OK" 
                        otherButtonTitles:@"Second Button", nil] autorelease] show];

And you will get the following result:

EDIT:

Using this method is a bit risky (not to say hacky), as Apple might change the implementation of UIAlertView at some point, which could break your layout. I just wanted to point out that this would be an easy and fast solution for your problem. As mentioned in the UIAlertView reference:

"The UIAlertView class is intended to be used as-is and does not support subclassing. The view hierarchy for this class is private and must not be modified."

Solution 3

While creating UIAlertActions for UIAlertController, just append some white space to titles. Even though they will be trimmed while displaying, iOS lays out buttons vertically.

Tested on iOS 10.3.1 with 4.7" device. This amount of space is enough even for a button title 1 char length:

NSString* space = @" ";

Most probably it is OK for 3.5", 4" and 5.5" devices also.

Solution 4

UIAlertview delegates are deprecated in ios 9.0

Also when you add more than 2 buttons, they will be vertically assigned by IOS.

you can do with simply UIAlertController

UIAlertController * alert=   [UIAlertController
                                  alertControllerWithTitle:[[[NSBundle mainBundle] infoDictionary]
                                                            objectForKey:@"CFBundleDisplayName"]
                                  message:@"share via"
                                  preferredStyle:UIAlertControllerStyleAlert];
    
    UIAlertAction* fbButton = [UIAlertAction
                                actionWithTitle:@"Facebook"
                                style:UIAlertActionStyleDefault
                                handler:^(UIAlertAction * action)
                                {
                                    // Add your code
                                }];
    UIAlertAction* twitterButton = [UIAlertAction
                                   actionWithTitle:@"Twitter"
                                   style:UIAlertActionStyleDefault
                                   handler:^(UIAlertAction * action)
                                   {
                                       // Add your code
                                           
                                   }];
    UIAlertAction* watsappButton = [UIAlertAction
                                    actionWithTitle:@"Whatsapp"
                                    style:UIAlertActionStyleDefault
                                    handler:^(UIAlertAction * action)
                                    {
                                      // Add your code
                                    }];
    UIAlertAction* emailButton = [UIAlertAction
                                    actionWithTitle:@"Email"
                                    style:UIAlertActionStyleDefault
                                    handler:^(UIAlertAction * action)
                                    {
                                       
                                        // Add your code
                                    }];
    UIAlertAction* cancelButton = [UIAlertAction
                                  actionWithTitle:@"Cancel"
                                  style:UIAlertActionStyleDefault
                                  handler:^(UIAlertAction * action)
                                  {
                                      //Handel no, thanks button
                                      
                                  }];
    
    [alert addAction:fbButton];
    [alert addAction:twitterButton];
    [alert addAction:watsappButton];
    [alert addAction:emailButton];
    [alert addAction:cancelButton];
    
    [self presentViewController:alert animated:YES completion:nil];

View more solutions