RoundedBox NSBox subclass
Well, progress on the as-yet-unnamed icon app continues, including some actual coding.
I’ve created an NSBox subclass, RoundedBox, to draw the custom rounded-rectangle, gradient-backed boxes featured in my latest UI mockup. Whereas in the mockup it was just pixels (created in OmniGraffle, as a matter of fact), this time it’s an honest-to-goodness control:
You can play with the toy app shown in the screenshot by downloading it here (includes source code). Since the gradient background is drawn using the Core Image API (specifically CILinearGradient), the app requires Mac OS X 10.4 (Tiger) or later.
Update: I’ve updated the screenshot and the demo app. The box now allows setting the following properties:
- Whether to always draw a full horizontal titlebar. If disabled, the titlebar will cover just the title text, unless there would only be a few pixels between the right edge of the titlebar and the right edge of the box, in which case a full titlebar is always drawn anyway.
- Whether the box is “selected” or not. If true, the border/titlebar is drawn in the darker version of the system’s current control highlight color; i.e. the same color used to highlight selected items in a list. This mimics how Automator highlights the current action in a workflow.
- Which border color to use. Default is 50% white.
- Which gradient start and end colors to use. Default is 92% white to 82% white.
- Which title to use for drawing the title text. Default is white.
The box title is now also truncated (via a trailing ellipsis) if it wouldn’t all fit into the box. Use the popup in the demo app and resize the window to see the behaviour.
Update 2: I’ve updated the screenshot and demo app again, to show the new ability to specify whether to draw a gradient background or a solid color background. Default is to use a gradient background as detailed previously, and the default solid color is 90% white.
Update 3: Download now includes source code.
6 Comments