dhrm
dhrm

Reputation: 14944

How to setup a partial curl modal not hiding toolbar?

In the Google Maps app on iPhone, the toolbar in the buttom is still visible after the modal with a partial curl transition is preformed. When I setup a modal seque in my storyboard with a partial curl, the new view controller is hiding the toolbar from the parant view.

How can I setup a partial curl like the Google Maps app?

Google Maps on iPhone Modal in Storyboard

Upvotes: 2

Views: 1489

Answers (2)

Dinesh Raja
Dinesh Raja

Reputation: 8501

Try this code.This will be helpful to you.PLEASE DON'T HESITATE TO TRY THIS CODE.

You will need to import a QuartzCore.framework.

locationMapView is your MKMapView and curlView is your second UIView

- (IBAction)curlButtonPressed:(id)sender {

    if (isCurlStarted == NO) {
        [UIView animateWithDuration:1.0 
                         animations:^{
                             CATransition *animation = [CATransition animation];
                             [animation setDelegate:self];
                             [animation setDuration:0.7];
                             [animation setTimingFunction:[CAMediaTimingFunction functionWithName:@"default"]];
                             animation.type = @"pageCurl";
                             animation.fillMode = kCAFillModeForwards;
                             animation.endProgress = 0.65;
                             [animation setRemovedOnCompletion:NO];
                             [locationMapView.layer addAnimation:animation forKey:@"pageCurlAnimation"];  
                             [locationMapView addSubview:curlView];
                             ;}  
         ];            
        isCurlStarted = YES;
    }else{
        [self curlDownPressed:curlDownButton];
    }

}

- (IBAction)curlDownPressed:(id)sender {
    [UIView animateWithDuration:1.0 
                     animations:^{
                         CATransition *animation = [CATransition animation];
                         [animation setDelegate:self];
                         [animation setDuration:0.7];
                         [animation setTimingFunction:[CAMediaTimingFunction functionWithName:@"default"]];
                         animation.type = @"pageUnCurl";
                         animation.fillMode = kCAFillModeForwards;
                         animation.startProgress = 0.35;
                         [animation setRemovedOnCompletion:NO];
                         [locationMapView.layer addAnimation:animation forKey:@"pageUnCurlAnimation"];  
                         [curlView removeFromSuperview];

                         ;}  
     ];
    isCurlStarted = NO;
}

Upvotes: 3

user671253
user671253

Reputation:

You'll probably need to go with OpenGL ES for this one. Core Animation exposes the ability to work with layers, even in 3-D, but all layers are just rectangles and they are manipulated as such. You can animate the flipping of a layer about an axis, even with a perspective distortion, but the kind of curving you want to do is more complex than you can manage using the Core Animation APIs.

You might be able to split your image up into a mesh of tiny layers and manipulate each using a CATransform3D to create this curving effect, but at that point you might as well be using OpenGL ES to create the same effect.

Upvotes: 2

Related Questions