3

How can I get a Transition Animation effect(like a page slide) on a single View Controller - so that it looks like i am transitioning to a new page/controller (although only data is changing in the same view)?

For example: I have a UIViewController that has Previous and Next buttons. On clicking Next these buttons, a different Title and Image is displayed on the 'same'UIViewController.

I know this can be done with UIPageViewController - but I am new to iOS, and find it rather difficult to implement that way.

Arslan Ali
  • 17,418
  • 8
  • 58
  • 76
Jasper
  • 8,440
  • 31
  • 92
  • 133
  • Create a new UIView and transition to the new view with CoreAnination. – Juan Catalan May 26 '15 at 18:47
  • Juan> I have like 100s of pages of information to display, presenting them one at a time when Next button is clicked - so what do u mean by create new UIView - do u mean programatically - can you give an example? – Jasper May 26 '15 at 18:51
  • Or either you create your view programmatically or use a nib file/storyboard. Another solution is to instantiate the Sam view controller and define the transition, either using storyboard with a segue to itself or pushing the view controller from a navigation controller. – Juan Catalan May 26 '15 at 19:17
  • Look at this post on how to transition different views: http://stackoverflow.com/questions/8146253/animate-change-of-view-controllers-without-using-navigation-controller-stack-su?rq=1 – Juan Catalan May 26 '15 at 19:20

1 Answers1

0

I have the same case on this. But because we don't expect a complicated slide animation so I wouldn't implement the UIPageViewController. Instead, I came up with the below solution:

  • The idea is creating a snapshot view and start the animation on it, also update the view with new data at the moment user start to swipe. By doing it, we can make it feel like we are transiting to another view.

  • Sample code below was written in Xamarin.iOS but I believe it can be transfered to Swift/Obj-C easily:

            UIView snapShotView = View.SnapshotView(false); // Create snapshot for the view (I assumed that View is the container)
            View.Add(snapShotView);
            snapShotView.Frame = View.Frame; //Add snapshot and set its frame so the snapshot will be overlapped the original View
    
            CGRect snapshotEndFrame = snapShotView.Frame;
            snapshotEndFrame.X = -snapShotView.Frame.Width;
    
            UIView.Animate(0.7, 0, UIViewAnimationOptions.CurveEaseInOut,
            () =>
            {
                //Load new data to your View
                ...
    
                //Animate the snapshot view
                snapShotView.Frame = snapshotEndFrame;
            },
            () =>
            {
                //Remove Snap Shot View after doing animation to prevent memory leak
                snapShotView.RemoveFromSuperview();
                snapShotView.Dispose();
            });
    
Trung Lam
  • 1
  • 3