Animation Grow/Decrease Size imageView iOS - ios

I'm trying to animate a custom button using CGAffineTransformMakeScale as follows:
if (stateButton == 0) { //The button is gonna appear
self.selected = YES;
self.imageView.transform = CGAffineTransformMakeScale(0.01, 0.01);
[UIView animateWithDuration:0.5 delay:0 options:UIViewAnimationOptionCurveEaseOut animations:^{
// animate it to the identity transform (100% scale)
self.imageView.transform = CGAffineTransformIdentity;
} completion:nil];
}
else if (stateButton ==1) { //The button is gonna disappear
self.imageView.transform = CGAffineTransformMakeScale(1, 1);
[UIView animateWithDuration:0.5 delay:0 options:UIViewAnimationOptionCurveEaseOut animations:^{
// decrease button
self.imageView.transform = CGAffineTransformMakeScale(.01, .01);
} completion:^(BOOL finished){
self.selected = NO;
}];
}
The button grows perfectly to the original size, however, i don't know the reason but when i click on the button to decrease it, it decreases from a size like 100% bigger than the original size to the original size, instead of beginning the decrease in the original size and achieve an scale of 0.01 as I indicated in the code.
Please help!!

You can animate the grow and decrease size of the image view using the following code
[UIView animateWithDuration:2.0 animations:^{
self.imageView.transform = CGAffineTransformMakeScale(0.5, 0.5);
}
completion:^(BOOL finished){
[UIView animateWithDuration:2.0 animations:^{
self.imageView.transform = CGAffineTransformMakeScale(1, 1);
}];
}];
This will make the imageview decrease in size initially and when animation is over it will get back to its original size with an animation.

SWIFT 3 Version
UIView.animate(withDuration: 2.0, animations: {() -> Void in
self.imageView?.transform = CGAffineTransform(scaleX: 0.5, y: 0.5)
}, completion: {(_ finished: Bool) -> Void in
UIView.animate(withDuration: 2.0, animations: {() -> Void in
self.imageView?.transform = CGAffineTransform(scaleX: 1, y: 1)
})
})

Related

animate UIImage in objective-c

