I am doing a scale and translate animation using the code below. This moves an image from bottom left to center of screen. Next time when I do animation I want to restart from bottom left. But the animation doesn't start. What do I need to restart the animation ?
// Setup the animation
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:duration];
[UIView setAnimationCurve:curve];
[UIView setAnimationBeginsFromCurrentState:YES];
// The transform matrix
CGAffineTransform transform = CGAffineTransformMakeTranslation(x, y);
CGAffineTransform scale = CGAffineTransformMakeScale(2.0,2.0);
CGAffineTransform scale_transform = CGAffineTransformConcat(transform,scale);
image.transform = scale_transform;
[UIView commitAnimations];
I found out. This is what solved it.
image.transform = CGAffineTransformIdentity
Related
I am animating a tree that grows. Like a Tree, I want my UIImage to stay in the same place, so that when I scale it up it appears to grow.
Right now its jumping around, i.e. its growing from the centre - I need it to grow from the bottom.
Is there a way to set the origin/base of the animation. So the scale animation works from the bottom.
Hope that makes sense. here is my code:
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:1];
[UIView setAnimationCurve:UIViewAnimationCurveLinear];
tree.transform = CGAffineTransformMakeScale(1.0f, 1.25f);
[UIView commitAnimations];
You may wish to look at the CALayer class for this and set the anchorPoint to the centerbottom
- (void)viewDidLayoutSubviews
{
self.outletTestView.layer.anchorPoint = CGPointMake(0.5, 1.0);
self.outletTestView.layer.position = CGPointMake(100, 300);
}
Don't forget to include:
#import <QuartzCore/QuartzCore.h>
And use for the scaling:
CGAffineTransform CGAffineTransformScale ( CGAffineTransform t, CGFloat sx, CGFloat sy );
Like so:
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:1];
[UIView setAnimationCurve:UIViewAnimationCurveLinear];
tree.transform = CGAffineTransformScale(tree.transform, 1.0f, 1.25f);
[UIView commitAnimations];
I walked over other same question but it didn't help.
I have an image that should rotate every doubleTap by 90 degrees
This is the rotation function
-(void) rotateImageWithAngle:(float)angle1
{
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:0.2];
[UIView setAnimationBeginsFromCurrentState:YES];
CGAffineTransform transform;
transform = CGAffineTransformMakeRotation(DEGREES_TO_RADIANS(angle1));
self.transform = transform;
[UIView commitAnimations];
}
angel1 is always 90.
The problem is that it rotates only once, every additional doubleTap goes to the function but does nothing.
Thanks
You're applying the same transform every time. You should change the angle by 90 degrees with each double tap.
I want to create an animation that moves and rotates a UIView at the same time. I tried the following code:
[UIView beginAnimations:#"MoveAndRotateAnimation" context:nil];
[UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
[UIView setAnimationDuration:kAnimationDuration];
myView.frame = newFrame;
myView.transform = CGAffineTransformMakeRotation(0.4);
[UIView commitAnimations];
The result is, that after the animation has finished the view is drawn incorrectly (some parts are not visible anymore). If I only change the frame OR the transformation for the animation, the view draws correctly. The problem only occurs if I set both the frame and transformation.
What would be the correct way to animate moving and rotating of a view at the same time?
You can't use frame, bounds, or center if you are also animating things like rotation. You need to use CGAffineTransforms for everything and concatenate them together. Like so:
CGAffineTransform transform = CGAffineTransformMakeTranslation(100,100);
transform = CGAffineTransformRotate(transform, 0.4);
[UIView beginAnimations:#"MoveAndRotateAnimation" context:nil];
[UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
[UIView setAnimationDuration:kAnimationDuration];
myView.transform = transform;
[UIView commitAnimations];
Try doing it this way: (Moving left and rotating, just for example)
[UIView beginAnimations:#"MoveAndRotateAnimation" context:NULL];
[UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
[UIView setAnimationDuration:kAnimationDuration];
CGPoint center = CGPointMake(-200, self.view.center.y);
self.view.transform = CGAffineTransformMakeRotation(-0.5);
self.view.center = center;
[UIView commitAnimations];
The center point locations would be the point you wish to make the view move, of course.
The problem is probably with your new frame size as compared to original frame size. View frame is a bit tricky when you rotate a frame:
Frame is in superviews coordinate system. So, when you rotate a rectangle, the new frame will be the smallest rectangle in superview's coordinate system which contains the view.
e.g. if you have a square view with frame size of (100*100) and rotate it by 45 degrees your new frame would have a size of (141*141) and if you set the frame to have a size of (100*100) you'll cut part of your view.
Look at here for better understanding of how view frame works.
You need to do this:
#pragma mark (Woblling animation)
CGAffineTransform leftWobble = CGAffineTransformRotate(CGAffineTransformIdentity, RADIANS(-10.0));
CGAffineTransform rightWobble = CGAffineTransformRotate(CGAffineTransformIdentity, RADIANS(10.0));
self.view .transform = leftWobble; // starting point
[UIView beginAnimations:#"wobble" context:self.view ];
[UIView setAnimationRepeatAutoreverses:YES]; // important
[UIView setAnimationRepeatCount:11];
[UIView setAnimationDuration:1.00];
//[UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight forView:self.view cache:YES];
[UIView setAnimationDelegate:self];
[UIView setAnimationDidStopSelector:#selector(wobbleEnded:finished:context:)];//should be same as written
self.view .transform = rightWobble; // end here & auto-reverse
[UIView commitAnimations];
and then implement these methods. They are necessary to keep your view in the same position after rotation.
- (void) wobbleEnded:(NSString *)animationID finished:(NSNumber *)finished context:(void *)context
{
if ([finished boolValue]) {
UIView* item = (UIView *)context;
item.transform = CGAffineTransformIdentity;
}
}
Use this method if you are using navigation and when you navigate from one view to another, then your view would be at the same place.else leave this method:
- (void)viewWillAppear:(BOOL)animated
{
UIView* item = self.view;
item.transform = CGAffineTransformIdentity;
}
I had the same problem but did some experiments and came up with this solution.
i like to animate my image "finga" not centered but from left or right:
[UIView beginAnimations:nil context:nil];
[UIView setAnimationRepeatCount:1];
finga.transform = CGAffineTransformMakeScale(2,1.5);
finga.animationDuration = 2;
[UIView commitAnimations];
If I understand your question, you need to move the finga view off screen left or right (set the frame) prior to doing your animation.
I want it to be animated so I'm using [UIView beginAnimations]
I've tried animating using button.imageView.frame (with image set as imageView) but it only animates the position, the image doesn't get scaled down at all.
using hateButton.frame (when image is set as backgroundImage), the backgroundImage gets scaled down but it's not animated.
How do I animate-scale a UIButton image?
You can call layoutIfNeeded between [UIView beginAnimations] and [UIView commintAnimations] or with [UIView animateWithDuration].
[UIView animateWithDuration:0.3f animations:^{
self.myButton.frame = aFrame;
[self.myButton layoutIfNeeded];
}];
I could achieve this using Quartz 2D:
// move anchor point without moving frame
CGRect oldFrame = hateButton.frame;
hateButton.layer.anchorPoint = CGPointMake(0, 1); // bottom left
hateButton.frame = oldFrame;
[UIView beginAnimations:nil context:NULL];
CGAffineTransform newTransform;
newTransform = CGAffineTransformMakeScale(0.8, 0.8);
hateButton.transform = CGAffineTransformTranslate(newTransform, 0, -160);
[UIView commitAnimations];
Make sure you import Quartz2D too:
#import <QuartzCore/QuartzCore.h>