iphone switch views by swiping fingers to left and right, similar as the stock app

Question

Hi,

I am interested in how the lower portion of the iphone stock app is implemented. The lower part of the app, where you can switch the views by swiping your finger to left/right and the "..." below the view to indicate which view the user is looking at.

It looks to me a tabview component. I am trying to look for the UI component as well as google it, but i have not yet find anything like it. Most of the examples I found are using scroll view. When you swipe the finger to left/right the scroll bar appears, and more importantly, there is no "..." under the view to indicate which view the user is looking at.

Could anybody point me to a similar example?

Thanks, Thomas

Answer 1

This is called touch events. more so Swipe touch on the iphone.

And here are two examples.

Heres a code snippet: You first need to tell the application that touchesBegan.

You can find some details on the API for this. Then the delegate methods will be called automatically everytime a user touches the iphone screen.

- (void)touchesEnded:(NSSet*)touches withEvent:(UIEvent*)event {
    UITouch *touch = [touches anyObject];
    if (touch.info & UITouchSwipedRight) {
        [self changeViewRight];
    } else if (touch.info & UITouchSwipeLeft) {
        [self changeViewLeft];
    }
    return;
}

check this example:

http://devblog.wm-innovations.com/tag/touchesbegan/

Its a really good example.

Hope this helps. Let me know if it did a little. Thanks

PK

Answer 2

It's a UIScrollView with pagingEnabled set to YES taking up most of the screen with a UIPageView underneath it. See Apple's PageControl sample code for details.

You can turn off showing the scroll indicators by setting the showsHorizontalScrollIndicator and showsVerticalScrollIndicator properties of the scroll view to NO.

It might also be worth checking out the PhotoScroller sample code for an in-depth example of how to do pagination using a UIScrollView. There's also a great video called "Designing Apps with Scroll Views" that walks you through paginating views using a UIScrollView in the WWDC 2010 videos. I highly recommend watching it and the other WWDC videos. You can get them by signing into the iOS developer center and scrolling to the bottom.

Also, like they tell you in the video, you don't need to use touch events or override touchesBegan:withEvent: or similar functions to make this happen. If you do it that way, you have to do lots of work to pass events that you don't care about through to the views you're showing and stuff like that. UIScrollView with pagingEnabled set to YES does all of the hard work for you.

If you don't want to use a scroll view for some reason, using a UIGestureRecognizer is the way to go. But really, just use a scroll view.