How to Push a ViewController from Left Over another - ios

Question

I want to make a Navigation Drawer Like This:
I saw many third party libararies. But I want to do it from my own.
Here is what I am trying :
__block UIViewController *sourceViewController = self;
NavigationDrawerVC *controller = [[NavigationDrawerVC alloc] initWithNibName:#"NavigationDrawerVC" bundle:nil];
__block UIViewController *destinationController = (UIViewController*)controller;
CATransition* transition = [CATransition animation];
transition.duration = 5;
transition.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
transition.type = kCATransitionPush; //kCATransitionMoveIn; //, kCATransitionPush, kCATransitionReveal, kCATransitionFade
transition.subtype = kCATransitionFromLeft; //kCATransitionFromLeft, kCATransitionFromRight, kCATransitionFromTop, kCATransitionFromBottom
[sourceViewController.navigationController.view.layer addAnimation:transition
forKey:kCATransition];
[sourceViewController.navigationController pushViewController:destinationController animated:NO];
But I am getiing o/p like this:
When I click on Button My Screen Changes Like this:
My Previous VIewController also moving.
I want to make it Fix. And also I am not able to stop it at certain point.

Answer 1

You might want to look into using a child controller for this.
Here's a very simplified code which demonstrates this concept. It adds a child view controller and animates it to the middle of the screen. This should at least give you a starting point:
UIViewController *drawerVC = [[UIViewController alloc] init];
drawerVC.view.backgroundColor = [UIColor redColor];
[self addChildViewController:drawerVC];
drawerVC.view.frame = CGRectMake(-self.view.frame.size.width, 0, self.view.frame.size.width, self.view.frame.size.height);
[self.view addSubview:drawerVC.view];
[drawerVC didMoveToParentViewController:self];
[UIView animateWithDuration:0.3 animations:^{
drawerVC.view.frame = CGRectOffset(drawerVC.view.frame, drawerVC.view.frame.size.width * 0.5, 0);
}];