5

I know how to add any Custom UI inside UIAlertView by using accessoryView like UITableView but I am now curious that if we still have option to add Custom UI inside an UIAlertController, what I am wanting to have is a UITableViewController inside an UIAlertController with clear understanding.

Syed Ali Salman
  • 2,894
  • 4
  • 33
  • 48

4 Answers4

27

Courtesy of StackOverflow users I was able to do this task.

Here is my code:

UIViewController *controller = [[UIViewController alloc]init];
UITableView *alertTableView;
CGRect rect;
if (array.count < 4) {
    rect = CGRectMake(0, 0, 272, 100);
    [controller setPreferredContentSize:rect.size];

}
else if (array.count < 6){
    rect = CGRectMake(0, 0, 272, 150);
    [controller setPreferredContentSize:rect.size];
}
else if (array.count < 8){
    rect = CGRectMake(0, 0, 272, 200);
    [controller setPreferredContentSize:rect.size];

}
else {
    rect = CGRectMake(0, 0, 272, 250);
    [controller setPreferredContentSize:rect.size];
 }

alertTableView  = [[UITableView alloc]initWithFrame:rect];
alertTableView.delegate = self;
alertTableView.dataSource = self;
alertTableView.tableFooterView = [[UIView alloc]initWithFrame:CGRectZero];
[alertTableView setSeparatorStyle:UITableViewCellSeparatorStyleSingleLine];
[alertTableView setTag:kAlertTableViewTag];
[controller.view addSubview:alertTableView];
[controller.view bringSubviewToFront:alertTableView];
[controller.view setUserInteractionEnabled:YES];
[alertTableView setUserInteractionEnabled:YES];
[alertTableView setAllowsSelection:YES];
UIAlertController *alertController = [UIAlertController alertControllerWithTitle:@"Title" message:@"Message" preferredStyle:UIAlertControllerStyleAlert];
[alertController setValue:controller forKey:@"contentViewController"];
UIAlertAction *cancelAction = [UIAlertAction actionWithTitle:@"Cancel" style:UIAlertActionStyleDestructive handler:^(UIAlertAction *action) {

}];
[alertController addAction:cancelAction];
[self presentViewController:alertController animated:YES completion:nil];

Checkout the snapshot here ;)

shim
  • 9,289
  • 12
  • 69
  • 108
Syed Ali Salman
  • 2,894
  • 4
  • 33
  • 48
9

Here's @Syed Ali Salman's answer in simplified form in Swift:

let alertController = UIAlertController(title: "The Title",
                                        message: "Here's a message.",
                                        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)

let tableViewController = UITableViewController()
tableViewController.preferredContentSize = CGSize(width: 272, height: 176) // 4 default cell heights.
alertController.setValue(tableViewController, forKey: "contentViewController")

yourTopViewController().presentViewController(alertController, animated: true)
{
    // ...
}
Community
  • 1
  • 1
meaning-matters
  • 21,929
  • 10
  • 82
  • 142
6
UIViewController *tempViewController = [[UIViewController alloc] init];
    tempViewController.view.backgroundColor = [UIColor redColor];

    [alertController setValue:tempViewController forKey:@"contentViewController"];

That piece of code will show a red view on the alert view,Now you can easily put a UITableView inside the UIViewController.Happy UIAlertController customizing ;)

Syed Ali Salman
  • 2,894
  • 4
  • 33
  • 48
M David
  • 260
  • 5
  • 18
1

Here is a Swift 5 Sample Code:

    //MARK: - Properties
    private var alertController = UIAlertController()
    private var tblView = UITableView()

    //MARK: - TableViewAlert
    private func setupTableViewAlert() {
    
    let alertVC = UIViewController.init()
    let rect = CGRect(x: 0.0, y: 0.0, width: 300.0, height: 300.0)
    alertVC.preferredContentSize = rect.size
    
    tblView = UITableView(frame: rect)
    tblView.delegate = self;
    tblView.dataSource = self;
    tblView.tableFooterView = UIView(frame: .zero)
    tblView.separatorStyle = .singleLine
    alertVC.view.addSubview(tblView)
    alertVC.view.bringSubviewToFront(tblView)
    alertVC.view.isUserInteractionEnabled = true
    tblView.isUserInteractionEnabled = true
    tblView.allowsSelection = true
    
    self.alertController = UIAlertController(title: "Select City", message: nil, preferredStyle: .alert)

    //this is the main part
    //add local alert content over global one
    alertController.setValue(alertVC, forKey: "contentViewController")
    
    let cancelAction = UIAlertAction(title: "Cancel", style: .default, handler: nil)
    
    alertController.addAction(cancelAction)
    self.present(alertController, animated: true, completion: nil)
}


extension SignupViewController: UITableViewDataSource {
func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
    return 10
}

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    let cell: UITableViewCell = UITableViewCell.init(style: .value1, reuseIdentifier: "cell")
    cell.textLabel?.text = "Cell \(indexPath.row + 1)"
    cell.textLabel?.textAlignment = .center
    cell.detailTextLabel?.textColor = .black
    return cell
}}

enter image description here

Jaipee1
  • 76
  • 7