Custom View in UIAlertController

Question

I am trying to put a custom view inside a UIAlertController. I'm running into some odd issues with the sizing of the custom view.

I want the custom view to span the width of the UIAlertController, whatever that might be. I'm using CGRectGetWidth(alertController.view.bounds) to get the width of the alert controller. However, this seems instead to be returning the width of the entire view. using view.frame does not make a difference.

UIAlertController *alertController = [UIAlertController alertControllerWithTitle:@"My Title" message:nil preferredStyle:UIAlertControllerStyleAlert];

UIView *view = [[UIView alloc] initWithFrame:CGRectMake(0, 0, CGRectGetWidth(alertController.view.bounds), 50)];
view.backgroundColor = [UIColor blueColor];

[alertController.view addSubview:view];
[self presentViewController:alertController animated:YES completion:nil];

This yields the results below. I have the same issue trying to get X, Y width and height properties of the UIAlertController. Does anyone know how I can position this view in the middle of the alert controller without using hard-coded numbers?

Sallust

Answer 1

You're not supposed to do that. To quote the docs:

The UIAlertController 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.

If you go against an explicit statement like that from Apple all bets are off, and even if you can get it to work on the current OS version, it could break with any future version.

Ursine

I'll add that using UIPresentationController you can easily replicate UIAlertController's behaviour and provide whatever views/controllers you'd like. – Magness

@jjatie, do you have any sample projects/tuts that use UIPresentationController to replicate/extend the behavior of UIAlertController? I haven't worked with UIPresentationController yet. – Ursine

Here is a starting point. The CoolPresentationController gets close. developer.apple.com/library/content/samplecode/LookInside/… There's an associated WWDC video too – Magness

Answer 2

Here's an alternative.It's not adding subview to UIAlertControl's view hierarchy, but to UIWindow instead in appropriate position. To track UIAlertControl's view frame the view controller is extended with a custom .view getter using obj-c runtime/swift extension which calls UIViewController super class implementation. This allows avoiding genuine view's private class dependence and is neither subclassing UIAlertControl or modifying it's view hierarchy.

Objective-C

#import <objc/runtime.h>
#import <objc/message.h>
@implementation AppDelegate
+ (UIView*)alertHelperView
{
    static UIView *alertHelperView = nil;
    static dispatch_once_t onceToken;
    dispatch_once(&onceToken, ^{
        alertHelperView = [UIView new];
        alertHelperView.backgroundColor = [UIColor redColor];
        alertHelperView.frame = CGRectZero;
    });
    return alertHelperView;
}

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
    [self.window addSubview:[AppDelegate alertHelperView]];
    return YES;
}
@end
@implementation ViewController

- (void)viewDidAppear:(BOOL)animated {
    Class class = [UIAlertController class];
    class_addMethod(class, @selector(view), imp_implementationWithBlock(^(__unsafe_unretained UIAlertController* self) {
        
        struct objc_super super = {
            .receiver = self,
            .super_class = class_getSuperclass(class)
        };
        
        id (*objc_msgSendSuper_typed)(struct objc_super *, SEL) = (void *)&objc_msgSendSuper;
        
        UIView* myView = objc_msgSendSuper_typed(&super, @selector(view));
        CGRect newFrame = myView.frame;
        if (!self.isBeingPresented) {
            [AppDelegate alertHelperView].frame = CGRectZero;
        } else {
            [[AppDelegate alertHelperView].superview bringSubviewToFront:[AppDelegate alertHelperView]];
            [AppDelegate alertHelperView].frame = CGRectMake(newFrame.origin.x,
                                                             newFrame.origin.y,
                                                             newFrame.size.width/2,
                                                             newFrame.size.height/2);
        }
        return myView;
    }), "@@:");
    
    UIAlertController * alert=   [UIAlertController
                                  alertControllerWithTitle:@"Info"
                                  message:@"You are using UIAlertController"
                                  preferredStyle:UIAlertControllerStyleAlert];
    
    UIAlertAction* ok = [UIAlertAction
                         actionWithTitle:@"OK"
                         style:UIAlertActionStyleDefault
                         handler:^(UIAlertAction * action)
                         {
                         }];
    UIAlertAction* cancel = [UIAlertAction
                             actionWithTitle:@"Cancel"
                             style:UIAlertActionStyleDefault
                             handler:^(UIAlertAction * action)
                             {
                             }];
    
    [alert addAction:ok];
    [alert addAction:cancel];
    
    [self presentViewController:alert animated:YES completion:nil];
}
@end

Swift 3.1

@UIApplicationMain
class AppDelegate: UIResponder, UIApplicationDelegate {
    
    var window: UIWindow?
        static var alertHelperView : UIView!
       
        func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplicationLaunchOptionsKey: Any]?) -> Bool {
            AppDelegate.alertHelperView = UIView()
            AppDelegate.alertHelperView.backgroundColor = .red
            self.window?.addSubview(AppDelegate.alertHelperView!)
            return true
        }
  }
    
    extension UIAlertController {
        open override var view: UIView! {
            get {
                let newFrame : CGRect = super.view.frame
                if !self.isBeingPresented {
                    AppDelegate.alertHelperView.frame = CGRect.zero
                } else {
                    AppDelegate.alertHelperView.superview?.bringSubview(toFront: AppDelegate.alertHelperView)
                    AppDelegate.alertHelperView.frame = CGRect(x:newFrame.origin.x,y:newFrame.origin.y,width:newFrame.size.width/2,height:newFrame.size.height/2)
                }
                return super.view
            }
            set(newValue) {
                super.view = newValue
            }
        }
    }

    class ViewController: UIViewController {
        override func viewDidAppear(_ animated: Bool) {
            let alertController = UIAlertController(title: "Default Style", message: "A standard alert.", preferredStyle: .alert)
            
            let cancelAction = UIAlertAction(title: "Cancel", style: .cancel) { action in
                // ...
            }
            alertController.addAction(cancelAction)
            
            let OKAction = UIAlertAction(title: "OK", style: .default) { action in
                // ...
            }
            alertController.addAction(OKAction)
            self.present(alertController, animated: false) {
            }
        }
    }
}

Statutory

Answer 3

this my solution for this problem:

protocol AlertPresenter {
  func showAlert()
}

extension AlertPresenter where Self: UIViewController {
  func showAlert() {
    
    guard let customView = CustomAlertView.instance else { return  }
    
    let alert = UIAlertController(title: "", message: nil, preferredStyle: .alert)
            
    let alertSize = customView.frame.size
    
    let view = UIView(frame: customView.bounds)
    view.center = CGPoint(x: alertSize.width / 2, y: alertSize.height / 2)
    view.backgroundColor = .clear
    view.addSubview(customView)
    
    alert.view.widthAnchor.constraint(equalToConstant: alertSize.width).isActive = true
    alert.view.heightAnchor.constraint(equalToConstant: alertSize.height).isActive = true

    alert.view.addSubview(view)

    present(alert, animated: true, completion: nil)
  }
}

CustomAlertView - Your custom view (in my case created with .xib)

.instance = Instance of CustomAlertView

And get something like that

Figurate