Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Custom view which looks like UIAlertView

I need something what looks like UIAlertView (same background transparent and not full screen), blocks other UI parts and has some custom content. This custom content are: two check-boxes with labels and two buttons YES/NO at the bottom.

Sub-classing or customizing UIAlertView doesn't looks useful (see this answer) and it is dangerous (code can be rejected by Apple). I was thinking to create own custom UIView (possible with UIViewController), but I have no idea how to make it look and feel like UIAlertView. I mean I'd like to make it that it changes its appearance dependent on iOS version (iOS7).

update: I can abandon os version dependency, it would be nice to have, but this is additional feature.
The main question is: is there a good way to make such view which will look and feel like UIAlertView without large amount of work? Customizing UIAlertView directly looks complicated and dangerous.

like image 526
Marek R Avatar asked Oct 01 '13 14:10

Marek R


2 Answers

I created my own custom view to look like iOS UIAlertView 7. With that technique you can create a custom alert for both iOS 6 and iOS 7. For that, I created a UIView in my xib file of my UIViewController :

enter image description here

I added some @property for this view :

// Custom iOS 7 Alert View
@property (nonatomic, weak) IBOutlet UIView *supportViewPopup; // My UIView
@property (nonatomic, weak) IBOutlet UIView *supportViewPopupBackground; // The grey view
@property (nonatomic, weak) IBOutlet UIView *supportViewPopupAction; // The white view with outlets
// Property for customize the UI of this alert (you can add other labels, buttons, tableview, etc.
@property (nonatomic, weak) IBOutlet UIButton *buttonOK;
@property (nonatomic, weak) IBOutlet UIButton *buttonCancel;
@property (nonatomic, weak) IBOutlet UILabel *labelDescription;

On my viewDidLoad :

- (void)viewDidLoad
{
    [super viewDidLoad];

       // Support View
    self.supportViewPopupAction.layer.cornerRadius = 5.0f;
    self.supportViewPopupAction.layer.masksToBounds = YES;

    // Add Support View
    [self.view addSubview:self.supportViewPopup];

    // Center Support view
    self.supportViewPopup.center = self.view.center;

    // Alpha
    self.supportViewPopup.alpha = 0.0f;
    self.supportViewPopupBackground.alpha = 0.0f;
    self.supportViewPopupAction.alpha = 0.0f;
}

Action to display Popup :

- (IBAction)displayPopup
{
    // Support View
    self.supportViewPopup.alpha = 1.0f;
    self.supportViewPopupBackground.alpha = 0.5f;

    // Animation
    [UIView animateWithDuration:0.5f
                     animations:^{
                         self.supportViewPopupAction.alpha = 1.0f;
                     }];
}

Action to dismiss Popup :

- (IBAction)dismissModal
{
    // Animation
    [UIView animateWithDuration:0.5f
                     animations:^{
                         self.supportViewPopup.alpha = 0.0f;
                         self.supportViewPopupBackground.alpha = 0.0f;
                         self.supportViewPopupAction.alpha = 0.0f;
                     }];
}

So, with that you can configure your supportViewPopupAction like you want with buttons, table view, labels, collection view, etc...

I spent time to write this example of alert view. I hope this will help you !

like image 152
Jordan Montel Avatar answered Oct 23 '22 08:10

Jordan Montel


Custom views can be passed to PXAlertView: https://github.com/alexanderjarvis/PXAlertView

like image 1
Adam W. Dennis Avatar answered Oct 23 '22 08:10

Adam W. Dennis