How can one make a UITableViewCell's height expand to fit the contents of a UITextView with wrapping text without the textView scrolling? (Swift 5)

Question

I have a UITableViewController that utilizes custom cells. Within the custom cell is a UITextView and a UIButton. I need for the selected tableView cell to fit the multiple lines of text that may be input by the user, as the user is typing. An app that demonstrates this perfectly would be iPhone's pre-installed Reminders app. Currently in my app, the tableView cell's height remains static and the textView enables scrolling when necessary in order to accommodate multiple lines of text.

I tried implementing the solutions in this post (Dynamically change cell's height while typing text, and reload the containing tableview for resize) which seemed to ask the same question, however, the post is nearly 3 years old and even if the answer is still valid, there's not enough sample code present for me to understand how to implement the answer. I did my best with no luck and cleared my current code of any previous attempts so that it's presently a clean slate as far as this desired feature is concerned. It would be amazing to see an answer that includes sample code in Swift 5.

Here is the custom cell class if it would be useful:

class newNoteTableViewCell: UITableViewCell {

    @IBOutlet weak var lyricsField: UITextView!
    @IBOutlet weak var recordButton: UIButton!
    
    override func awakeFromNib() {
        super.awakeFromNib()
        // Initialization code
    }

    override func setSelected(_ selected: Bool, animated: Bool) {
        super.setSelected(selected, animated: animated)
    }
    
    @IBAction func recordButtonPressed(_ sender: UIButton) {
    }
}

And my cellForRowAt, which is currently the only table view delegate method implemented other than numberOfRowsInSection:

override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCell(withIdentifier: "lyricsCell", for: indexPath) as! newNoteTableViewCell
        
        cell.lyricsField.delegate = self
        
        cell.lyricsField.tag = indexPath.row
        
        if let safeLyrics = lyrics {
            if indexPath.row < safeLyrics.count {
                cell.lyricsField.text = safeLyrics[indexPath.row].text
            } else {
                cell.lyricsField.text = ""
            }
        }
        
        return cell
    }

user_6257435 · Answer

We can do this by adding a "callback" closure to your cell.

When the text view is edited, the cell class will "call back" to the controller, where we can tell the table view to recalculate row heights (as well as saving the edited text).

Here's a simple cell layout with constraints. Make sure to disable scrolling on the text view:

Note that the height of the cell at design-time doesn't matter... our constraints will allow auto-layout to handle that.

Result:

Here's the example code:

class ExampleCell: UITableViewCell, UITextViewDelegate {
    
    @IBOutlet var recordButton: UIButton!
    @IBOutlet var lyricsField: UITextView!
    
    var callback: ((String) -> ())?
    
    override func didMoveToSuperview() {
        super.didMoveToSuperview()
        // make sure scroll is disabled
        lyricsField.isScrollEnabled = false
        // make sure delegate is set
        lyricsField.delegate = self
        // if these are set in Storyboard this func is not needed
    }
    func textViewDidChange(_ textView: UITextView) {
        let str = textView.text ?? ""
        // tell the controller
        callback?(str)
    }

}

class ExampleTableViewController: UITableViewController {

    var myData: [String] = []
    
    override func viewDidLoad() {
        super.viewDidLoad()

        // start with 20 sample strings for our data
        // fill data array with 30 strings
        myData = (1...30).map { "This is row \($0)" }

        // give the second row some longer sample text
        myData[1] = "Some sample text so we see that the text view height will be automatically handled by auto-layout."
        
    }

    // MARK: - Table view data source

    override func numberOfSections(in tableView: UITableView) -> Int {
        return 1
    }

    override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return myData.count
    }

    override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCell(withIdentifier: "exampleCell", for: indexPath) as! ExampleCell

        cell.lyricsField.text = myData[indexPath.row]
        
        // set the closure
        weak var tv = tableView
        cell.callback = { [weak self] str in
            guard let self = self, let tv = tv else { return }
            print("called back", str)
            // update our data with the edited string
            self.myData[indexPath.row] = str
            // we don't need to do anything else here
            // this will force the table to recalculate row heights
            tv.performBatchUpdates(nil)
        }

        return cell
    }

}

and here's the Storyboard source for reference:

Edit in response to comment....

Your constraints in your cell are all wrong...

Here's how they look from your original xib:

Here's how they should look:

Important: your stack view settings need to be:

How can one make a UITableViewCell's height expand to fit the contents of a UITextView with wrapping text without the textView scrolling? (Swift 5)

1 Answers