How do I display a custom view modally, within an existing window?

Question

I am trying to build a UI with a main window that displays some content, and sometimes slides-in a modal view from the right edge of the window. Interaction with the main content must be blocked while the modal is open; however, clicking the main content should close the modal. Here's a mockup:

Please note the user should see only one window. That is, the modal should be nested inside the main window.

I have very little experience with AppKit and Cocoa in general. My approach so far has been to structure my UI like this:

Root region (NSView)
    -> MainRegion (NSView)
    -> ModalRegion (NSView; toggle hidden and animate the left edge)

and then add subviews to MainRegion and ModalRegion to display content. The problem is that ModalRegion doesn't absorb input events.

What's the AppKit way to build this kind of UI? I mainly just need to know about how the view hierarchy should be shaped and how to block/absorb input events. I think I can figure out the animations myself. Also, the app targets macOS 10.8+, but answers for more recent versions would be helpful, as well.

Answer 1

It's not really macOS like UI but there are two approaches you could use. In both cases you would use a transparent view to cover the main window and to dismiss the modal view in case of a mouse click. If you need a shadow overlapping the main window as shown in your mockup you will need to use a window attached to the main window as a child window. If this is not the case it would be enough to work with a view which is attached to the contentView of the main window.

All the best.