Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

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

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

enter image description here

Screen2

enter image description here

like image 649
Voloda2 Avatar asked Mar 14 '12 13:03

Voloda2


1 Answers

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:

enter image description here

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."

like image 88
Flo Avatar answered Sep 21 '22 12:09

Flo