Itty Bitty Labs

Code and technical stuff from Itty Bitty Apps.

Reveal tips: Navigation

Some of the awesome features of Reveal have been going unoticed, so I have written a quick rundown of how to improve your Reveal workflow so you can navigate your app like a pro.

And here is the tl;dr video:

Navigating the hierarchy

The outline view gives you a detailed one-for-one representation of the application’s view hieararchy. For a lot of apps, their view hierarchy will be massive, and sometimes scrolling and clicking just doesn’t cut it. My most used shortcut in Reveal has to be selecting the current view’s superview for those times I clicked the wrong view in the canvas.
These are the shortcuts that help you pop around the tree with ease:

  • Select current views’s superview [
  • Select current views’s first subview ]
  • Select current views’s next sibling
  • Select current views’s previous sibling ;

Because the outline uses native OS X controls, system defaults for expanding and collapsing nodes are the same as Finder

  • Collapse all nodes from the current selection
  • Expand all nodes from the current selection

Canvas viewing options

Now, one of the most eye-zappingly-awesome parts of Reveal is the 3d Canvas, which has quite a few features that people are yet to discover. There is a collection of mouse/trackpad combos to pan, rotate and increase the z-depth of the 3d representation.

  • Pan Up/Down two finger up/down or mouse-wheel
  • Pan Left/Right two finger left/right or mouse-wheel
  • Rotate two finger left/right or mouse-wheel
  • Z-Depth two finger pinch or mouse-wheel

Easy management of Zoom levels:

  • Zoom in + or two finger pinch
  • Zoom out or two finger pinch
  • Zoom to actual size 0
  • Zoom to fit 9
  • Zoom to current selection 8

Gaining some focus

Reveal lists every* UIView in the view hierarchy from the UIScreen down. Because that easily becomes an excessive amount of views to scroll through, Reveal allows you to drill-down and isolate your focus on a particular subset by simply double clicking a view:

I personally use this focussing a lot, especially when iterating with designers or any time I have to manipulate a UITableViewCell.
Once ‘focussed’ on a subset of the view hierarchy, you can navigate your way back up the tree using the path-bar at the top of the canvas. This is really helpful for those times you accidently double-clicked a view that was in front of the view you wanted to focus on.
You can also go back and forth in your focus history with the left/back buttons or the key-board shortcuts:

  • Back in Focus History ^
  • Forward in Focus History ^

* Reveal cannot see into a UIRemoteViewControllers’ views such as MFMailComposeViewController

File /Users/seanw/Projects/iba/iba/ittybittyapps.github.io/source/includes/about_peter.markdown could not be found