iPad Popovers

With the iPad, Apple introduced a new user interface element called the popover. This was mainly used in apps where there was a navigation list and a larger view showing more information: what Apple calls a Master-Detail application.

In landscape mode, the list is shown fully on the left of the screen and the details on the right. Switch to portrait mode and the list disappears, but is accessible from a button in the top left that shows the popover.

This is a very useful design and is what I used in Pic-a-POD for iOS: the list shows the available PODs, with a thumbnail and caption for each. Tap on one of these and the larger picture is downloaded and displayed, along with further info and more options.

However Apple has quietly changed the way popovers work in iOS 5.1 and I don’t like it as much. Instead of dropping down with an arrow pointing to the button that triggered it, the popover now slides in from the left, taking up the entire height of the screen.

There seems to be no way to fix this. I have filed a bug report with Apple, but if this is a deliberate design change, then I expect it to stay like this. The best solution would be if a popover could be configured to use either method.

Here are screenshots from the iPad Simulator running in 5.0 mode on the left and 5.1 mode on the right, which show the difference once the popover has appeared:

Popover iOS 5.1Popover iOS 5.0

13 thoughts on “iPad Popovers

  1. Hi,

    Thanks very much for posting this article. I have spent the last couple of hours trying to figure out why my pop-up doesn’t look like the one on the left …. which does looks far better i think. I agree – we should at least get a choice :-).

    I’ve been working through the Stanford University iOS training lectures and have been posting the solutions to the assignments on my blog at http://www.i4-apps.com/cs193p-solutions/ . Your post is relevant to one of the assignments, so I’ll point my readers to this page…

    Many thanks,
    David

    1. What a coincidence! I went to your site after I couldn’t figure out how to show a popover in assignment 3 – great site.

  2. I have found another consequence David, although I haven’t yet spent any time investigating it. Pic-a-POD allows people to use right & left swipes to cycle through the PODs of the day. Now a swipe to the left works as expected, but a swipe to the right brings out the popover.

    The Stanford lectures are great, especially as they cover a lot of the new stuff in Xcode 4 like storyboards, segues etc.

  3. Just tested this and it does stop the swiping. I added the following line to the application:didFinishLaunchingWithOptions: method in the app delegate file.

    [splitViewController setPresentsWithGesture:NO];

    Thanks David.

      1. Ignore this – the link is working now.

        My app is older and doesn’t use storyboards and segues, but I will examine your code and see if I can adapt it.

        Thanks for the post!

  4. Quick follow-up: I posted a bug report to Apple about this and got an answer back to the effect that this is how popovers now behave (iOS 5.1 or later) when owned by a UISplitViewController. So if you want the older type of popover, don’t use a master-detail project template.

    Sarah

      1. Possibly Apple is using private APIs, which they do quite a lot.
        Or they are using custom views instead of the standard UISplitViewController. It is possible to get the old behaviour, but not when using the standard master-detail template.

Leave a Reply

Your email address will not be published. Required fields are marked *