Translucent Sidebar OS X

Question

Can someone explain how can i recreate this types of windows?

1. I'm looking for a translucent sidebar with the close/minimize/fullscreen buttons inheriting the background color of the sidebar. I noticed that the windows don't have title bars. Turning off the title bars in the appearance might be a start but i'm stuck soon after.
2. Is the sidebar implemented with a Vertical Split ?

Answer 1

You automatically get that translucent appearance when you have a table or outline view whose selectionHighlightStyle is set to .SourceList . You can get a pretty good demo of this part from Apple's SidebarDemo sample code project.

The disappearing titlebar with window controls overlaid on the sidebar content view results from both setting titleVisibility to .Hidden and setting titlebarAppearsTransparent to true .

Once you do that, though, your outline view content is going to slide up under the window controls, and that's probably not what you want. The general solution there is to lay out content relative to the window's contentLayoutGuide ... But if all you have is a scrolling sidebar it's better to just tell the scrollview to start such that the first row scoots down a little (and then its content can still go up there when you scroll).

let offset = window.frame.height - window.contentLayoutRect.maxY
scrollView.contentInsets.top = offset

For layout, you indeed probably want to use a vertical split view (though that's not a requirement of achieving this visual style—just something else that's useful for sidebars in general).