TweetFollow Us on Twitter

Interface Builder Tips and Tricks

Volume Number: 19 (2003)
Issue Number: 10
Column Tag: Programming

Mac OS X Programming Secrets

Interface Builder Tips and Tricks

by Scott Knaster

When you're programming with Cocoa, you spend plenty of time in Interface Builder, instantiating objects, positioning things just right in windows, and making connections. In this month's column, we're going to shine the light of day on a few valuable tips and shortcuts for making yourself more productive when using Interface Builder.

Designing for Success

Most of the intricate work in Interface Builder is in the design window, which is where you add objects from palettes, lay them out, resize them, and so on. In this section, we'll discuss some tips for use in design windows.

The first trick is useful for figuring out precise distances between objects while looking at them in the design window. If you select an object, then hold down the Option key, you'll see the exact distances from the borders of the object to the edges of the window (see Figure 1).


Figure 1. Hold down Option to see distances.

But wait, that's not all. By moving the mouse pointer while holding down Option, you can have Interface Builder show you the distance between objects, rather than just the distance to the window edges. In Figure 2, the pointer is on the static text object, and the window shows the distances from the selection to each edge of that object.


Figure 2. Hold down Option to see distances.

You can use another Interface Builder feature to make objects automatically resize or reposition themselves when you change the size of their enclosing window. For example, let's say you want to preserve the proportional distance between the three buttons in the window above: if you widen the window, you want the distance between the buttons to increase. To make this happen, you can create springs between the objects. To do this, select each object in turn, open the size inspector, and click that line that you want to become a spring (a proportional relationship that changes automatically when you resize the window). Figure 3 shows what this looks like for the "Stop" button in the window above: we've clicked on its connection lines to make them into springs. We'll do the same for all 3 buttons.

Now, when we resize the window, if we hold down the Control key, the springs will cause the distances between objects to change proportionally. If we want the springs to be ignored, we can just resize without holding down Control.


Figure 3. Stop button has springs on its left and right.

Speaking of the size inspector, it's even smarter than you might have realized. You can type math expressions into the coordinate fields and let Interface Builder evaluate them for you. For example, if you want to add 32 pixels to an object's width, you can just click in the w field, select after the current value, then type "+32" and press return. Neato! Apple even provides code to help you implement this trick in your own fields. Take a look at /Developer/Examples/InterfaceBuilder/BusyPalette for details.

Another fun trick you can use with design windows is to see all the rectangles that Interface Builder uses to determine distances between objects. By using the Layout --> Show Layout Rectangles menu item, or just pressing command-L, you can see all the layout rectangles at once, as shown in Figure 4.


Figure 4. Design window with all layout rectangles shown.

Interface Builder tips aren't all about layout. For example, there's a quick way to set the tab order for objects in the window. You'll want to do this to allow users to tab from one text field to the next. The tab order starts with the initial first responder, and continues from there by following each object's nextKeyView field.

To start setting the order, select the object you want to be the initial first responder and choose Layout --> Keyboard Navigation --> Make Initial First Responder. Then, to set the tab order, choose Layout --> Keyboard Navigation --> Show Keyboard Check, Control-drag from one object to the next, then click Connect in the connection inspector. That will set the tab connection between the objects. Note that when you have keyboard check turned on, the word tab appears at the bottom left of the window. That reminds you that you can press tab to test the tab order.

Cool Stuff in Other Windows, Too

Not all the neat tricks are in the design window - here are a couple you can use in the document window. If you click the tiny control on the right side of the window, the object instances are displayed in an outline view, with the number of connections, both into and out of the object. If you click on one of these numbers, the connections appear in the window, as you can see in Figure 5.


Figure 5. Outline view shows connections to an object.

You can use this view to delete connections between objects. If you hold down Control and point at a line that connects two objects, the pointer changes to a tiny pair of scissors, and clicking (you guessed it) cuts the connection.

If you just want to learn more about the connected objects, click on the name of the connected field, such as menu or _panel in Figure 5. The connected objects will appear on the screen with a line between them.

There's More (Always)

You can find more fun and timesaving tips like these by reading the informative FAQ that comes with Interface Builder. Get to the FAQ by choosing FAQ in Interface Builder's Help menu. There's even a sense of humor in the FAQ: in the section on modifier keys, right after the descriptions of what happens if you press Command, Option, and Control, the FAQ tells you that you can use the Left Pedal to disengage the clutch. Cool.


Scott Knaster has been writing about Macs for as long as there have been Macs. Scott's books How To Write Macintosh Software and Macintosh Programming Secrets were required reading for Mac programmers for more than a decade. Scott wrote developer books for General Magic and worked on Mac software for Microsoft. Scott's books have been translated into Japanese and Pascal. Scott has every issue of Mad magazine, which explains a lot.

 

Community Search:
MacTech Search:

Software Updates via MacUpdate

Latest Forum Discussions

See All

