Nic Hubbard
Nic Hubbard

Reputation: 42139

XCode 4 Interface Builder: A better way to work with lots of overlapping views

In IB I have quite a few views that are shown. Many of them are hidden when the app loads, but are shown later when buttons are pressed. This is all fine, but when building this layout in IB it is extremely difficult to layout anything because there are so many overlapping views, some of which are partially transparent (ones that are set to hidden) and other are completely overlapping and covering others. This makes layout very hard.

What is the best method when laying out lots of views like this? Is there another way to break things up? Or better yet, can I hide a a view completely (like in photoshop) so that I can edit the ones underneath, then turn that layer back on?

Upvotes: 11

Views: 2211

Answers (4)

Cortado-J
Cortado-J

Reputation: 2257

One approach to handling overlapping items in IB is:

  1. Ensure the groups of items that you want to hide are grouped into Views.

  2. Give these Views names: e.g. ViewOptionA, ViewOptionB and ViewOptionC.
    Can do this by clicking on name of view in the tree while it is selected and then typing new name.

  3. When you want to hide one of those groups of items:
    a) Select the View by either:
    i) Clicking on it in the tree at the left or
    ii) Ctrl-Shift Clicking in the layout editor and then select the view from the list.

    b) In the Attributes Inspector set Alpha to 0.

  4. When you want to unhide one of those groups of items:
    As for 2) but set Alpha back to 1

[You do need to remember to unhide all views before you publish!
If you are forgetful like me then perhaps you could subclass UIView and set Alpha to 1. I haven't tried this subclassing idea yet.]

Upvotes: 1

CoolDocMan
CoolDocMan

Reputation: 638

I ran into this issue for an app I'm building that has an arial-view image of a park with clickable hotspots. When a hotspot is clicked a popup UIview is displayed with information about that spot in the park. I use the same VC/XIB for three parks. This makes the XIB really busy and hard to work with (i.e the same issue that you have) The detail UIViews make it hard to work with the views underneath. My workaround was to pick each detailed UIView that was hiding the part of the XIB I wanted to work on, and add 1000 to the UIView origin.x in the size inspector. This moved those UIViews enough out of the way for me to do what I needed to with the XIB. Then when I was done, I moved them back by x 1000. (I just needed to move them out horizontally to do what I needed to)

I know its clunky but given that XCode does not have a convenient way to hide portions of an XIB - it was the quickest approach I could think of!

Upvotes: 2

Paul Herron
Paul Herron

Reputation: 831

Another option when trying to select a view that is obscured by another is the shortcut:

'ctrl' + 'shift' and click

It displays a list of all the views under the cursor.

Upvotes: 13

jrturton
jrturton

Reputation: 119242

I'm not aware of any way to hide objects in the canvas, but a useful trick for complex layouts is to double-click an item in the document tree to the left - this selects the item and puts focus on the canvas, you can the use the cursor keys to nudge it about.

This doesnt solve the problem of not being able to see things because there are, for example, five or six labels occupying the same space, but if that is the situation it may be a better idea to have a single label and change its contents in code.

Upvotes: 8

Related Questions