Tag Archives: animation

How to perform animated rotation of a view using core graphics?

Posted on by
1

This post deals with rotating a view with animation with the help of core graphics. Quartz framework provides us with class “CGAffineTransform.h” which contains the function “CGAffineTransform CGAffineTransformRotate ( CGAffineTransform t, CGFloat angle );” that takes the current affine transform matrix and angle in radians as parameters, and returns the resultant affine transform. We will also animate the rotation instead of simply rotating the view by some angle.

Now lets see how it is done.

Suppose we have a view controller class called RotationViewController.

Write the following code in RotationViewController.h” file

 

#import <UIKit/UIKit.h>

@interface RotationViewController : UIViewController {
	UIImageView *needleview;
	}

@end

Here needleview is the view we are going to rotate.

Now come to RotationViewController.m file and write the following code

 

- (void)viewDidLoad {
	needleview=[[UIImageView alloc] initWithImage:[UIImage imageNamed:@"finalneedle.png"]];
	needleview.frame=CGRectMake(100, 100, 36, 221);
	[self.view addSubview:needleview];
    [super viewDidLoad];
}

-(void)viewDidAppear:(BOOL)animated
{
	[UIView animateWithDuration:2.0

	 delay: 0.0

	options: UIViewAnimationOptionCurveEaseIn

	animations:^{

	needleview.transform=CGAffineTransformRotate(needleview.transform, (((60*22)/7)/180));

	 }
	 completion:nil];

}

In the above code “finalneedle.png” is the image file, in the resources folder, to be used in ImageView. We have implemented “viewDidAppear” to perform rotation with animation after the view appears on screen. The animation block inside the method contains various parameter which has to be set before animating the rotation. The angle of rotation is 60 degree which is converted to radians.

How to animate switching of views?

Posted on by
Reply

This snippet deals with animating switching of views.

 

Normally when users have to switch views they simply add the following code

[self.view addSubview:someview];

and to remove this view from superview they use

[self.view removeFromSuperview];

The above code do not perform any animations while switching views. They simply switch.

Adding few lines of code can make switching of views more interesting.

While you add or remove views just do it inside following code to add life to the switching of views.

 

[UIView beginAnimations:@"flipping view" context:nil];
[UIView setAnimationDuration:1];
[UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
[UIView setAnimationTransition:UIViewAnimationTransitionFlipFromLeft forView:self.view cache:YES];
[self.view addSubview:someViewController.view];
[UIView commitAnimations];

Now lets see what these lines of code do.

1) begin Animations: start our animation block. You can give any name in place of @”flipping view”.

2) setAnimationDuration: sets the duration for which the animation will last.

3) setAnimationCurve: sets the curve of animating property changes with in an animation. You can use following constants in this place

➤    UIViewAnimationCurveEaseInOut —cause the animation to begin slowly, accelerate through the middle of its duration, and then slow again before completing.

➤    UIViewAnimationCurveEaseIn — causes the animation to begin slowly and then speed up as it progresses

➤    UIViewAnimationCurveEaseOut — causes the animation to begin quickly and then slow as it completes

➤    UIViewAnimationCurveLinear — causes an animation to occur evenly over its duration

4) setAnimationTransition: applies a transition type to the animation. Following constants can be used.

➤ UIViewAnimationTransitionNone — no transition

➤ UIViewAnimationTransitionFlipFromLeft — flips a view around vertical axis from left to right

➤ UIViewAnimationTransitionFlipFromRight — flips a view around a vertical axis from right to left

➤ UIViewAnimationTransitionCurlUp — curls a view up from the bottom

➤UIViewAnimationTransitionCurlDown — curls a view down from the top

5) addSubView: is the usual method by which you add a subview to a view. Here someViewController is a class object whose view we want to add.

6) In the end we commit our animation block.