How to setup Container View so as to swap two children

Question

I am having what seems like a typical Container View problem in iOS. I have a ViewController with two subviews: a UISegmentedControl and a Container View. Now having placed my Container View, in the storyboard, I am not sure how to proceed. Naturally I thought my next step was to subclass UIContainerView to do all the stuff that I read in the iOS Documentation. But there is no such class as UIContainerView. So now, beyond what I was able to place in the storyboard, I am stuck. Hoping someone can help me I will posit what seems like a simple scenario.

Imagine:

One ViewController with two buttons (Cat, Dog) and a ContainerView.
When user clicks on catButton, then the ContainerView should show the CatViewController (and do similarly for dogButton)
Image that already I have the storyboard setup.
For simplicity, let CatViewController contain a single UILabel with the word CAT (and similarly for DogViewController).
also, in the storyboard, I have already created CatViewController and DogViewController as two stand-alone, unreachable, View Controllers.

So at this point, how do I proceed? Since I cannot subclass such a class as UIContainerView, what do I do?

I believe this scenario is simple enough for someone to provide an example, but if you deem it too complicated, please provide an example to yet a simpler scenario. I just want to see how a simple one is done.

P.S. I have already taken a tour here on StackOverflow, such as:

Swapping child views in a container view

and I have already read the docs at https://developer.apple.com/library/ios/featuredarticles/ViewControllerPGforiPhoneOS/CreatingCustomContainerViewControllers/CreatingCustomContainerViewControllers.html#//apple_ref/doc/uid/TP40007457-CH18-SW6

Ref https://developer.apple.com/library/ios/documentation/UIKit/Reference/UIViewController_Class/Reference/Reference.html#//apple_ref/doc/uid/TP40006926-CH3-SW86, I assume your first ViewController should add the Cat- or DogViewController using addChildViewController: and then their rootView to the containerView — Bjørn Egil, Aug 20 '14 at 18:34

score 1 · Answer 1 · answered Feb 04 '16 at 12:23

I think is better use an UISegmentedControl instead two UIButtons. The container view subviews (_vwContainer.subviews) contains initially the CatViewController's view, automatically instantiated.

//  ViewController.m
#import "ViewController.h"

@interface ViewController ()
@property (weak, nonatomic) IBOutlet UIView *vwContainer;
@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    _vwContainer.clipsToBounds = YES;
}

- (IBAction)onSegmentValueChanged:(UISegmentedControl *)sender {
    NSLog(@"Value changed to: %zd",sender.selectedSegmentIndex);
    NSLog(@"BEFORE: self.childViewControllers: %@",self.childViewControllers);
    NSLog(@"BEFORE: _vwContainer.subviews: %@",_vwContainer.subviews);

    // set oldVC & newVC
    UIViewController *oldVC = self.childViewControllers.firstObject;
    NSString *strIdNewVC;
    switch (sender.selectedSegmentIndex) {
        case 0:    strIdNewVC = @"catVC";   break;
        default:   strIdNewVC = @"dogVC";
    }
    UIViewController *newVC = [self.storyboard instantiateViewControllerWithIdentifier:strIdNewVC];

    //
    [oldVC willMoveToParentViewController:nil];
    [self addChildViewController:newVC];

    // Prepare animation transition, for example left to right
    newVC.view.frame = oldVC.view.frame;
    CGPoint pntEnd = oldVC.view.center;
    CGPoint pntInit = pntEnd;
    pntInit.x += oldVC.view.frame.size.width;
    newVC.view.center = pntInit;

    [self transitionFromViewController:oldVC toViewController:newVC
                              duration:0.25 options:0
                            animations:^{

                                newVC.view.center = pntEnd;

                              } completion:^(BOOL finished) {
                                  [oldVC removeFromParentViewController];
                                  [newVC didMoveToParentViewController:self];
                                  NSLog(@"AFTER: self.childViewControllers: %@",self.childViewControllers);
                                  NSLog(@"AFTER: _vwContainer.subviews: %@",_vwContainer.subviews);
                              }];
}

@end

How to setup Container View so as to swap two children

1 Answers1