CODEWITHSUNDEEP
swiftcocoasidebarappkitnsoutlineview
user10711707
user10711707

Reputation: 213

Customising the sidebar with NSTintConfiguration

In the Adopt the new look of macOS video, you can use NSTintConfiguration to customise the sidebar icon colour using this code.

func outlineView(_ outlineView: NSOutlineView, tintConfigurationForItem item: Any) -> NSTintConfiguration? {
  if case let sectionItem as SectionItem = item {
    /* 
       This outline view uses a type called "SectionItem" to populate its top-level sections.
       Here we choose a tint configuration based on a hypothetical `isSecondarySection` property on that type.
     */
    return sectionItem.isSecondarySection ? .monochrome : .default
  }
  // For all other cases, a return value of `nil` indicates that the item should inherit a tint from its parent.
  return nil
}

When I tried to force a colour on my app sidebar, let's say yellow for an example like this.

func outlineView(_ outlineView: NSOutlineView, tintConfigurationForItem item: Any) -> NSTintConfiguration? {
    return .init(fixedColor: .systemYellow)
}

It (sort of) worked as intended, meaning that any rows that are not selected are customised as intended but when you select a row, the SF Symbols changes colour. I expected it to be yellow.

This is how it looks. You can see the icon tint colours are indeed yellow but only if you do not select them.

enter image description here

What I want is the highlighted row tint colour to be the same as the unselected rows. Like how Apple does it in their apps.

a screenshot of Apple Mail.app

Upvotes: 0

Views: 462

Answers (1)

Ryder Mackay
Ryder Mackay

Reputation: 2910

You’re seeing the green accent color row selection highlight (NSTableRowView.emphasized = true) and white icon because your outline view is currently the window’s first responder. If you select a different control outside of the outline view, like an NSTextField in the window’s main content area for example, the row selection will change to the inactive appearance (emphasized = false). This is independent of the new tint configuration API.

Mail and Finder go to some effort to prevent their sidebar outline views from becoming first responder in most situations, so they usually has the inactive appearance like in your second screenshot. You can approximate this behaviour by setting refusesFirstResponder = true on your outline view or by subclassing NSOutlineView and overriding acceptsFirstResponder if you need more fine-grained control.

Upvotes: 1

Related Questions