How to get NSTextField to wrap in variable row height table

Question

I need the text to wrap in the rows of an NSTable. I've read: SO How to update row heights...

and: View-based NSTableView with rows that have dynamic height...

My row heights work fine for multiline text (with eols), but not if I leave out the eols. (Working with a stripped-down test case till I figure this out.)

Here is my demo code:

class TableCellView: NSTableCellView {
    var title = NSTextField()

    convenience init(_ id: NSUserInterfaceItemIdentifier, itemCount: Int) {
        self.init(frame: .zero)
        identifier = id
        rowSizeStyle = .custom

        addSubview(title)
        var s = "\(itemCount):\n"
        for item in 0...(5 + itemCount) { s += "\(item)) Text written to a scrollable table view " }

        let a = NSAttributedString(string: s, attributes: [NSAttributedString.Key.font : NSFont.systemFont(ofSize: 18.0)] )

        title.attributedStringValue = a
        title.textColor = NSColor.textColor

        title.backgroundColor = NSColor.clear
        title.translatesAutoresizingMaskIntoConstraints = false
        title.isBordered = false

        title.widthAnchor.constraint(equalTo: widthAnchor, constant: 0).isActive = true
        title.topAnchor.constraint(equalTo: topAnchor, constant: 1).isActive = true
        title.bottomAnchor.constraint(equalTo: bottomAnchor).isActive = true
    }
}

class TableViewManager: NSObject, NSTableViewDataSource, NSTableViewDelegate, Actor {
    weak var actorDelegate: ActorDelegate?

    var identifier: NSUserInterfaceItemIdentifier? = Identifier.View.tableDelegate
    var count = 0

    func numberOfRows(in tableView: NSTableView) -> Int {

        return 10
    }

    func tableView(_ tableView: NSTableView, viewFor tableColumn: NSTableColumn?, row: Int) -> NSView? {
        let id = tableColumn!.identifier
        var view = tableView.makeView(withIdentifier: id, owner: nil) as? TableCellView
        if view == nil {
            view = TableCellView(id, itemCount: count)
        }

        count += 1      
        return view
    }
}

class TableViewController: NSViewController {
    private let tableViewDelegate = TableViewManager()
    var scrollView: ScrollableTableView!
    var tableView: NSTableView { get { return scrollView.tableView } }

    // Initialize the table scroll view
    convenience init(_ identifier: NSUserInterfaceItemIdentifier) {
        self.init()
        self.identifier = identifier
        scrollView = ScrollableTableView(cols: [(500, "Commit")], delegate: tableViewDelegate, source: tableViewDelegate)
        view = scrollView

        tableView.rowSizeStyle = .custom
        tableView.usesAutomaticRowHeights = true
        tableView.rowHeight = 18
        tableView.headerView = nil  // Get rid of header
        tableView.usesAlternatingRowBackgroundColors = true
    }
    // Pass along reload data
    func reloadData() { tableView.reloadData() }
}

score 0 · Answer 1 · answered Apr 25 '19 at 18:37

Finally came up with a solution, but I'd love for a real expert to tell me whether it's robust. (Up to quick & dirty constants). I overrided the table cell draw, with slight mods to its initializer as follows:


class TableCellView: NSTableCellView {
    var title = NSTextField()
    var height: NSLayoutConstraint!

    convenience init(_ id: NSUserInterfaceItemIdentifier, itemCount: Int) {
        self.init(frame: .zero)
        identifier = id
        rowSizeStyle = .custom

        addSubview(title)
        var s = "\(itemCount):\n"
        for item in 0...(5 + itemCount) { s += "\(item)) Text written to a scrollable table view " }

        let a = NSAttributedString(string: s, attributes: [NSAttributedString.Key.font : NSFont.systemFont(ofSize: 18.0)] )

        title.attributedStringValue = a
        title.textColor = NSColor.textColor

        title.backgroundColor = NSColor.clear
        title.translatesAutoresizingMaskIntoConstraints = false
        title.isBordered = false
        title.font = NSFont.systemFont(ofSize: 14.0)

        title.widthAnchor.constraint(equalTo: widthAnchor, constant: 1).isActive = true
        title.topAnchor.constraint(equalTo: topAnchor).isActive = true
        title.bottomAnchor.constraint(equalTo: bottomAnchor).isActive = true
        height = heightAnchor.constraint(equalToConstant: 100)  // Value doesn't matter, gets recalculated by override draw
        height.isActive = true
    }

    override func draw(_ dirtyRect: NSRect) {
        // Will recalculate height, but parameter must be larger than result
        let bound = title.attributedStringValue.boundingRect(with: NSSize(width: frame.width, height: 4096), options: [.usesLineFragmentOrigin, .usesFontLeading])
        height.constant = bound.height + 2.0
        super.draw(dirtyRect)
    }
}

The result looks like this:

and re-wraps properly when I resize the window.

Hope this helps someone else.

How to get NSTextField to wrap in variable row height table

1 Answers1