How do I make an editable NSTextField wrap inside an NSTableView cell?

Question

fahad-sh OP

Created 3h

Replies 3

Boosts 0

Participants 2

Hi, I’m pretty new to AppKit and I’m trying to make an NSTextField inside an NSTableView both:

Editable
Multi-line / wrapping

Right now, wrapping works fine until I set:

tf.isEditable = true

Then the text becomes a single line.

How do I make it editable while still wrapping correctly?

import AppKit
final class ViewController: NSViewController, NSTableViewDataSource, NSTableViewDelegate {
    let tableView = NSTableView()
    let text = String(repeating: "A", count: 500)
    override func viewDidLoad() {
        super.viewDidLoad()
        view = tableView
        tableView.addTableColumn(NSTableColumn())
        tableView.usesAutomaticRowHeights = true
        tableView.dataSource = self
        tableView.delegate = self
    }
    func numberOfRows(in tableView: NSTableView) -> Int { 1 }
    func tableView(_ tableView: NSTableView, viewFor tableColumn: NSTableColumn?, row: Int) -> NSView? {
        let cell = NSTableCellView()
        let tf = NSTextField(wrappingLabelWithString: text)
        tf.lineBreakMode = .byCharWrapping
        if let tableColumn {
            tf.preferredMaxLayoutWidth = tableColumn.width
        }
        tf.isEditable = true // comment this out and wrapping works
        cell.addSubview(tf)
        tf.translatesAutoresizingMaskIntoConstraints = false
        NSLayoutConstraint.activate([
            tf.leadingAnchor.constraint(equalTo: cell.leadingAnchor),
            tf.trailingAnchor.constraint(equalTo: cell.trailingAnchor),
            tf.topAnchor.constraint(equalTo: cell.topAnchor),
            tf.bottomAnchor.constraint(equalTo: cell.bottomAnchor),
        ])
        return cell
    }
}

Boost

Answer 1

Claude31 OP

2h

That does not occur with a stand alone TextField.

May be there is an issue with line 9:

        tableView.usesAutomaticRowHeights = true

Could you comment it out ?

Otherwise, could you try this:

make non editable
change to editable when you type on text

-> What happens then ? Does it change to single line ?

Then you can have this work around:

make it editable when yo type on it
when editing done, return to non editable

0

Answer 2

fahad-sh OP

2h

@Claude31

Thanks, I tried both suggestions.

If I comment out:

tableView.usesAutomaticRowHeights = true

then wrapping does not work correctly in either case because the row height stays fixed.

I also tried starting with:

tf.isEditable = false

and then toggling:

tf.isEditable = true

later after layout. As soon as it becomes editable, the row collapses back to a single visible line again.

One thing I noticed though: the text itself actually still seems to wrap internally when isEditable = true, but the cell height no longer updates to fit the wrapped content. So it looks like the issue is more that the automatic row height calculation stops accounting for the multi-line editable text field.

0

Answer 3

Claude31 OP

1h

Yes, I think problem comes from height calculation during editing.

What I do in such a case:

make the text non editable
when typing on text, create a temporary NSTextField that overlays the cell
The text is edited there
when editing done, copy content in the cell text and delete the temporary textField.

0