Top Mobile Game Discounts
Every day, we pick out a curated list of the best mobile discounts on the App Store and post them here. This list won't be comprehensive, but it every game on it is recommended. Feel free to check out the coverage we did on them in the links... | Read more »
Price of Glory unleashes its 1.4 Alpha u...
As much as we all probably dislike Maths as a subject, we do have to hand it to geometry for giving us the good old Hexgrid, home of some of the best strategy games. One such example, Price of Glory, has dropped its 1.4 Alpha update, stocked full... | Read more »
The SLC 2025 kicks off this month to cro...
Ever since the Solo Leveling: Arise Championship 2025 was announced, I have been looking forward to it. The promotional clip they released a month or two back showed crowds going absolutely nuts for the previous competitions, so imagine the... | Read more »
Dive into some early Magicpunk fun as Cr...
Excellent news for fans of steampunk and magic; the Precursor Test for Magicpunk MMORPG Crystal of Atlan opens today. This rather fancy way of saying beta test will remain open until March 5th and is available for PC - boo - and Android devices -... | Read more »
Prepare to get your mind melted as Evang...
If you are a fan of sci-fi shooters and incredibly weird, mind-bending anime series, then you are in for a treat, as Goddess of Victory: Nikke is gearing up for its second collaboration with Evangelion. We were also treated to an upcoming... | Read more »
Square Enix gives with one hand and slap...
We have something of a mixed bag coming over from Square Enix HQ today. Two of their mobile games are revelling in life with new events keeping them alive, whilst another has been thrown onto the ever-growing discard pile Square is building. I... | Read more »
Let the world burn as you have some fest...
It is time to leave the world burning once again as you take a much-needed break from that whole “hero” lark and enjoy some celebrations in Genshin Impact. Version 5.4, Moonlight Amidst Dreams, will see you in Inazuma to attend the Mikawa Flower... | Read more »
Full Moon Over the Abyssal Sea lands on...
Aether Gazer has announced its latest major update, and it is one of the loveliest event names I have ever heard. Full Moon Over the Abyssal Sea is an amazing name, and it comes loaded with two side stories, a new S-grade Modifier, and some fancy... | Read more »
Open your own eatery for all the forest...
Very important question; when you read the title Zoo Restaurant, do you also immediately think of running a restaurant in which you cook Zoo animals as the course? I will just assume yes. Anyway, come June 23rd we will all be able to start up our... | Read more »
Crystal of Atlan opens registration for...
Nuverse was prominently featured in the last month for all the wrong reasons with the USA TikTok debacle, but now it is putting all that behind it and preparing for the Crystal of Atlan beta test. Taking place between February 18th and March 5th,... | Read more »

Price Scanner via MacPrices.net

AT&T is offering a 65% discount on the ne...
AT&T is offering the new iPhone 16e for up to 65% off their monthly finance fee with 36-months of service. No trade-in is required. Discount is applied via monthly bill credits over the 36 month... Read more
Use this code to get a free iPhone 13 at Visi...
For a limited time, use code SWEETDEAL to get a free 128GB iPhone 13 Visible, Verizon’s low-cost wireless cell service, Visible. Deal is valid when you purchase the Visible+ annual plan. Free... Read more
M4 Mac minis on sale for $50-$80 off MSRP at...
B&H Photo has M4 Mac minis in stock and on sale right now for $50 to $80 off Apple’s MSRP, each including free 1-2 day shipping to most US addresses: – M4 Mac mini (16GB/256GB): $549, $50 off... Read more
Buy an iPhone 16 at Boost Mobile and get one...
Boost Mobile, an MVNO using AT&T and T-Mobile’s networks, is offering one year of free Unlimited service with the purchase of any iPhone 16. Purchase the iPhone at standard MSRP, and then choose... Read more
Get an iPhone 15 for only $299 at Boost Mobil...
Boost Mobile, an MVNO using AT&T and T-Mobile’s networks, is offering the 128GB iPhone 15 for $299.99 including service with their Unlimited Premium plan (50GB of premium data, $60/month), or $20... Read more
Unreal Mobile is offering $100 off any new iP...
Unreal Mobile, an MVNO using AT&T and T-Mobile’s networks, is offering a $100 discount on any new iPhone with service. This includes new iPhone 16 models as well as iPhone 15, 14, 13, and SE... Read more
Apple drops prices on clearance iPhone 14 mod...
With today’s introduction of the new iPhone 16e, Apple has discontinued the iPhone 14, 14 Pro, and SE. In response, Apple has dropped prices on unlocked, Certified Refurbished, iPhone 14 models to a... Read more
B&H has 16-inch M4 Max MacBook Pros on sa...
B&H Photo is offering a $360-$410 discount on new 16-inch MacBook Pros with M4 Max CPUs right now. B&H offers free 1-2 day shipping to most US addresses: – 16″ M4 Max MacBook Pro (36GB/1TB/... Read more
Amazon is offering a $100 discount on the M4...
Amazon has the M4 Pro Mac mini discounted $100 off MSRP right now. Shipping is free. Their price is the lowest currently available for this popular mini: – Mac mini M4 Pro (24GB/512GB): $1299, $100... Read more
B&H continues to offer $150-$220 discount...
B&H Photo has 14-inch M4 MacBook Pros on sale for $150-$220 off MSRP. B&H offers free 1-2 day shipping to most US addresses: – 14″ M4 MacBook Pro (16GB/512GB): $1449, $150 off MSRP – 14″ M4... Read more

Jobs Board

All contents are Copyright 1984-2011 by Xplain Corporation. All rights reserved. Theme designed by Icreon.