Weird rectangle (NSBannerView) in left top of NSTableView

Viewed 377

I'm working on an macOS app and I'm experiencing a weird issue. In the left top corner of my NSTableView (above the header), a grey rectangle is shown:

enter image description here

(I've added an NSBox behind the NSTableView to make it more clear in the screenshot)

With the Debug View Hierarchy, I've seen it's an NSBannerView which is added to the Scroll View wrapping the Table View.

My UI is built with Interface Builder (a storyboard). I've checked and unchecked lots of checkboxes in the Interface Builder but can't find what it is. Google and Stack Overflow also don't give any clues. Googling for "NSBannerView" even only yields some macOS header files.

How to get rid of the rectangle?

Environment details

  • macOS Mojave 10.14 Beta (18A365a)
  • Xcode 9.4.1 (9F2000)
3 Answers

Subclass NSTableRowView and overwrite layout, where you hide the view

- (void)layout {

    [super layout];

    for (NSView * v in self.subviews) {
        if ([v.className isEqual:@"NSBannerView"]) {
            v.hidden = YES;
        }
    }

}

Making this hiding thing into didAddSubview might be a better solution like the example below. Because layout is called each time you select the row.

override func didAddSubview(_ subview: NSView) {
    super.didAddSubview(subview)

    if subview.className == "NSBannerView" {
        subview.isHidden = true
    }
}

I use currently use this to correct a ugly looking NSBannerView:

func tableView(_ tableView: NSTableView, didAdd rowView: NSTableRowView, forRow row: Int) {
    if rowView.isGroupRowStyle {
        for view in rowView.subviews {
            if let effect = view.subviews.first as? NSVisualEffectView {
                effect.material = .contentBackground // Or something else, the default material for group headers is .headerView
            }
        }
    }
}
Related