A Swift/iOS Class Equivalent to Android Dialog?

418 Views Asked by At

If I want to create a pop up view in Android, say on clicking a button, a QR code will pop up and things behind will be blurred a bit, I called the Dialog class in Android/Java, which I think is more like a View in iOS.

May I know whether there is a class which is almost equivalent in iOS? I googled around and seems no one mention about that. While some might say I could use AlertController, I would say the experience is completely different. Dialog in Android can contain everything - text, buttons, images, layouts, you name it, while AlertController in iOS is literally just the alert and it does not expect you to do so much customization.

Can anyone illustrate the road ahead for me?

1

There are 1 best solutions below

2
Ars_Codicis On

You use UIAlertController in Swift.

Example

 DispatchQueue.main.async {

            let alertController = UIAlertController(title: "My Title", message: "My Message", preferredStyle: .alert)


            alertController.view.tintColor = UIColor.blue //Change this or remove


            //Blur Effect

            let blurEffect = UIBlurEffect(style: .light)
            let blurVisualEffectView = UIVisualEffectView(effect: blurEffect)

            blurVisualEffectView.frame = self.view.bounds

            self.view.addSubview(blurVisualEffectView) //Add the blur effect to the dialog

            //Set Image   
         
            var myImage = UIImageView(frame: CGRect(x: 89, y: 35, width: 95, height: 80))
            myImage.image = UIImage(named: "MyImage")!

            alertController.view.addSubview(myImage)

            //Button actions

            let cancelAction = UIAlertAction(title: "Cancel", style: .destructive) {_ in
                        
                    blurVisualEffectView.removeFromSuperview()

            }
                    
            let okAction = UIAlertAction(title: "OK", style: .default) {_ in

                    blurVisualEffectView.removeFromSuperview()
                        
            }

            //Height constraint handler

            var height: NSLayoutConstraint = NSLayoutConstraint(

                item: alertController.view, attribute: 
                   NSLayoutConstraint.Attribute.height,

                relatedBy: NSLayoutConstraint.Relation.equal, toItem: nil,

                attribute: NSLayoutConstraint.Attribute.height,
               
                //Change this as desired

                multiplier: 1, constant: self.view.frame.height * 0.4) 
            
             alertController.view.addConstraint(height) //Set the constraint
                   

            alertController.addAction(cancelAction)
            alertController.addAction(okAction)
                   
             

            //Display (present) the alertcontroller

            self.present(alertController, animated: true, completion: nil)
            
        }

Result

Result

Breaking This Down

  • Declare the alertController. Set the title to "My Title" and the message.
  • Set the tintColor. This changes it to custom colors other than the default iOS blue tint.
  • Add the UIBlurEffect. "Tries" to mimic Androids AlertDialog. :)
  • Declare and add the UIImageView to the alertController as a sub view
  • Add the action buttons. cancelAction and okAction. Notice the style: property? This allows you to choose between .destructive, and .default. .destructive makes the button red-tinted, and .default leaves it as the alertController's tintColor.
  • Add a height constraint. Useful if you want more content visible (like UIImageViews)
  • Use the alertController.addAction functions to add our buttons, and present it.
  • Extra note: All of this is contained inside DispatchQueue.main.async {}. This is useful if you want to show your dialog before the parent ViewController is fully loaded. (E.G. You show your dialog in the .viewDidLoad function.