Search code examples
macoscocoainterface-builderosx-mavericksnslayoutconstraint

Expand and Collapse Standard Cocoa Controls on a View

I want to do something similar to the calendar.app info panels, take a look at the pictures.

Here you can a see a very simple and compact info panel, but if you click on the last row "Add Notes, Attachments, or URL"....

First Pic

It expands to show additional fields.

enter image description here

How can I achieve this functionality of expanding and collapsing additional controls ? Can this been done through interface builder and constraints ?

Solution

  • Take a look at Apples example code for NSStackView, https://developer.apple.com/library/mac/samplecode/InfoBarStackView/Introduction/Intro.html

    It will show you how to implement views that collapse and disclose. In Apple's example they do everything programmatically using auto layout constraints, although you could move some of the work to IB if you wanted to.

    I would create the view you want and add a tracking area to monitor when the mouse enters and clicks (using -mouseDown: notification) the "Add attachments, notes, URLs" section and use the stack view method to disclose the details.