I can animate the addition of a UIView to my app, it looks very pretty so thank you apple.
However, how do I animate the removal of this view from the super view?
I'm using:
CATransition *animation = [CATransition animation];
[animation setDuration:1];
[animation setType:kCATransitionReveal];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseIn]];
[[myview layer] addAnimation:animation forKey:kCATransitionReveal];
to animate the "in" transition ... how do you animate the "out" transition????
Animate your view so it moves offscreen/shrinks/expands/fades, then do the actual removal when the animation ends.
You can do this by altering the properties of the view (position/size/offset) between a beginAnimations/commitAnimations block. UIKit will then animate these properties over the time specified.
E.g something like;
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:0.30f];
view.transform =
CGAffineTransformMakeTranslation(
view.frame.origin.x,
480.0f + (view.frame.size.height/2) // move the whole view offscreen
);
background.alpha = 0; // also fade to transparent
[UIView commitAnimations];
In the animation end notification you can then remove the view.
Related
I have an application in which I need to
add a subview to a view with presentmodalview type animation
But in
CATransition
I didn't find any type of transition like that. Also in
UItransitionstyle
Can anybody guide me on this?
If you only want to use CATransition
CATransition *animation = [CATransition animation];
[animation setType:kCATransitionMoveIn];
[animation setSubtype:kCATransitionFromTop];
[animation setDuration:0.6f];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:
kCAMediaTimingFunctionEaseInEaseOut]];
[subview.layer addAnimation:animation forKey:#"someTransition"];
Change the frame of the subview insite the UIView Animation, like as follows,
initially set the
subView.frame=CGRectMake(0,self.view.frame.size.height,your_width,your_height);
then set the required frame position inside the animation
[UIView animateWithDuration:0.25 delay:0 options: UIViewAnimationCurveEaseOut animations:^ {
// set subView's frame
} completion:^(BOOL finished) {
}
];
Try this code
[self.view bringSubviewToFront:yoursubview];
CATransition *animation = [CATransition animation];
[animation setType:kCATransitionFade];
[animation setDuration:1.00];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:
kCAMediaTimingFunctionEaseIn]];
[yoursubview.layer addAnimation:animation forKey:#"fadeTransition"];
For more info check these links
Code on GitHub
Implement Changes Between Two Views In iPhone
add subview with animation
Try to use UIView animation block:
yourView.frame = CGRectMake(0, yourSuperView.frame.size.height, yourView.frame.size.width, yourView.frame.size.height);
[yourSuperView addSubview:yourView];
[UIView animateWithDuration:1.0 animations:^{
yourView.frame = CGRectMake(0, 0, yourView.frame.size.width, yourView.frame.size.height);
} completion:^(BOOL finished) {
//Task to do on Animation completion.
}];
You change the animation duration according to your convince. Also you can use following:
[UIView animateWithDuration:1.0 animations: {
//your Implemntation
}];
or
[UIView animateWithDuration:1.0 delay:0 options:UIViewAnimationCurveEaseIn animations:^{
} completion:^(BOOL finished) {
}];
Please check the UIView class reference for animation option in UIViewAnimationOptions section and detail of methods.
I can see a lot of transition animation: from left to right, right to left, fading, but how can I make transition from the top down to bottom?
Thanks for all help
Try working out this...
Add QuartzCore framework
#import <QuartzCore/QuartzCore.h>
CATransition *transDown=[CATransition animation];
[transDown setDuration:0.5];
[transDown setType:kCATransitionPush];
[transDown setSubtype:kCATransitionFromBottom];
[transDown setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]];
[Boottom_view.layer addAnimation:transDown forKey:nil];
[[self navigationController] presentModalViewController:modalViewController animated:YES];
and hiding it like this:
[self.navigationController dismissModalViewControllerAnimated:YES];
Your could use Core Animation, what sort of object are you using?
Basically, to fade in an object you do this:
[[objectName animator] setOpacity: 1];
Remember you first need to set the opacity to 0 etc. before the animation begins.
Hope this is what your wanting.
You set your view frame to it's starting position offscreen and then your bring your frame into position with some animation.
CGRect originalFrame = [detailsView frame];
CGRect offscreenFrame = originalFrame;
offscreenFrame.origin.y -= offscreenFrame.size.height;
detailsView.frame = offscreenFrame; //Send the frame above screen
//Add view here if necessary to an unscrew view
// [aSuperView addSubview:detailsView];
[UIView beginAnimations:#"BringIn" context:nil];
[UIView setAnimationDuration:.3];
[UIView setAnimationDelegate:self];
[UIView setAnimationCurve:UIViewAnimationCurveEaseIn];
detailsView.frame = originalFrame
[UIView commitAnimations];
I have my main view, and when a user taps a 'Show' button I want two things to happen:
Fade in a black UIView with alpha 0.5 covering the entire parent
view. I'll refer to this as darkenBackground
Slide the view of a second view controller
(self.secondViewController.view) on top of darkenBackground
When a user is finished, they tap 'Done' and the following happens:
darkenBackground fades out and is removed from the superview.
self.secondViewController.view slides out of the screen in the
bottom direction and is removed from the superview.
All animations working simultaneously.
So far, I've been able to achieve the first part (sort-of), transition-in. This works fine. But when the user taps 'Done' the transition-out does not work as required. The problems I'm faced with are:
darkenBackground and self.secondViewController.view fade out and are removed, but
self.secondViewController.view wasn't supposed to fade out! I tried animating only the second view but it simply disappears without animation.
When a user taps 'Show' for a second time
(transition-in), the view from the previous transition
appears before the animation takes place. It doesn't look like it
was removed from the superview previously.
Here is my code:
When a user taps 'Show':
- (IBAction)showSecondView {
darkenBackground = [[UIView alloc]initWithFrame:CGRectMake(0, 0, 320, 460)];
[darkenBackground setBackgroundColor:[UIColor blackColor]];
[darkenBackground setAlpha:0.5];
self.secondViewController.view.frame = CGRectMake(0, 0, 320, 460);
self.secondViewController.view.backgroundColor = [UIColor clearColor];
[CATransaction begin];
CATransition *animation = [CATransition animation];
[animation setDuration:0.5];
[animation setType:kCATransitionFade];
CATransition *animation2 = [CATransition animation];
[animation2 setDuration:0.5];
[animation2 setType:kCATransitionMoveIn];
[animation2 setSubtype:kCATransitionFromTop];
[animation2 setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]];
[self.view addSubview:darkenBackground];
[self.view addSubview:self.secondViewController.view];
[[self.view layer] addAnimation:animation forKey:#"darkenBkgFadeIn"];
[[self.secondViewController.view layer] addAnimation:animation2 forKey:#"ShowSecondView"];
[CATransaction commit];
}
When a user taps 'Done' (A function defined in the secondViewController.m class where it refers to the main view controller variables through delegate):
- (IBAction)hideSecondView {
[CATransaction begin];
CATransition *animation = [CATransition animation];
[animation setDuration:0.5];
[animation setType:kCATransitionFade];
CATransition *animation2 = [CATransition animation];
[animation2 setDuration:0.5];
[animation2 setType:kCATransitionPush];
[animation2 setSubtype:kCATransitionFromBottom];
[animation2 setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]];
[self.myParentController.darkenBackground removeFromSuperview];
[self.myParentController.secondViewController.view removeFromSuperview];
[[self.myParentController.view layer] addAnimation:animation forKey:#"darkenBkgFadeOut"];
[[self.myParentController.secondViewController.view layer] addAnimation:animation2 forKey:#"RemoveSecondView"];
[CATransaction commit];
}
Ultimately I want to show the view in the same way that the TWTweetComposeViewController modal view appears, where the background darkens and the controller appears. I could just use a modal view controller, but the issue I have with that is that when presenting the view controller it only 'appears' and does not slide from the bottom (since I require a semi-transparent background, I cannot use the default context for the modal view).
Cannot figure this one out, would appreciate some guidance.
I assume that self.myParentController.view used in -hideSecondView is the same view as self.view in -showSecondView. If this is the case, then you're applying a transition to the whole view here:
[[self.myParentController.view layer] addAnimation:animation forKey:#"darkenBkgFadeOut"];
You added self.secondViewController.view as a subview of self.view in -showSecondView, so when you later perform a transition on self.myParentController.view, it's going to apply the transition to all its subviews (i.e., self.secondViewController.view) as well.
Instead of applying the transition to self.myParentController.view in -hideSecondView, apply it directly to darkenBackground:
[[self.myParentController.darkenBackground layer] addAnimation:animation forKey:#"darkenBkgFadeOut"];
If I recall correctly, you can apply CATransitions when layers are added/removed to/from a view. If not, then you'll have to wrap darkenBackground in a separate container view and perform the transitions on that so it doesn't include self.secondViewController.view when you do the fade out.
I am trying to have a UIView slide up a quarter of the page to reveal another view underneath it (to display options), and then slide back down to cover those options. I've searched SO relentlessly but can't seem to find what I'm looking for. I do not want to use a modalview as I want to maintain the top view on the screen. In the code below, I have it sort-of working, the top level slides up, but then completely disappears (fades) out.
Any help is greatly appreciated!
Thanks.
HomeOptionsViewController *homeOptionsViewController = [[HomeOptionsViewController alloc]
initWithNibName:#"HomeOptionsViewController"
bundle:nil];
// get the view that's currently showing
UIView *currentView = self.view;
// get the the underlying UIWindow, or the view containing the current view
UIView *theWindow = [currentView superview];
UIView *newView = homeOptionsViewController.view;
//newView.frame = CGRectMake(0,300, 320,140);
newView.frame = CGRectMake(0,-10, 320,140);
// remove the current view and replace with myView1
//---[currentView removeFromSuperview];
[theWindow addSubview:newView];
theWindow.frame = CGRectMake(0,-110,320,200);
newView.frame = theWindow.bounds;
// set up an animation for the transition between the views
CATransition *animation = [CATransition animation];
[animation setDuration:0.5];
[animation setType:kCATransitionPush];
[animation setSubtype:kCATransitionFromTop];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]];
//[theWindow setFrame:CGRectMake(0,200,320,300)];
[[theWindow layer] addAnimation:animation forKey:#"SwitchToView1"];
Any reason why you're not using standard UIView animations? CATransitions will entirely change the view because its supposed to be a transition from one view to the other.
Have you tried something like this? You add the view you want to slide just off the bottom of the screen, then animate both frames changing. It creates a slide up effect.
newView.frame = CGRectMake(0,416,320,140);
[theWindow addSubview:newView];
[UIView beginAnimations:#"SwitchToView1" context:nil];
[UIView setAnimationDuration:0.5];
theWindow.frame = CGRectOffset(theWindow.frame, 0, -140);
newView.frame = CGRectOffset(newView.frame, 0, -140);
[UIView commitAnimations];
I have not done any animation stuff with iphone development so far.
Can anybody help me how to make UIbutton move from right to left when view is loaded?
I want to generate effect like that : when view is loaded, the button appears moving from right end to left & stops at its place. Is it possible?
Any help regarding this animation stuff is appreciated. Please help with some sample if available.
Thanks in advance.
Just to make it even slicker, I would suggest not changing the UIView's frame but its center;
CGPoint newLeftCenter = CGPointMake( 20.0f + myButton.frame.size.width / 2.0f, myButton.center.y);
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:1.0f];
myButton.center = newLeftCenter;
[UIView commitAnimations];
in your viewDidAppear:(BOOL)animated method you can change frame of your button inside animation block. so you'll see what you want. Check documentation about animations in UIView class reference. The simpliest animation block will be like that(sorry, i have no mac nearby right now, so code may not be working just after copy and paste)
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:1.0f];
[myButton setFrame:newFrame];
[UIView commitAnimations];
From top to bottom animation
CATransition *animation = [CATransition animation];
[animation setDuration:0.4];
[animation setType:kCATransitionPush];
[animation setSubtype:kCATransitionFromBottom];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]];
[[TopButton layer] addAnimation:animation forKey:#"SwitchToDown"];
/* Common transition subtypes. */
kCATransitionFromRight
kCATransitionFromLeft
kCATransitionFromTop
kCATransitionFromBottom
Swift:
let transition1: CATransition = CATransition()
let timeFunc1 : CAMediaTimingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseInEaseOut)
transition1.duration = 1.0
transition1.timingFunction = timeFunc1
transition1.type = kCATransitionPush
transition1.subtype = kCATransitionFromRight
self.yourBtnORViewRef.layer.addAnimation(transition1, forKey: kCATransition)
Objective-C
CATransition *animation = [CATransition animation];
[animation setDuration:1.0];
[animation setType:kCATransitionPush];
[animation setSubtype:kCATransitionFromRight];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]];
[[self.yourBtnORViewRef layer] addAnimation:animation forKey:#"SwitchToRight"];
Swift 5:
//Animate Your Button From Left to Right
let transition1: CATransition = CATransition()
let timeFunc1 : CAMediaTimingFunction = CAMediaTimingFunction(name: CAMediaTimingFunctionName.easeInEaseOut)
transition1.duration = 1.5
transition1.timingFunction = timeFunc1
transition1.type = CATransitionType.push
transition1.subtype = CATransitionSubtype.fromLeft
self.yourBtnRef.layer.add(transition1, forKey: kCATransition)