Material: Using becomeFirstResponder() on TextField hides the placeholder text

Created on 19 May 2016  路  5Comments  路  Source: CosmicMind/Material

I have a few TextField and when I use .becomeFirstResponder() on any of them the placeholder text disappears.

Here's a quick example of the code I have:

class FormViewController: UIViewController {
    private nameTextField: TextField!

    override func viewDidLoad() {
        super.viewDidLoad()
        prepareTextField()
        nameTextField.becomeFirstResponder() // this call
    }

    func prepareTextField() {
        nameTextField = TextField()
        nameTextField.placeholderActiveColor = MaterialColor.green.accent4
        nameTextField.placeholderLabel.textColor = MaterialColor.green.accent4
        nameTextField.placeholder = "Plant Name"
        nameTextField.dividerActiveColor = MaterialColor.green.accent4
        nameTextField.font = RobotoFont.regularWithSize(20)
    }
}

If I comment the .becomreFirstResponder() call, I can see the placeholder text e.g. http://d.pr/i/1eQS5 & http://d.pr/i/1aXfJ

But if I leave it there, the field will be focused except the placeholder will be nowhere to be found e.g. http://d.pr/i/3CUE & http://d.pr/i/1g7AD

I guess that's a bug, or maybe I just don't know how to use TextFields hehe

Thanks a lot and keep up the great work!

help wanted

Most helpful comment

@tbergeron I have tested the sample code you have provided. it is easily reproducible.
The problem here is that you are calling becomeFirstResponder() too early in view's life cycle. Generally speaking, it's not a good idea to call view altering methods in the viewDidLoad() because the view is just being loaded and not added to the view. For the sample code you have provided, it's better to call the prepareTextField() in the viewDidLoad and becomeFirstResponder() in viewDidAppear() :


class FormViewController: UIViewController {
  private nameTextField: TextField!

  override func viewDidLoad() {
    super.viewDidLoad()
    prepareTextField()

  }
  override func viewDidAppear(animated: Bool) {
    super.viewDidAppear(animated)
    nameTextField.becomeFirstResponder()
  }

  func prepareTextField() {
    nameTextField = TextField()
    nameTextField.placeholderActiveColor = MaterialColor.green.accent4
    nameTextField.placeholderLabel.textColor = MaterialColor.green.accent4
    nameTextField.placeholder = "Plant Name"
    nameTextField.dividerActiveColor = MaterialColor.green.accent4
    nameTextField.font = RobotoFont.regularWithSize(20)
  }
}

All 5 comments

Thank you for this, I will look into it :)

@tbergeron I have tested the sample code you have provided. it is easily reproducible.
The problem here is that you are calling becomeFirstResponder() too early in view's life cycle. Generally speaking, it's not a good idea to call view altering methods in the viewDidLoad() because the view is just being loaded and not added to the view. For the sample code you have provided, it's better to call the prepareTextField() in the viewDidLoad and becomeFirstResponder() in viewDidAppear() :


class FormViewController: UIViewController {
  private nameTextField: TextField!

  override func viewDidLoad() {
    super.viewDidLoad()
    prepareTextField()

  }
  override func viewDidAppear(animated: Bool) {
    super.viewDidAppear(animated)
    nameTextField.becomeFirstResponder()
  }

  func prepareTextField() {
    nameTextField = TextField()
    nameTextField.placeholderActiveColor = MaterialColor.green.accent4
    nameTextField.placeholderLabel.textColor = MaterialColor.green.accent4
    nameTextField.placeholder = "Plant Name"
    nameTextField.dividerActiveColor = MaterialColor.green.accent4
    nameTextField.font = RobotoFont.regularWithSize(20)
  }
}

Excellent! Thank you @mohpor this is correct.

Incredible! Thanks @mohpor, that's very logical and explains perfectly why it was happening. It's now working smoothly!

Thanks for this answer! Was scratching my head for much longer than I should have on this issue!

Was this page helpful?
0 / 5 - 0 ratings

Related issues

tato469 picture tato469  路  17Comments

ayham-achami picture ayham-achami  路  26Comments

ijameelkhan picture ijameelkhan  路  23Comments

MacMeDan picture MacMeDan  路  28Comments

mohpor picture mohpor  路  24Comments