Search code examples
ios7uinavigationcontrolleruipageviewcontroller

UIPageViewController within NavigationController


I've read every tutorial I've found about UIPageViewController, but they show just basics, I'd like to create something like new twitter app has:

enter image description here

UIPageViewController is embedded into Navigation controller, title of navigation bar is based on current page and those page dots are there as well, user can tap on item on current page(item from table view/collection view) to see detail.

I was able to come up with something similar, each page had collection view, and showing detail of some item was reflected in navigation bar, there was correct title and "<" button, but I wasn't able to change title based on currently shown page

Please, could you describe me how to do this in few steps/basic structure of controllers?


Solution

  • Don't know if you are still working on this but here goes anyway. To set up a UIPageViewController you might use the tutorial and two questions below.

    http://www.appcoda.com/uipageviewcontroller-storyboard-tutorial/

    How to implement UIPageViewController that utilizes multiple ViewControllers

    How to add UIBarButtonItem to NavigationBar while using UIPageViewController

    The last link pertains specifically to setting the contents of the navigationBar depending on what you are viewing.

    The key is to create a UINavigationItem Property in the .h file of your UIPageViewController content view controllers, meaning the ones/one that are displaying whatever it is you are displaying.

    From my code in FirstViewController.h SecondViewController.h and ThirdViewController.h

    @property (strong, nonatomic) UINavigationItem *navItem;  
    

    In the second and third links above you'll see a storyboard layout of a Master-Detail application (which uses a navigation controller). The UIPageViewControllerDataSource is the DetailViewController. The three pages associated with the pageViewController are my content view controllers.

    In DetailViewController.m you have to instantiate the contentViewControllers somewhere. At that point you pass the DetailViewControllers navigationItem id to the content view controllers. Here is how I instantiate my content view controllers using the delegate methods of the UIPageViewController.

    - (UIViewController *)pageViewController:(UIPageViewController *)pageViewController viewControllerBeforeViewController:(UIViewController *)viewController
    {
    
        NSString * ident = viewController.restorationIdentifier;
        NSUInteger index = [_vc indexOfObject:ident];
    
        if ((index == 0) || (index == NSNotFound)) {
            return nil;
        }
    
        index--;
    
        if (index == 0) {
            return [self controllerAtIndex:index];
        }else if (index == 1){
            return [self secondControllerAtIndex:index];
        }else if (index == 2){
            return [self thirdControllerAtIndex:index];
        }else{
            return nil;
        }
    }
    

    The delegate method calls the method below. It is almost directly from the tutorial link with just a few modifications.

    -(FirstController *)controllerAtIndex:(NSUInteger)index
    {
        FirstController *fvc = [self.storyboard instantiateViewControllerWithIdentifier:@"FirstPageController"];
        fvc.imageFile = self.pageImages[index];
        fvc.titleText = self.pageTitles[index];
        fvc.pageIndex = index;
        fvc.navItem = self.navigationItem;
        return fvc;
    }
    

    Notice that properties are passed into the view controller including self.navigationItem. Passing it in ensures you can make changes to the navigationBar items.

    Then in the viewDidAppear method of your content view controller you can simply set the title on the navigation bar like this.

    navItem.navigationItem.title = @"Whatever you want the title to be";
    

    It is important to use viewDidAppear because viewDidLoad is not called every time the screen appears. I believe the UIPageViewController caches the page before and the page after whatever you are viewing which saves the system from having to load the page every time you navigate to it.

    If you are using a single view controller for all you pages like the tutorial does you will have to use the index property to know what to set the title to.

    Hope this helps!