I am trying to have my uiimageview move in a straight line horizontally out of bounds and loop again starting from the other side... this is the code I have in swift..
and was wondering if anyone knows how I can implement it in objective c?
let carSpeed = 20.0 / Double(view.frame.size.width)
let duration: NSTimeInterval = Double(view.frame.size.width - car.frame.origin.x) * carSpeed
UIView.animateWithDuration(duration, delay: 0.0, options: .CurveLinear, animations:
{
car.frame.origin.x = self.view.bounds.size.width
}, completion: {_ in
//reset cloud
car.frame.origin.x = -self.carImageView.frame.size.width
self.animateCars(car)
also if anyone knows any tutorials on objective C animations! thanks!
your can set the frame of image view first
UIImageView * imageView=[[UIImageView alloc]initWithFrame(x,y,width,height)];
Then set the frames in the following method
int moveValue=10 // add your desired value
[UIView animateWithDuration:0.25 animations:^{
imageView.frame=CGRectMake(x+moveValue,y,width,height);
} completion:nil];
This is your exact code converted to Objective-C:
double carSpeed = 20.0 / self.view.frame.size.width;
NSTimeInterval duration = (self.view.frame.size.width - car.frame.origin.x) * carSpeed;
[UIView animateWithDuration:duration
delay:0.0
options:UIViewAnimationOptionCurveLinear
animations:^{
car.frame = CGRectMake(self.view.bounds.size.width,
car.frame.origin.y,
car.frame.size.width,
car.frame.size.height);
}
completion:^(BOOL finished) {
if (finished) {
car.frame = CGRectMake(-self.carImageView.frame.size.width,
car.frame.origin.y,
car.frame.size.width,
car.frame.size.height);
[self animateCars:car];
}
}];

How to animate an UILabel from small to its original size?

Actually i am using RESlider in my app. In the menu table view there is a profile image and aside to it there is a notification label. Now i want is that when the user presses the hamburger menu the notification label(orange label with 999 number) should animate from a tiny dot to its original size. How to achieve this??
Put this in viewDidAppear
-(void)viewDidAppear:(BOOL)animated{
self.label.transform = CGAffineTransformMakeScale(0.01, 0.01);
[UIView animateWithDuration:0.5 animations:^{
self.label.transform = CGAffineTransformIdentity;
} completion:^(BOOL finished) {
}];
}
myTextLabel.transform = CGAffineTransformMakeScale(0.3, 0.3);
[UIView animateWithDuration:2.0
delay: 0.1
options: UIViewAnimationOptionBeginFromCurrentState
animations:^{
myTextLabel.transform = CGAffineTransformMakeScale(1.5, 1.5); //grow
}
completion:^(BOOL finished){
myTextLabel.transform = CGAffineTransformMakeScale(1, 1);
}];
Change the transform scale of your label, like this :
[UIView animateWithDuration:0.5
delay:0.0
options:UIViewAnimationOptionAutoreverse | UIViewAnimationOptionRepeat | UIViewAnimationOptionCurveEaseInOut
animations:^{
timerLabel.transform = CGAffineTransformScale(timerLabel.transform, 0.7, 0.7);
}
completion:nil];

how to add right to left animation and zoom in animation using CGAffineTransformScale

I am new to core graphics, I want to show a view from right to left animation using CGAffineTransformScale after completion of this animation I have apply zooming animation to same view.
I can show the right to left animation. But I am unable to show the zooming animation.
Can some one help me to solve the above problem.
Please find the below code what i tried.
toView.layer.anchorPoint = CGPointMake(1, 0.5);
toView.center = CGPointMake(toViewController.view.bounds.size.width,toViewController.view.bounds.size.height/2.0);
toView.transform = CGAffineTransformScale(CGAffineTransformIdentity, -1.0, 1.0);
[UIView animateWithDuration:ANIMATION_DURATION delay: 0.0 options: UIViewAnimationOptionTransitionFlipFromLeft animations:^{
[toView setTransform: CGAffineTransformMakeScale(1.0, 1.0)];
} completion:^(BOOL finished) {
}];
Your scale values are 1.0 that default value, change it to any other value other than 1.0, may be 1.2 to zoom-in, or 0.8 to zoom out.
And I think there should be few additions to your animation block.
[UIView animateWithDuration:ANIMATION_DURATION delay: 0.0 options: UIViewAnimationOptionTransitionFlipFromLeft animations:^{
[toView setTransform: CGAffineTransformMakeScale(1.2, 1.2)]; //Zoom in
} completion:^(BOOL finished) {
if(finished){
[UIView animateWithDuration:ANIMATION_DURATION animations:^{
toView.transform=CGAffineTransformIdentity; //Make things normal.
}];
}
}];
I hope it works.
Cheers.

Correctly Using CGAffineTransformMakeScale

I have a UIButton laid out using storyboard. The button just contains an image. When the button is clicked, I want to animate the size of the button - decrease in size and then bring it back to the original size again.
I used the following code -
[UIView animateWithDuration:2.0 animations:^{
_favButton.transform = CGAffineTransformMakeScale(0.5, 0.5);
}completion:^(BOOL finished) {
[UIView animateWithDuration:2.0 animations:^{
_favButton.transform = CGAffineTransformMakeScale(1, 1);
}];
}];
This code moves my button on the screen which I do not want. I want the center of the button to be fixed and the size be animated.
I have not used any Top Constraint in the storyboard for the button. How can I rectify this behaviour?
If you have auto layout turned on, you would need to turn it off.
But it doesn't seem to your problem here as per your description.
I would do the following to re-adjust to the center as it scales:
CGPoint cP = _favButton.center;
[UIView animateWithDuration:2.0 animations:^
{
_favButton.transform = CGAffineTransformMakeScale(0.5, 0.5);
_favButton.layer.position = cp;
}
completion:^(BOOL finished)
{
[UIView animateWithDuration:2.0 animations:^
{
_favButton.transform = CGAffineTransformMakeScale(1, 1);
_favButton.layer.position = cp;
}];
}];
Hope this helps.
SWIFT 3
button.transform = CGAffineTransform(scaleX: 0.1, y: 0.1)

CATransform3DRotate effects gone after applying anchor point

EDIT with correct observation.
I used the following two snippets to rotate an UIImageView. After the stage1, I got the desired 3D effect: the view rotate (3D effect) and stretched out (larger size). On stage2, I am trying to swing the rightView with the hinge on the right.
If I applied the line that changes the anchor point, the view swings correctly (hinge on right) with one major issue: The view's size got restored back to original size (smaller) while the (rotation) 3D effect is still intact and then the swinging occurs.
Any suggestions?
rightView.layer.anchorPoint = CGPointMake(1.0, 0.5);
-(void)stage1
{
[UIView animateWithDuration:1.5 animations:^{
rightView.transform = CGAffineTransformMakeTranslation(0,0); //rightView i UIImageView
CATransform3D _3Dt = CATransform3DIdentity;
_3Dt =CATransform3DMakeRotation(3.141f/42.0f,0.0f,-1.0f,0.0f);
_3Dt.m34 = -0.001f;
_3Dt.m14 = -0.0015f;
rightView.layer.transform = _3Dt;
} completion:^(BOOL finished){
if (finished) {
NSLog(#"finished..");
}
}];
}
-(void)Stage2
{
rightView.layer.anchorPoint = CGPointMake(1.0, 0.5); //issue?
rightView.center = CGPointMake(1012, 384);
[UIView animateWithDuration:1.75 animations:^{
CATransform3D rightTransform = rightView.layer.transform;
rightTransform.m34 = 1.0f/500;
rightTransform = CATransform3DRotate(rightTransform, M_PI_2, 0, 1, 0);
rightView.layer.transform = rightTransform;
} completion:^(BOOL finished) {
}];
}
You need to add the "options" to your animate with duration and add options:UIViewAnimationOptionBeginFromCurrentState
Otherwise it starts from the beginning again.
So your stage 2 would look like this:
-(void)Stage2
{
rightView.layer.anchorPoint = CGPointMake(1.0, 0.5); //issue?
rightView.center = CGPointMake(1012, 384);
[UIView animateWithDuration:1.75
delay:0.00
options:UIViewAnimationOptionBeginFromCurrentState
animations:^{
CATransform3D rightTransform = rightView.layer.transform;
rightTransform.m34 = 1.0f/500;
rightTransform = CATransform3DRotate(rightTransform, M_PI_2, 0, 1, 0);
rightView.layer.transform = rightTransform;
} completion:^(BOOL finished) {
}];
}

Resources