In my application i want to give an animation to UIButtons, like the buttons will "fall out" of the screen when they hide.
I tried the following code but it didn't give me a good result.
[UIView animateWithDuration:1.5
animations:^{
S1Button.frame = CGRectMake(20, 10, 50, 10);
}];
[S1Button setHidden:YES];
break;
You can set new position and hide the button after animation.
[UIView animateWithDuration:0.9 animations:^{
tradeButton.frame = (CGRect){ CGPointMake(51, 150), tradeButton.bounds.size };
} completion:^(BOOL finished) {
tradeButton.hidden = YES;
// etc.
}];
Use the animation method which has a completion block and hide the button there. Currently your hide method runs immediately so you don't see the animation.
[UIView animateWithDuration:1 animations:^{
S1Button.frame = CGRectMake(20, 10, 50, 10);
} completion:^(BOOL finished) {
[S1Button setHidden:YES];
}]
Try this one
To fade out:
[UIView animateWithDuration:0.3 animations:^{
button.alpha = 0;
} completion: ^(BOOL finished) {
button.hidden = YES;
}];
To fade in:
button.alpha = 0;
button.hidden = NO;
[UIView animateWithDuration:0.3 animations:^{
button.alpha = 1;
}];
[UIView animateWithDuration:0.25f
animations:^{
S1Button.frame = CGRectMake(20, 10, 50, 10);
}completion:^(BOOL completed){
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:.3];
S1Button.alpha = 1;
[UIView commitAnimations];
}];
In your Code, The hidden property of Button is NOT animatable. When this animation block runs, your button will immediately hidden , but it will not fade/animate. The appropriate way to fade out a UIView is to animate its alpha property from 1.0 to 0.0 like this:
[UIView animateWithDuration:2.0
delay:0.0
options: UIViewAnimationCurveEaseOut
animations:^{S1Button.frame = CGRectMake(20, 10, 50, 10);S1buttonA.alpha = 0;}
completion:nil];
try this:
you hide the button before your animation completion, the no animation is visible. So, replace your code with this:
[UIView animateWithDuration:1.5 animations:^{
S1Button.frame = CGRectMake(20, 10, 50, 10);
} completion:^(BOOL finished) {
[S1Button setHidden:YES];
}];
break;
Related
I want to move my UIView from left to right in a repeatedly till the view not reached at the boundary of the right side. the below code running repeatedly but move only 5 points and repeat from starting point i want to repeat from last current state and the +5 to move further.
CGPoint pos = mover.center;
pos.x=25;
int count = 25;
[UIView beginAnimations:nil context:NULL];
pos.x=count;
[UIView setAnimationDuration:0];
[UIView setAnimationBeginsFromCurrentState:YES];
[UIView setAnimationRepeatCount:INFINITY];
//[UIView setAnimationRepeatAutoreverses:YES];
// CGPoint pos = mover.center;
//pos.x +=5;
count = (pos.x+=5);
mover.center = pos;
i want to see object moving in +5 points interval.
and i'm new in objective c and iphone so please help me as fast as possible .
basically my task is move view on the border of the screen mean (left to right ,up to down ,right to left and down to up) means move view in in sequence and through border of the screen of simulator repeatedly.
i hope your answer helpful to me and other who is new in this technology(iPhone).
thank you very much.
To move view from one position to another i would set its frame inside animation block. Something like this would help you:
- (void)viewDidLoad
{
[super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.
// `customView` is a UIView defined in .h file
customView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 100, 100)];
customView.backgroundColor = [UIColor redColor];
[self.view addSubview:customView];
[self rotateViewInSelfBoundary];
}
-(void)rotateViewInSelfBoundary
{
CGRect screen = [[UIScreen mainScreen] bounds];
// Top Left to top right
[UIView animateWithDuration:3.0f
animations:^{
[customView setFrame:CGRectMake(screen.size.width - customView.frame.size.width, 0, 100, 100)];
}
completion:^(BOOL finished)
{
// Top right to bottom right
[UIView animateWithDuration:3.0f
animations:^{
[customView setFrame:CGRectMake(screen.size.width - customView.frame.size.width, screen.size.height - customView.frame.size.height, 100, 100)];
}
completion:^(BOOL finished)
{
// bottom right to bottom left
[UIView animateWithDuration:3.0f
animations:^{
[customView setFrame:CGRectMake(0, screen.size.height - customView.frame.size.height, 100, 100)];
}
completion:^(BOOL finished)
{
// bottom left to top left
[UIView animateWithDuration:3.0f
animations:^{
[customView setFrame:CGRectMake(0, 0, 100, 100)];
}
completion:^(BOOL finished)
{
// call the same function again.
[NSObject cancelPreviousPerformRequestsWithTarget:self selector:#selector(rotateViewInSelfBoundary) object:nil];
[self performSelector:#selector(rotateViewInSelfBoundary) withObject:nil afterDelay:0.0f];
}];
}];
}];
}];
}
Screen shots:
use UIViewAnimationOptionBeginFromCurrentState like
[UIView animateWithDuration:1.0f
delay:2.0f
options:UIViewAnimationOptionRepeat | UIViewAnimationOptionBeginFromCurrentState
animations:^{
//your animation
}
completion:nil];
If you want to move the view in a square, define the four CGPoint values it should animate between and then:
NSArray *values = #[[NSValue valueWithCGPoint:point0],
[NSValue valueWithCGPoint:point1],
[NSValue valueWithCGPoint:point2],
[NSValue valueWithCGPoint:point3],
[NSValue valueWithCGPoint:point0]];
CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:#"position"];
animation.values = values;
animation.duration = 5.0;
animation.repeatCount = HUGE_VALF;
[mover.layer addAnimation:animation forKey:#"moveAroundBorder"];
This will take care of all of the moving of the view with no further intervention on your part.
If you want to use the iOS 7 block-based key-frame animation, it would be:
[UIView animateWithDuration:5.0 delay:0.0 options:UIViewAnimationOptionCurveLinear animations:^{
[UIView animateKeyframesWithDuration:5.0 delay:0.0 options:UIViewKeyframeAnimationOptionRepeat | UIViewKeyframeAnimationOptionCalculationModeLinear animations:^{
[UIView addKeyframeWithRelativeStartTime:0.00 relativeDuration:0.25 animations:^{
mover.center = point0;
}];
[UIView addKeyframeWithRelativeStartTime:0.25 relativeDuration:0.25 animations:^{
mover.center = point1;
}];
[UIView addKeyframeWithRelativeStartTime:0.50 relativeDuration:0.25 animations:^{
mover.center = point2;
}];
[UIView addKeyframeWithRelativeStartTime:0.75 relativeDuration:0.25 animations:^{
mover.center = point3;
}];
} completion:nil];
} completion:nil];
Note the curious nesting of animateKeyframesWithDuration within the animateWithDuration. That's because the UIViewKeyframeAnimationOptionCalculationModeLinear curiously does not stop the "ease in / ease out" behavior, so you have to specify UIViewAnimationOptionCurveLinear on the outer animation block.
The question explains it all actually.
I load a custom UIView on top of my current view, animated, using this code:
- (void)showView
{
self.blurView.alpha = 0.f;
[UIView animateWithDuration:2.0 delay:0.0 options:UIViewAnimationOptionAllowUserInteraction animations:^
{
self.blurView.alpha = 1.f;
} completion:^(BOOL finished) {
[UIView animateWithDuration:2.0 delay:0.0 options:UIViewAnimationOptionAllowUserInteraction animations:^
{
self.blurView.alpha = 0.f;
} completion:nil];
}];
}
It works, but when I perform -(void)showView again while it is still animating, the custom view doesn't get removed from the screen.
It just stays like this:
I figured out what the problem was.
blurView is a public variable and every time I did -(void)showView it used the same variable, setting the alpha to 0.f just once, thus never changing the alpha of the first show.
I declared the variable blurView in the method itself and now it works because every blurView gets it's own pointer.
-(void)someMethod
{
//Create a live blur view
FXBlurView *blurView = [[FXBlurView alloc] initWithFrame:CGRectMake(0, 0, 200, 200)];
blurView.center = CGPointMake(self.view.window.frame.size.width / 2, self.view.window.frame.size.height / 2);
blurView.layer.cornerRadius = 20.f;
[self.view.window addSubview:blurView];
[self showView:(blurView)];
}
- (void)showView:(FXBlurView *)blurView
{
//Make full transparent before showing
blurView.alpha = 0.f;
//Start animation
[FXBlurView animateWithDuration:1.0 delay:0.0 options:UIViewAnimationOptionAllowUserInteraction animations:^
{
blurView.alpha = 1.f;
} completion:^(BOOL finished) {
if (finished)
{
//End animation
[FXBlurView animateWithDuration:1.0 delay:0.0 options:UIViewAnimationOptionAllowUserInteraction animations:^
{
blurView.alpha = 0.f;
} completion:nil];
}
}];
}
You should add to the top of your function this line:
[self.view.layer removeAllAnimations];
It will remove all of the active animations.
It doesn't work because you have implemented a delay, use animation block with delay - it will create animation keys that could be removed with this function above.
[UIView animateWithDuration:0.3 delay:0.0
options:UIViewAnimationOptionAllowUserInteraction
animations:^
{
// ...
} completion:NULL];
I want to add multiple animations to the view. I just can add one,... I do not want to concatenate
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:kAnimationDuration];
//self.square.bounds = CGRectMake(0, 0, self.square.bounds.size.height, 200);
//self.transform = CGAffineTransformMakeScale(2, 1);
CGAffineTransform scaleTrans1 = CGAffineTransformMakeScale(2, 1);
self.transform = scaleTrans1;
[UIView commitAnimations];
You can use animateWithDuration (in any of its variations) from UIView, as long as the properties you are trying to animate are actually animatable (view UIView / Animations).
For example:
[UIView animateWithDuration:1.0f
animations: ^ {
self.square.bounds = CGRectMake(0, 0, self.square.bounds.size.height, 200);
self.transform = CGAffineTransformMakeScale(2, 1);
}];
Hope it helps!
I did like this and its working
- (void)drawRect:(CGRect)rect
{
[UIView animateWithDuration:4.0f animations:^{
self.transform = CGAffineTransformMakeScale(2, 1);
} completion:^(BOOL finished){
[UIView animateWithDuration:4.0f animations:^{
self.transform = CGAffineTransformMakeScale(0.75, 1);
} completion:^(BOOL finished){
[UIView animateWithDuration:4.0f animations:^{
self.transform = CGAffineTransformMakeScale(2, 1);
} completion:^(BOOL finished) {
[UIView animateWithDuration:4.0f animations:^{
self.transform = CGAffineTransformMakeScale(0.75, 1);
}];
}];
}];
}];
}
Assuming a chain of block based animations like the following:
UIView * view = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 200, 200)];
//animation 1
[UIView animateWithDuration:2 delay:0 options:UIViewAnimationOptionCurveLinear animations:^{
view.frame = CGRectMake(0, 100, 200, 200);
} completion:^(BOOL finished){
//animation 2
[UIView animateWithDuration:2 delay:0 options: UIViewAnimationOptionRepeat |UIViewAnimationOptionAutoreverse animations:^{
[UIView setAnimationRepeatCount:1.5];
view.frame = CGRectMake(50, 100, 200, 200);
} completion:^(BOOL finished){
//animation 3
[UIView animateWithDuration:2 delay:0 options:0 animations:^{
view.frame = CGRectMake(50, 0, 200, 200);
} completion:nil];
}];
}];
What would be the best way to stop this kind of animation? Just calling
[view.layer removeAllAnimations];
is not enough, because that stops only the currently executing animation block and the rest will execute in sequence.
You can consult the finished BOOL passed in to your completion blocks. It will be NO in the case that you've called removeAllAnimations.
I use the following approach:
UIView * view = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 200, 200)];
//set the animating flag
animating = YES;
//animation 1
[UIView animateWithDuration:2 delay:0 options:UIViewAnimationOptionCurveLinear | UIViewAnimationOptionAllowUserInteraction animations:^{
view.frame = CGRectMake(0, 100, 200, 200);
} completion:^(BOOL finished){
//stops the chain
if(! finished) return;
//animation 2
[UIView animateWithDuration:2 delay:0 options: UIViewAnimationOptionRepeat |UIViewAnimationOptionAutoreverse | UIViewAnimationOptionAllowUserInteraction animations:^{
[UIView setAnimationRepeatCount:1.5];
view.frame = CGRectMake(50, 100, 200, 200);
} completion:^(BOOL finished){
//stops the chain
if(! finished) return;
//animation 3
[UIView animateWithDuration:2 delay:0 options:0 animations:^{
view.frame = CGRectMake(50, 0, 200, 200);
} completion:nil];
}];
}];
- (void)stop {
animating = NO;
[view.layer removeAllAnimations];
}
The removeAllAnimations message stops the animating block immediately and its completion block is called. The animating flag is checked there and the chain is stopped.
Is there a better way to do it?
I'm trying to instigate a page curl transition with a UIImageView in a Window. This code is in my main init method :
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:1.5];
[UIView setAnimationDelay:delay];
[UIView setAnimationBeginsFromCurrentState:YES];
[UIView setAnimationDidStopSelector:#selector(animCompleteHandler:finished:context:)];
[UIView setAnimationTransition:UIViewAnimationTransitionCurlUp forView:splashImage cache:YES];
splashImage.frame = CGRectMake(-320, 0, 10, 10);
//[splashImage removeFromSuperview];
[UIView commitAnimations];
The image animates position and size but no curl. If I uncomment the removeFromSuperView it just vanishes instantly. Any ideas?
UPDATE:
Have changed the code so it uses Lars fantasticlly neat way of triggering an animation and including the animation and callback ...
[UIView animateWithDuration:1.5
delay:delay
options: UIViewAnimationTransitionCurlUp
animations:^{splashImage.alpha = 0;}
completion:^(BOOL finished){[splashImage removeFromSuperview];}
];
Unfortunately the page curl just doesn't happen. It does fade though.
I'm not sure if this is something to do with the syntax or the fact that the SplashImage is a UIImageView class in the UIWindow object of my main view. Maybe it needs to be in a UIView to create the transition.
Try something like:
[UIView transitionWithView:splashImage
duration:1.5
options: UIViewAnimationOptionTransitionCurlUp
animations^{
splashImage.frame = CGRectMake(-320, 0, 10, 10);
}
completion:^(BOOL finished){
[splashImage removeFromSuperview];
//animCompleteHandlerCode..
}
];
Not tested and maybe some syntax errors but give it a try!
Or maybe this is better:
[UIView animateWithDuration:1.5
delay:delay
options: UIViewAnimationOptionTransitionCurlUp
animations^{
splashImage.frame = CGRectMake(-320, 0, 10, 10);
}
completion:^(BOOL finished){
[splashImage removeFromSuperview];
//animCompleteHandlerCode..
}
];
#Larsaronen: Thanks for the examples, it was exactly what I needed! I just wanted a simple page curl while images are first displayed, so I used an alpha of 1.0 instead of 0, and set the completion callback to nil:
// set a page curl animation for the specified UIImageView control
- (void) setAnimationPageCurl:(UIImageView *)imageView {
[UIView transitionWithView:imageView
duration:1.5
options:UIViewAnimationOptionTransitionCurlDown
animations:^ { imageView.alpha = 1.0; }
completion:nil];
}