UIAlertController - change size of text fields and add space between them

Question

My alert looks like this:

Is it possible to make inputs bigger and add space between them? Here is a snippet from my code. I tried changing the frame property of the second text field but it didn't help:

let alert = UIAlertController(title: title, message: message, preferredStyle: .Alert)

// Add the textfields
alert.addTextFieldWithConfigurationHandler({ (textField) -> Void in
  textField.placeholder = "Vaše jméno"

})

alert.addTextFieldWithConfigurationHandler({ (textField) -> Void in
  textField.placeholder = "Společné heslo"

  var oldFrame = textField.frame
  oldFrame.origin.y = 40
  oldFrame.size.height = 60
  textField.frame = oldFrame
})

Try to see [PMAlertController](https://github.com/Codeido/PMAlertController) a small library that allows you to substitute Apple's uncustomizable UIAlertController, with a beautiful and totally customizable alert. — Paolo Musolino, Jul 03 '17 at 10:03

score 11 · Accepted Answer · answered Nov 18 '15 at 18:05

11

UIAlertController views are intended to be simple and not customizable. If you make your own presented view controller, then the view belongs to you and you can do anything you like.

answered Nov 18 '15 at 18:05

matt

515,959
87
875
1,141

I know this is an old post and I've seen your work and red your article, but I ask anyway: if a pseudo-alert contained textfields, should we insert the custom view inside a scrollview? My goal is to build something like this one: https://cms-assets.tutsplus.com/uploads/users/1455/posts/27589/image/02.png (but with more customization) – Nov 14 '17 at 09:45
You could, but I would ask why not just a fullscreen presented view controller? Up to you of course – matt Nov 14 '17 at 15:07
maybe I'm missing something or I forgot to mention a "detail": my scrollview is inside a fullscreen modal. Are you suggesting a totally different thing? – Nov 15 '17 at 09:04

score 0 · Answer 2 · answered Oct 18 '18 at 16:33

WARNING: only use this solution as a last resort! If you want to fine-tune the look of your alert controller, use a custom alert view. Take a look at this question for details.

As a hacky solution, you can use a third text field between the two as a separator and disable it. Also, you can give it a custom height using this mehtod.

To avoid getting this extra text field in focus, use the UITextFieldDelegate method textFieldShouldReturn(_:) to get the second text field to focus instead.

class AlertViewController: UITextFieldDelegate {
    [...]

    var firstTextField: UITextField!
    var secondTextField: UITextField!

    func setUpAlert() {
        [...]

        alert.addTextField { [weak self] textField in
            self?.firstTextField = textField
            textField.delegate = self
        }

        alert.addTextField { textField in
            textField.addConstraint(textField.heightAnchor.constraint(equalToConstant: 2))
            textField.isEnabled = false
        }

        alert.addTextField { [weak self] textField in
            self?.secondTextField = textField
        }

        [...]
    }

    func textFieldShouldReturn(_ textField: UITextField) -> Bool {
        if textField == firstTextField {
            secondTextField?.becomeFirstResponder()
        }

        return true
    }
}

Result:

Unfortunately, you cannot hide the extra text field, but at least you can give it a background:

textField.backgroundColor = .black

Result:

UIAlertController - change size of text fields and add space between them

2 Answers2

Linked

Related