Kindle iPhone App Navigation - how to - iphone

Question

I like the kindle for iPhone's navigation - the one which enables you to just slide the titles in the navigation bar to move from one view to another. (I'm attaching the image)
However, I was searching for a long time yesterday and I cannot find anybody who has done something similar.
Would you have any ideas on how to do this?
UPDATE: May 24, 2012
So now I have codes. Thanks to this tutorial http://bit.ly/xNOiqd. (I just copied most of his code.) But I still cannot achieve the same effect that the kindle app's nav bar has. I can now peek on the left and the right item but my scroll view skips the labels which are on the odd indices of my array. Let's say I have 'Favourites', 'All Products', and 'Categories'. When I swipe left, I move from 'Favourites' to 'Categories' and skip 'All Products'
Here's the code.
#pragma mark -
- (void)loadVisiblePages {
// First, determine which page is currently visible
CGFloat pageWidth = self.scrollView.frame.size.width;
NSInteger page = (NSInteger)floor((self.scrollView.contentOffset.x * 2.0f + pageWidth) / (pageWidth * 2.0f));
// Update the page control
self.pageControl.currentPage = page;
// Work out which pages we want to load
NSInteger firstPage = page - 1;
NSInteger lastPage = page + 1;
// Purge anything before the first page
for (NSInteger i=0; i<firstPage; i++) {
[self purgePage:i];
}
for (NSInteger i=firstPage; i<=lastPage; i++) {
[self loadPage:i];
}
for (NSInteger i=lastPage+1; i<self.pageImages.count; i++) {
[self purgePage:i];
}
}
- (void)loadPage:(NSInteger)page {
if (page < 0 || page >= self.pageImages.count) {
// If it's outside the range of what we have to display, then do nothing
return;
}
// Load an individual page, first seeing if we've already loaded it
UIView *pageView = [self.pageViews objectAtIndex:page];
if ((NSNull*)pageView == [NSNull null]) {
CGRect frame = self.scrollView.bounds;
//frame.origin.x = frame.size.width * page;
frame.origin.x = (frame.size.width /2) * page;
frame.origin.y = 0.0f;
//
frame = CGRectInset(frame, 10.0f, 0.0f);
//self.scrollView.bounds = frame;
/* == orig line
UIImageView *newPageView = [[UIImageView alloc] initWithImage:[self.pageImages objectAtIndex:page]];
newPageView.contentMode = UIViewContentModeScaleAspectFit;
newPageView.frame = frame;
*/
UILabel *newPageView = [[UILabel alloc] init];
newPageView.text = [self.pageImages objectAtIndex:page];
newPageView.textColor = [UIColor whiteColor];
//newPageView.textColor = [UIColor grayColor];
newPageView.textAlignment = UITextAlignmentCenter;
newPageView.font = [UIFont fontWithName:#"Helvetica-Bold" size:20];
[newPageView setBackgroundColor:[UIColor clearColor]];
newPageView.frame = frame;
[self.scrollView addSubview:newPageView];
[self.pageViews replaceObjectAtIndex:page withObject:newPageView];
}
}
- (void)purgePage:(NSInteger)page {
if (page < 0 || page >= self.pageImages.count) {
// If it's outside the range of what we have to display, then do nothing
return;
}
// Remove a page from the scroll view and reset the container array
UIView *pageView = [self.pageViews objectAtIndex:page];
if ((NSNull*)pageView != [NSNull null]) {
//[pageView removeFromSuperview];
//[self.pageViews replaceObjectAtIndex:page withObject:[NSNull null]];
}
}
- (void)viewDidLoad
{
[super viewDidLoad];
//scroll view stuff
self.scrollView.delegate = self;
//attempt to make size of scrollview smaller
//CGRect frame = self.scrollView.bounds;
//frame = CGRectInset(frame, 10.0f, 0.0f);
//CGFloat width = self.scrollView.frame.size.width/2.0f;
self.pageImages = [NSArray arrayWithObjects:#"Favourites", #"All Products", #"Categories",#"Boo yah", nil];
NSInteger pageCount = self.pageImages.count;
// Set up the page control
self.pageControl.currentPage = 0;
self.pageControl.numberOfPages = pageCount;
// Set up the array to hold the views for each page
self.pageViews = [[NSMutableArray alloc] init];
for (NSInteger i = 0; i < pageCount; ++i) {
[self.pageViews addObject:[NSNull null]];
}
}
- (void) viewWillAppear:(BOOL)animated{
[super viewWillAppear:animated];
CGSize pagesScrollViewSize = self.scrollView.frame.size;
//self.scrollView.contentSize = CGSizeMake(pagesScrollViewSize.width * self.pageImages.count, pagesScrollViewSize.height);
//This modifies the size of the scroll view, I can't seem to get it right
self.scrollView.contentSize = CGSizeMake((pagesScrollViewSize.width / 1.50f )* self.pageImages.count, self.scrollView.frame.size.height);
// Load the initial set of pages that are on screen
[self loadVisiblePages];
}
- (void)scrollViewDidScroll:(UIScrollView *)scrollView {
// Load the pages which are now on screen
[self loadVisiblePages];
}

Answer 1

iCarousel is a nice open source project with lots of scroll types.

Answer 2

A paged scrollview and AQGridView most likely. If not, it would be an acceptable reverse-engineering attempt anyways.