3

So I am going for a custom looking NSTableView. I've already successfully subclassed NSTableRowView and NSTextFieldCell to achieve the look I'm going for, however I'm struggling of getting rid of the default styling for the header. I seem to be able to tweak its frame, however I'm not sure where the rest of the default styling is coming from.

As you see on the screenshot the red area is the increased frame of the headerView. I'm using its CALayer to set the colour, however how to change the contents inside is beyond me...

enter image description here

Here's what I'm doing in the viewDidLoad of my ViewController

override func viewDidLoad() {
    super.viewDidLoad()
    tableView.delegate = self
    tableView.dataSource = self
    tableView.wantsLayer = true
    tableView.headerView?.frame = NSMakeRect(0, 0, (tableView.headerView?.frame.width)!, 32.00)
    tableView.headerView?.wantsLayer = true
    tableView.headerView?.layer?.backgroundColor = NSColor.red.cgColor
}

I've also tried subclassing NSTableHeaderView, however this class seems to be extremely limited in terms of the customizations I can make...

Any help would be appreciated?

Martin Velchevski
  • 874
  • 11
  • 33
  • What are you trying to accomplish? – dscrown Oct 06 '16 at 18:09
  • @dscrown Put simply the "header" that's inside of the red area - the grey rect with the "Color Palette" label... I want to customize those. I simply don't know how to target them. :/ Or even what class they're part of. – Martin Velchevski Oct 06 '16 at 18:33

2 Answers2

9

The table view is view based but the header isn't and the header cells still are class NSTableHeaderCell. Use NSTableColumn's property headerCell. You can set the cell's properties like attributedStringValue and backgroundColor or replace the cells by instances of a subclass of NSTableHeaderCell and override one of the draw methods.

Willeke
  • 14,578
  • 4
  • 19
  • 47
  • 2
    I totally get it now! Thanks @Willeke. For people that find themselves in the same boat, the way forward is to assign an instance of a subclass of `NSTableHeaderCell` to the `headerCell` property of `NSTableColumn`. Essentially you'll have something like `column.headerCell = MyCustomHeaderCell()`. You than simply override the draw method in your custom header cell class and do your custom drawing there. – Martin Velchevski Oct 12 '16 at 11:18
-6

Play around with this to get inside the header.
Remember to except the answer if it works for you.

func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
    //Color for the  header.
    let topColor = UIColor(red: (70/255.0), green: 000/255.0, blue: 000/255.0, alpha: 255)

    //Location of label.
    let locationOfLabel = self.view.frame.width

    let headerView:UIView = UIView()

    //Locating the text in the label
    let title = UILabel(frame: CGRect(x: 0, y: 30, width: locationOfLabel, height: 21))
    title.textAlignment = .center

    //Changing the title in the label per the default.
    let defaults:UserDefaults = UserDefaults.standard
    defaults.synchronize()

    let cardSelector  = defaults.object(forKey: "selectorKeyID") as! Int
    switch (cardSelector) {
    case 0: title.text = "Personal"
    break
    case 1: title.text = "Saved"
    break
    case 2: title.text = "Favorite"
    break
    case 3: title.text = "Grouped"
    break
    default:
        break
    }
    //Coloring the text in the label
    //Add the label
    title.textColor = UIColor.gray

    headerView.addSubview(title)

    //Adding a button to the header.
    let closeBttn = UIButton(type: UIButtonType.system) as UIButton
    closeBttn.frame = CGRect(x: 0, y: 30, width: 90, height: 27)
    closeBttn.setTitle("Close", for: UIControlState())
    closeBttn.setTitleColor(buttonColor, for: UIControlState())
    closeBttn.titleLabel?.font = UIFont.systemFont(ofSize: 19, weight: UIFontWeightMedium)
    closeBttn.addTarget(self, action: #selector(MainTableViewController.close), for: UIControlEvents.touchUpInside)
    headerView.addSubview(closeBttn)

    let menuButton = UIButton(type: UIButtonType.system) as UIButton
    menuButton.frame = CGRect(x: locationOfLabel-53, y: 30, width: 27, height: 27)
    menuButton.setBackgroundImage(UIImage(named: "VBC Menu4.png"), for: UIControlState())
    menuButton.addTarget(self, action: #selector(MainTableViewController.menuButton), for: UIControlEvents.touchUpInside)
    headerView.addSubview(menuButton)

    //Coloring the header
    headerView.backgroundColor = topColor

    //Rounding the corners.
    headerView.layer.cornerRadius = 10
    headerView.clipsToBounds = true


    return headerView

}

 func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
    return 70.0
}
dscrown
  • 578
  • 1
  • 5
  • 21