I am working on an application in which I am using UIScrollview, in that I need to use page flip effect.
How can I give Page flip effect in UIScrollview?
Note: In UIScrollview when we change Page at that time Scrolling the Page forward & backward. Can it be possible to give Page scroll effect at the time when we scroll page?
Forward flip -
CATransition *animation = [CATransition animation];
[animation setDelegate:self];
[animation setDuration:1.0f];
animation.startProgress = 0;
animation.endProgress = 1;
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]];
animation.type = #"pageCurl";
animation.subtype=#"fromRight";
animation.fillMode = kCAFillModeForwards;
[animation setRemovedOnCompletion:NO];
[animation setFillMode: #"extended"];
[animation setRemovedOnCompletion: NO];
[lyr addAnimation:animation forKey:#"WebPageCurl"];
Backward flip -
CATransition *animation = [CATransition animation];
[animation setDelegate:self];
[animation setDuration:1.5f];
animation.startProgress = 0;
animation.endProgress = 1;
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]];
animation.type = #"pageUnCurl";
animation.subtype=#"fromRight";
animation.fillMode = kCAFillModeBackwards;
[animation setRemovedOnCompletion:NO];
[animation setFillMode: #"extended"];
[animation setRemovedOnCompletion: NO];
[lyr addAnimation:animation forKey:#"WebPageCurl"];
you can use this code when UIScrollView delegates.
Related
I am developing one application.In that i want to move the uiview from right to left using below code.
-(void)centerAnimation1:(id)sender
{
theview=qstnview;
CATransition *animation = [CATransition animation];
animation.delegate = self;
[animation setDuration:0.4];
[animation setType:kCATransitionMoveIn];
if(rhtolft)
{
[animation setSubtype:kCATransitionFromLeft];
}
else
{
[animation setSubtype:kCATransitionFromRight];
}
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]];
//[animation setanima]
[[theWindow layer] addAnimation:animation forKey:#"SwitchToView1"];
[[theview layer] addAnimation:animation forKey:#"SwitchToView1"];
[qstnview removeFromSuperview];
}
- (void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag{
if(animate)
{
CATransition *animation = [CATransition animation];
animation.delegate = self;
[animation setDuration:0.4];
[animation setType:kCATransitionMoveIn];
if(rhtolft)
{
[animation setSubtype:kCATransitionFromLeft];
rhtolft=NO;
}
else
{
[animation setSubtype:kCATransitionFromRight];
}
//[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]];
//[animation setanima]
[[theview layer] addAnimation:animation forKey:#"SwitchToView1"];
[self.view addSubview:qstnview];
}
}
But this one is moving the view from right side last edge to left side.But i need to move within the frame size only.I dont need to start from right side edge.So please tell me how to do that one.
EDIT:
[UIView animateWithDuration:0.33f
delay:0.0f
options:UIViewAnimationOptionCurveEaseInOut | UIViewAnimationOptionAllowUserInteraction
animations:^{
[theView setFrame:newFrame]; //set new frame for view where x =200;
}
completion:^(BOOL finished){
// do whatever post processing you want (such as resetting what is "current" and what is "next")
}];
The screen from right to left using CATransition like this
CATransition *animation = [CATransition animation];
[animation setDuration:0.3];
[animation setType:kCATransitionPush];
[animation setSubtype:kCATransitionFromRight];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]];
[[theView layer] addAnimation:animation forKey:#"rightToLeftAnimation"];
Use this code for changing images with animation:
CATransition *transition = [CATransition animation];
transition.duration = 1.0f;
transition.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
transition.type = kCATransitionMoveIn;
transition.subtype=kCATransitionFromLeft;
[yourImageViewName.layer addAnimation:transition forKey:nil];
I dont think you need to dive down to CA to do this kind of thing. It can be done using UIView animations. Here http://www.raywenderlich.com/2454/how-to-use-uiview-animation-tutorial is a good tutorial on UIView animations.
Is there any way to change the default duration of the page curl transition?
It is way to fast then I wish it will be?
Thanks
Shani
Here is the way to to use default transition to curl the page and to specify the speed of the curl.
CATransition *animation = [CATransition animation];
[animation setDelegate:self];
[animation setDuration:1.0f];
animation.startProgress = 0.2;
animation.endProgress = 1;
if (isGoingBackward) {
[animation setType:#"pageUnCurl"];
[animation setSubtype:kCATransitionFromTop];
}
else
{
[animation setType:#"pageCurl"];
[animation setSubtype:kCATransitionFromLeft];
}
[animation setFillMode: kCAFillModeBackwards];
[self.view.layer addAnimation:animation forKey:#"animation"];
I have a little problem, I have a viewcontroller with a webview and some button, I want to apply to webview a curl animation and see instad webview the view if the same controller.
like this
instead this
in the first case I use webview.hidden = YES but when I try to came back the view is (obviusly) hidde, if I put webview.hidden = NO on the method for come back I get this
any solution?
this is my code:
- (IBAction)toggleView:(id)sender {
CATransition *animation = [CATransition animation];
[animation setDelegate:self.view];
[animation setDuration:0.7];
[animation setTimingFunction:UIViewAnimationCurveEaseInOut];
animation.type = #"pageCurl";
animation.fillMode = kCAFillModeForwards;
animation.endProgress = 0.7;
[animation setRemovedOnCompletion:NO];
[[self.vistaWeb layer] addAnimation:animation forKey:#"pageCurlAnimation"];
}
- (IBAction) torna {
CATransition *animation = [CATransition animation];
[animation setDelegate:self.view];
[animation setDuration:0.7];
[animation setTimingFunction:UIViewAnimationCurveEaseInOut];
animation.type = #"pageCurl";
animation.fillMode = kCAFillModeBackwards;
animation.startProgress = 0.7;
animation.endProgress = 0;
[animation setRemovedOnCompletion:NO];
[[self.vistaWeb layer] addAnimation:animation forKey:#"pageCurlAnimation"];
}
I wanted to know if anyone managed a pagecurl from the top using the CATRANSITION. I have the following :
CATransition *animation = [CATransition animation];
[animation setDelegate:self];
[animation setDuration:0.35];
[animation setTimingFunction:UIViewAnimationCurveEaseInOut];
animation.type = #"pageCurl";
animation.subtype = kCATransitionFromTop;
animation.fillMode = kCAFillModeForwards;
animation.endProgress = 0.30;
[animation setRemovedOnCompletion:NO];
[self.view.layer addAnimation:animation forKey:#"pageCurlAnimation"];
but unfortunately, it always does the page curl from the bottom. I will be very grateful if anyone can tell me how to do a page curl from the top.
Many thanks.
I've got this working. You need to set animation.type = #"pageUnCurl"; - who would have thought! Thanks apple.
CATransition *animation = [CATransition animation];
[animation setDelegate:self];
[animation setDuration:0.5];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]];
animation.type = #"pageUnCurl";
animation.subtype = kCATransitionFromTop;
animation.fillMode = kCAFillModeForwards;
animation.startProgress = 0.3;
[animation setRemovedOnCompletion:NO];
[self.helpView.layer addAnimation:animation forKey:#"pageCurlAnimation"];
Found the answer, need to set subtype to from right!
subtype = KCATransitionFromLeft or KCATransitionFromRight
you can also remove the animation.endProgress if you want a total animation of curl page .
=)
I am trying to do a partial page curl with the following:
CATransition *animation = [CATransition animation];
[animation setDelegate:self];
[animation setDuration:1.0f];
[animation setTimingFunction:UIViewAnimationCurveEaseInOut];
[animation setType:(notCurled ? #"mapCurl" : #"mapUnCurl")];
[animation setRemovedOnCompletion:NO];
[animation setFillMode: #"extended"];
[animation setRemovedOnCompletion: NO];
notCurled = !notCurled;
[[delegate.window layer] addAnimation:animation forKey:#"pageFlipAnimation"];
Unfortunately, it does not do anything . I am using the latest SDK. I remember being able to use this in 3.0.
Thanks.
Ok it seems that the above does not work anymore, I am using the following now:
CATransition *animation = [CATransition animation];
[animation setDelegate:self];
[animation setDuration:0.35];
[animation setTimingFunction:UIViewAnimationCurveEaseInOut];
animation.type = #"pageCurl";
animation.fillMode = kCAFillModeForwards;
animation.endProgress = 0.65;
[animation setRemovedOnCompletion:NO];
[self.view.layer addAnimation:animation forKey:#"pageCurlAnimation"];