I want to transit from UIView to another in the UIViewController when I press a button
I write this code:
- (IBAction)changeView:(id)sender {
CATransition* transition = [CATransition animation];
transition.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseIn];
transition.duration = 1.0f;
transition.type = #"cube";
transition.subtype = #"fromTop";
[self.view1.layer removeAllAnimations];
[self.view1.layer addAnimation:transition forKey:kCATransition];
}
this code will transit the view1(UIview) to itself. how can I make it to transit to another UIView (e.g. view2). also where can I put the another UIview (view2) in the storyboard
Have you try like this?
self.view1.alpha = 0.0;
[UIView beginAnimations:#"flip" context:nil];
[UIView setAnimationDelegate:self];
[UIView setAnimationDidStopSelector:#selector(animationDidStop:finished:context:)];
[UIView setAnimationDuration:1.0f];
self.view2.alpha = 1.0;
[UIView commitAnimations];
Have a look at this code snippet it's much more elegant. Also checkout Apple's documentation for more fancy UIViewAnimationOptions
- (IBAction)changeView:(id)sender
{
[UIView animateWithDuration:1.0 delay:0.0 options:UIViewAnimationOptionTransitionFlipFromLeft animations:^{
//Remove View-1 from the main view
[view1 removeFromSuperView];
//Add the new view to your current view
[self.view addSubView:view2];
} completion:^(BOOL finished) {
//Once animation is complete
}];
}
Ensure that the two views are a strong property of your view controller.
If you have two UIView for example take firstView and secondView and add it to UIViewController on same rect. and set hiddden property to secondView.
-(IBAction)flipFirstViewToSecondView{
secondView.hidden= NO;
[UIView transitionWithView:firstView duration:1.0f options:UIViewAnimationOptionTransitionFlipFromLeft animations:^{
[UIView transitionWithView:secondView duration:1.0f options:UIViewAnimationOptionTransitionFlipFromLeft animations:^{
} completion:^(BOOL finished) {
secondView.hidden = NO;
firstView.hidden = YES;
}];
} completion:^(BOOL finished) {
}];
}
Thanks. just let me know if you have any problem to integrate it.
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 know its mad but here it goes:
i load a splashView to my app: on viewDidLoad:
[self.view addSubview:splashView];
UIViewAnimationOptions options = UIViewAnimationOptionCurveLinear;
[UIView animateWithDuration:0.5 delay:3.0 options:options animations:^{
splashView.alpha = 0.0f;
splashView.frame = CGRectMake(512,384,-10,-10);
}
completion:^(BOOL finished){
[splashView removeFromSuperview];
}];
Nothing special to the code here.
however, when i try to load the same view as an action through a button
NOTHING happens:
-(IBAction)showSplash:(id)sender {
[self.view addSubview:splashView];
UIViewAnimationOptions options = UIViewAnimationOptionCurveLinear;
[UIView animateWithDuration:0.5 delay:3.0 options:options animations:^{
splashView.alpha = 0.0f;
splashView.frame = CGRectMake(512,384,-10,-10);
}
completion:^(BOOL finished){
[splashView removeFromSuperview];
}];
}
why is this happening?
By the way if i DO NOT load the splashView on the viewDidLoad and then use the button (action) it works ok!
is this normal behavior?
Reset the alpha value before fading the splash view out.
splashView.alpha = 1.0f;
I have an UIImageView that I want to fade in.
Is there a way to enable that on an underlying UIViewController?
I have translated the simplest answer, though they all work, C# .NET for the MonoTouch users:
public override void ViewDidAppear (bool animated)
{
base.ViewDidAppear (animated);
UIView.BeginAnimations ("fade in");
UIView.SetAnimationDuration (1);
imageView.Alpha = 1;
UIView.CommitAnimations ();
}
Initially set the alpha of your imageview as 0 as imageView.alpha = 0;
- (void)fadeInImage
{
[UIView beginAnimations:#"fade in" context:nil];
[UIView setAnimationDuration:1.0];
imageView.alpha = 1.0;
[UIView commitAnimations];
}
Change the animation duration to what ever length you want.
UIImageView *myImageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"myImage.png"]];
myImageView.center = CGPointMake(100, 100);
myImageView.alpha = 0.0;
[self.view addSubview:myImageView];
[UIView animateWithDuration:5.0 animations:^{
myImageView.alpha = 1.0;
}];
this simple code:
[UIView animateWithDuration:5.0 animations:^{
theImage.alpha = 1.0;
}];
the UIImage is in the view and is connected via an IBOutlet
you can also, set the alpha from the utility panel.
Use below in your UIViewController
// add the image view
[self.view addSubview:myImageView];
// set up a transition animation
CATransition *animate = [CATransition animation];
[animate setDuration:self.animationDelay];
[animate setType:kCATransitionPush];
[animate setSubtype:kCATransitionFade];
[animate setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]];
[[self layer] addAnimation:animate forKey:#"fade in"];
I would use UIView's +transitionWithView:duration:options:animations:completion:
It is very efficient and powerful.
[UIView transitionWithView:imgView duration:1 options:UIViewAnimationOptionTransitionCrossDissolve animations:^{
imgView.image = [UIImage imageNamed:#"MyImage"];
} completion:nil];
You can use this code:
Fade In Animation:
self.yourComponent.alpha = 0.0f;
[UIView beginAnimations:#"fadeIn" context:nil];
[UIView setAnimationDuration:1.0]; // Time in seconds
self.yourComponent.alpha = 1.0f;
Fade Out Animation:
self.yourComponent.alpha = 1.0f;
[UIView beginAnimations:#"fadeOut" context:nil];
[UIView setAnimationDuration:1.0]; // Time in seconds
self.yourComponent.alpha = 0.0f;
self.yourComponent can be a UIView, UIImageView, UIButton or any other component.
Swift version
func fadeIn(){
UIView.beginAnimations("fade in", context: nil);
UIView.setAnimationDuration(1.0);
imageView.alpha = 1.0;
UIView.commitAnimations();
}
I have an app which has a start screen with a start button on it. If you tap that button the view changes and a new view appears, let's call that main view.
The way I implemented it is one view controller per view. Now that I want to add transition animations this implementation causes problems. For example, I want to use the following code:
[UIView transitionFromView:startView toView: mainView duration: 2.0
options: UIViewAnimationOptionTransitionCurlDown completion: NULL];
But this doesn't do anything. Reading the documentation suggests that this only works if the view controller doesn't change. The documentation doesn't have any examples of a curl down transition where the view controllers change so I'm not sure what to do.
When I started writing the app I read the guidelines and they suggested that having one view controller per view is the correct way of doing what I'm doing.
Now what is the correct way to implement a view transition when the view controller changes too? Many thanks for your help!
Edit: I am looking for a solution where the first view controller is destroyed.
It was proposed that you effectively create a view controller, use its view, but then disregard the controller itself. This is not advised. In iOS you want to keep your view controller hierarchy synchronized with your view hierarchy. Any techniques like the one proposed are therefore problematic. (WWDC 2011 session 102, while on a different topic, view controller containment, has a lengthy discussion of the importance of keeping these two hierarchies synchronized.)
The most obvious problem is that certain events, notably rotation events, are not going to transmitted successfully to your new controller and you can get some very strange results. It's also not clear with your code above what happens with the old view that you removed, how you would transition back, how you'd clean up the now unnecessary game controller, what would happen on didReceiveMemoryWarning if you were in the game controller, etc. This just seems to introduce a ton a problems.
The easiest solution is apply standard pushViewController and/or presentViewController calls to go from one view to another, and just animate those transitions. If you have questions about either of those methods, or how to animate within the context of those methods, let me know.
By the way, the root of your question was how to transition between view controllers. Here is a old collection of transitions (some for push transitions, some for modal transition) that I was once playing around with. Maybe there's something here that you could use?
- (void)transitionToNewController
{
MyViewController *controller = [[MyViewController alloc] initWithNibName:#"MyView" bundle:nil];
#if TRANSITIONTYPE == 1
// pushViewController with push/slide from right via CATransition
CATransition* transition = [CATransition animation];
transition.duration = 0.3;
transition.type = kCATransitionPush;
transition.subtype = kCATransitionFromRight;
[self.navigationController.view.layer addAnimation:transition forKey:kCATransition];
[self.navigationController pushViewController:controller animated:NO];
#endif
#if TRANSITIONTYPE == 2
// pushViewController with flip using UIView begin/commitAnimations
[UIView beginAnimations:nil context:nil];
[UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
[UIView setAnimationDuration:0.75];
[self.navigationController pushViewController:controller animated:NO];
[UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight forView:self.navigationController.view cache:NO];
[UIView commitAnimations];
#endif
#if TRANSITIONTYPE == 3
// pushViewController with flip using animation block
[UIView animateWithDuration:0.5
animations:^{
[UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
[self.navigationController pushViewController:controller animated:NO];
[UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight forView:self.navigationController.view cache:NO];
}
completion:nil];
#endif
#if TRANSITIONTYPE == 4
// pushViewController with fade via CATransition
CATransition* transition = [CATransition animation];
transition.duration = 0.5;
transition.type = kCATransitionFade;
[self.navigationController.view.layer addAnimation:transition forKey:kCATransition];
[self.navigationController pushViewController:controller animated:NO];
#endif
#if TRANSITIONTYPE == 5
// pushViewController with fade via animation block
controller.view.alpha = 0.0f;
[UIView animateWithDuration:0.5
animations:^{
self.view.alpha = 0.0f;
controller.view.alpha = 1.0f;
}
completion:^(BOOL finished){
[self.navigationController pushViewController:controller animated:NO];
self.view.alpha = 1.0f; // reset the src alpha so it's there when you pop your view controller off
}];
#endif
#if TRANSITIONTYPE == 6
// pushViewController Flip using UIView begin/commitAnimations
[UIView beginAnimations:nil context:nil];
[UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
[UIView setAnimationDuration:0.75];
[self.navigationController pushViewController:controller animated:NO];
[UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight forView:[self.self navigationController].view cache:NO];
[UIView commitAnimations];
#endif
#if TRANSITIONTYPE == 7
// pushViewController animation using CGAffine scale to look like we're zooming into the new view
[self.view addSubview:controller.view];
[controller.view setFrame:self.view.window.frame];
[controller.view setTransform:CGAffineTransformMakeScale(0.5,0.5)];
[controller.view setAlpha:1.0];
[UIView animateWithDuration:0.5
delay:0.0
options:UIViewAnimationCurveEaseOut
animations:^{
[controller.view setTransform:CGAffineTransformMakeScale(1.0,1.0)];
[controller.view setAlpha:1.0];
}
completion:^(BOOL finished){
[controller.view removeFromSuperview];
[self.navigationController pushViewController:controller animated:NO];
}];
#endif
#if TRANSITIONTYPE == 8
// presentViewController animation with slide from right by using CGAffineTransform
self.view.transform = CGAffineTransformMakeTranslation(0, 0);
controller.view.transform = CGAffineTransformMakeTranslation(self.view.frame.size.width, 0);
[self.view addSubview:controller.view];
[UIView animateWithDuration:4.0
animations:^{
// [self presentViewController:controller animated:NO completion:nil];
self.view.transform = CGAffineTransformMakeTranslation(self.view.frame.size.width, 0);
controller.view.transform = CGAffineTransformMakeTranslation(0, 0);
}
completion:^(BOOL finished){
[controller.view removeFromSuperview];
[self presentViewController:controller animated:NO completion:nil];
}
];
#endif
#if TRANSITIONTYPE == 9
// presentViewController animation with slide from right by just animating frames
float width = self.navigationController.view.frame.size.width;
CGPoint right = controller.view.center;
right.x += width;
controller.view.center = right;
[self.navigationController.view addSubview:controller.view];
[UIView animateWithDuration:0.5
animations:^{
CGPoint left = self.navigationController.view.center;
left.x -= width;
self.navigationController.view.center = left;
}
completion:^(BOOL finished){
[controller.view removeFromSuperview];
[self presentViewController:controller animated:NO completion:nil];
}
];
#endif
#if TRANSITIONTYPE == 10
// presentViewController animation with flipfromright
[UIView animateWithDuration:4.0
delay:0.0
options:UIViewAnimationOptionTransitionFlipFromRight
animations:^{
[self.view addSubview:controller.view];
}
completion:^(BOOL finished){
[controller.view removeFromSuperview];
[self presentViewController:controller animated:NO completion:nil];
}];
#endif
#if TRANSITIONTYPE == 11
// presentViewController with flip using UIView begin/commitAnimations
[UIView beginAnimations:nil context:nil];
[UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
[UIView setAnimationDuration:0.75];
[self presentViewController:controller animated:NO completion:nil];
[UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight forView:self.view cache:NO];
[UIView commitAnimations];
#endif
#if TRANSITIONTYPE == 13
// pushViewController with flip using animation block with transitionWithView
controller.view.frame = self.view.window.frame;
[UIView transitionWithView:self.view.superview
duration:1.0
options:UIViewAnimationTransitionFlipFromRight
animations:^{
[UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
[self.view.superview addSubview:controller.view];
[UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight forView:self.navigationController.view cache:NO];
}
completion:^(BOOL finished){
[self.navigationController pushViewController:controller
animated:NO];
}];
#endif
}
Okey-doke, I found a neat way to achieve exactly what I want. This code, added in the method where I exchange the old view controller and view with the new one, works great:
GameViewController *game = [[GameViewController alloc] init];
UIView *currentView = [currentViewController view];
// remove the current view and replace with myView1
[currentView removeFromSuperview];
// set up an animation for the transition between the views
CATransition *animation = [CATransition animation];
[animation setDuration:0.5];
[animation setType:kCATransitionPush];
[animation setSubtype:kCATransitionFromBottom];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]];
[[window layer] addAnimation:animation forKey:#"SwitchToView1"];
[self setCurrentViewController: game];
[window addSubview:[currentViewController view]];
[game release];
Many thanks to HERE!!