UIAlertController action sheet whatsapp style

Question

Does anyone knows how to create an UIAlertController like that one that whatsapp did in the next attachment (beside of creating custom UI)

Basically what is your requirement? Do you want an icon with each `actionSheetOption`? — Adeel Miraj, Nov 14 '16 at 09:29

score 6 · Accepted Answer · answered Aug 03 '17 at 15:38

well, as a result from the discussion above, a solution found. basic idea is to use "contentViewController"

implementation smaple

ViewController.swift

@IBAction func testActionSheetAction(_ sender: Any) {

        let sheet = UIAlertController(title: "test", message: nil, preferredStyle: .actionSheet)

        let phoneAction = UIAlertAction(title: "", style: .default) { (_) in
            print("phone action")
        }
        phoneAction.mode = .phone
        sheet.addAction(phoneAction)

        let homeAction = UIAlertAction(title: "", style: .default) { (_) in
            print("home action")
        }
        homeAction.mode = .home

        sheet.addAction(homeAction)

        sheet.addAction(UIAlertAction(title: "cancel", style: .cancel, handler: nil))

        self.present(sheet, animated: true, completion: nil)

    }

ActionSheetContentViewController.swift

import UIKit

extension UIAlertAction{
    var mode : ActionSheetContentViewController.Mode?{
        set{
            let vc = ActionSheetContentViewController.viewController(with: newValue)
            self.setValue(vc, forKey: "contentViewController")
        }
        get{
            if let vc = value(forKey: "contentViewController") as? ActionSheetContentViewController{
                return vc.mode
            }

            return nil
        }
    }
}

class ActionSheetContentViewController: UIViewController {

    enum Mode{
        case home
        case phone

        var image : UIImage{
            get{
                switch self {
                case .home: return #imageLiteral(resourceName: "icon_home")
                case .phone: return #imageLiteral(resourceName: "icon_phone")
                }
            }
        }

        var title : String{
            get{
                switch self {
                case .home: return NSLocalizedString("home", comment: "home")
                case .phone: return NSLocalizedString("phone", comment: "phone")
                }
            }
        }
    }

    @IBOutlet weak var label: UILabel!
    @IBOutlet weak var imaegView: UIImageView!

    var mode : Mode?

    override func viewDidLoad() {
        super.viewDidLoad()

        label.text = mode?.title
        imaegView.image = mode?.image
    }

    class func viewController(with mode : Mode?) -> UIViewController{

        let storyboard = UIStoryboard(name: "Main", bundle: .main)
        let vc = storyboard.instantiateViewController(withIdentifier: "ActionSheetContentViewController") as! ActionSheetContentViewController

        vc.mode = mode

        return vc

    }
}

ActionSheetContentViewController in storyboard

a screenshot

as far as i know KVCing of "contentViewController" is not private API, but it is un-documented API, which means you have to validate it for all the iOS versions you are targeting. You can validate yourself that this is not private API (Product->Archive, then "validate...") — Benny Davidovitz, Jun 12 '18 at 08:22
Benny Davidovitz, thanks you so much for advice "how to check using private API"! Long time I've been looking for an easy way how to check private API, and here is it! — zslavman, Aug 02 '20 at 14:53

score 0 · Answer 2 · edited Jul 23 '17 at 20:42

0

Yes, you need to add a UITableView to the UIAlertController.

alertController.setValue([customTableGoesHere], forKey: "contentViewController")

edited Jul 23 '17 at 20:42

Alexan

8,165
14
74
101

answered Jul 23 '17 at 20:04

Jaime Hidalgo

1

I am familiar with that contentViewController, but 1: why UITableView and not a UIViewController subclass, 2: contentViewController, only helps to create a custom content within the UIAlertController, its not affecting the UIAlertAction. I could create my own UIViewController and present it over current context , but I'm looking to affect the UIAlertAction itself like KVCing the image... – Benny Davidovitz Jul 24 '17 at 11:54
1.- I found the UITableView more easy to add more than one cell, 2.- I don't know what KVCing image mean, for what I wanted works. – Jaime Hidalgo Jul 24 '17 at 16:08
KVC = Key Value Coding, see https://medium.com/@maximbilan/ios-uialertcontroller-customization-5cfd88140db8 for an example, but I'm asking about the alignment. maybe KVCing for contentViewController with view-controller that contains image and text will solve it – Benny Davidovitz Jul 31 '17 at 12:50
also see https://stackoverflow.com/questions/37744237/how-to-edit-uialertaction-text-font-size-and-color – Benny Davidovitz Jul 31 '17 at 12:52
What I notice when I put the iPhone in landscape and add a file, the UI is like a tableView. – Jaime Hidalgo Jul 31 '17 at 14:48

UIAlertController action sheet whatsapp style

2 Answers2