Search code examples
iosswiftuitableviewfirebaseuitextfield

How to use UITableView for TextField input view


I currently have an app which uses UIPickerViews to allow users to select which answer they want for a text field (to avoid spelling mistakes etc).

Screenshot of form with UIPickerView

However, I have found that the UIPickerView isn't really what I want to use because I haven't had great feedback from it when testing.

I have done some research into how to use a UITableView for text field inputs instead, so when the user clicks the Textfield, the user segues to a UITableView with the same options which would be provided by the UIPickerView. Once they click the cell with the option they are looking for it would segue back to the form with the result chosen inside the text field. I thought this would be a better user experience as I could also implement the search to help users narrow down the option they require quicker.

I have been trying to get this to work for a while now, but I'm quite new at coding and haven't been able to crack it yet. I would just like advice on how to approach this? I'm using Swift and the Storyboard to create my app.

Would I need to create a separate ViewController with a UITableView that loads the options and then move the value back to the form once the cell is clicked?


Solution

  • One approach would be to use a table view in separate view controller. lets call it choiceVC and pass data which text field was tapped. Then send the data back to your form to show what user has selected.

    Follow these steps

    Detect user tap on text field and segue to choiceVC by implementing this delegate function of UITextField

    func textFieldShouldReturn(_ textField: UITextField) -> Bool {
    
      textField.resignFirstResponder()
      //push your choiceVC and pass data
      var textFeildTapped = ""
      //note: chooseGameTextField should be text field's outlet
      if textField == chooseGameTextField{
        textFeildTapped = "games"
      }else if textField == chooseActiviyTextField {
        textFeildTapped = "activiy"
      } 
    
    //first set identifier of your view controller by going to identity inspector and setting the value StoryBoard ID
    if let controller = storyboard?.instantiateViewController(withIdentifier: "choiceVC") as? ProductDetailVc{
      //pass which text field was tapped
      controller.choicesToShow = textFeildTapped
      navigationController?.pushViewController(controller, animated: true)
    }
    return true
    

    }

    Note: choiceVC should have a variable "choicesToShow" of type string

    in viewdidload of choiceVC check the variable

    if choicesToShow == "games" {
     //populate your table view with games. 
    }else {
     //check for other cases and proceed accordingly
     //activiy, console etc
    }
    

    Implement didSelect delegate method of UITableView

    func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
     //Pass data back to your form using **delegate pattern**. see link in notes below
    }
    

    Notes: