I am creating my own NSTableView for macOS. I can display formatted data and provide scrolling by embedding it in a ScrollView. When the table is displayed there is a horizontal gap between adjacent cells. The same gap occurs between the ScrollView header cells. I do not know how to. solve this problem. There is one other issue, I do not know how to set the vertical height of the ScrollView header cells. I would like to make them taller. Below is my code along with the test data.
struct ClosingValue: Identifiable {
var id: UUID
var name: String
var date: String
var close: Float
static var closingValues = [
ClosingValue(id: UUID(), name: "Stock1", date: "Nov 01, 2009", close: 1.10),
ClosingValue(id: UUID(), name: "Stock1", date: "Nov 02, 2009", close: 2.10),
ClosingValue(id: UUID(), name: "Stock1", date: "Nov 03, 2009", close: 3.10),
ClosingValue(id: UUID(), name: "Stock1", date: "Nov 04, 2009", close: 4.10),
ClosingValue(id: UUID(), name: "Stock1", date: "Nov 05, 2009", close: 5.10)
]
}
struct BetterTableView: NSViewRepresentable {
class Coordinator: NSObject, NSTableViewDelegate, NSTableViewDataSource {
@State var closingValues: [ClosingValue] = ClosingValue.closingValues
func numberOfRows(in tableView: NSTableView) -> Int {
closingValues.count
}
func tableView(_ tableView: NSTableView, viewFor tableColumn: NSTableColumn?, row: Int) -> NSView? {
var nsView = NSView()
let tableColumnWidth: CGFloat = 135
let paragraphStyle = NSMutableParagraphStyle()
paragraphStyle.alignment = .center
let attributes1: [NSAttributedString.Key: Any] = [
.foregroundColor: NSColor.blue,
.paragraphStyle: paragraphStyle,
.font: NSFont(name: "Arial", size: 14.0) as Any
]
switch tableColumn {
case tableView.tableColumns[0]:
tableColumn?.width = tableColumnWidth
let attributedString = NSAttributedString(string: closingValues[row].name, attributes: attributes1)
let tempNSView = NSTextField()
tempNSView.backgroundColor = NSColor.white
tempNSView.isBordered = true
tempNSView.isEditable = false
tempNSView.attributedStringValue = attributedString
nsView = tempNSView
case tableView.tableColumns[1]:
tableColumn?.width = tableColumnWidth
let attributedString = NSAttributedString(string: closingValues[row].date, attributes: attributes1)
let tempNSView = NSTextField()
tempNSView.backgroundColor = NSColor.white
tempNSView.isBordered = true
tempNSView.isEditable = false
tempNSView.attributedStringValue = attributedString
nsView = tempNSView
case tableView.tableColumns[2]:
tableColumn?.width = tableColumnWidth
let closeAsString = String(format: "$%.2f", closingValues[row].close)
let attributedString = NSAttributedString(string: closeAsString, attributes: attributes1)
let tempNSView = NSTextField()
tempNSView.backgroundColor = NSColor.white
tempNSView.isBordered = true
tempNSView.isEditable = false
tempNSView.attributedStringValue = attributedString
nsView = tempNSView
default:
print("problem in table view switch statement")
}
return nsView
}
}
func makeCoordinator() -> Coordinator {
Coordinator()
}
func makeNSView(context: Context) -> NSScrollView {
let tableView = NSTableView()
tableView.delegate = context.coordinator
tableView.dataSource = context.coordinator
tableView.addTableColumn(NSTableColumn())
tableView.addTableColumn(NSTableColumn())
tableView.addTableColumn(NSTableColumn())
let paragraphStyle = NSMutableParagraphStyle()
paragraphStyle.alignment = .center
let attributes: [NSAttributedString.Key: Any] = [
.foregroundColor: NSColor.black,
.paragraphStyle: paragraphStyle,
.font: NSFont.systemFont(ofSize: 14)
]
let column0AttributedString = NSAttributedString(string: "Stock", attributes: attributes)
let column0Header = tableView.tableColumns[0]
column0Header.headerCell.drawsBackground = true
column0Header.headerCell.backgroundColor = NSColor.systemMint
column0Header.headerCell.alignment = .center
column0Header.headerCell.attributedStringValue = column0AttributedString
let column1AttributedString = NSAttributedString(string: "Date", attributes: attributes)
let column1Header = tableView.tableColumns[1]
column1Header.headerCell.drawsBackground = true
column1Header.headerCell.backgroundColor = NSColor.systemMint
column1Header.headerCell.alignment = .center
column1Header.headerCell.attributedStringValue = column1AttributedString
let column2AttributedString = NSAttributedString(string: "Closing Value", attributes: attributes)
let column2Header = tableView.tableColumns[2]
column2Header.headerCell.drawsBackground = true
column2Header.headerCell.backgroundColor = NSColor.systemMint
column2Header.headerCell.alignment = .center
column2Header.headerCell.attributedStringValue = column2AttributedString
let scrollView = NSScrollView()
scrollView.documentView = tableView
return scrollView
}
func updateNSView(_ nsView: NSScrollView, context: Context) {
let tableView = (nsView.documentView as! NSTableView)
// work on this section
}
}
After some additional review of the NSTableView class, I discovered it contains a var "intercellSpacing" of type NSSize. So I added the line of code below to the "makeNSView" function above and the cell spacing problem is solved. It did not though get rid of the green block to the left of "Stock" or to the right of "Closing Value". If I am able to work that out I will add the solution to this post.
tableView.intercellSpacing = NSSize(width: 0.0, height: 0.0)