UIView animations interacting badly - iphone

I'm seeing what appears to be interaction between separate animations, and I'd really appreciate any suggestions to eliminate this effect.
Basically:
I've got an iPhone app which includes a button 'a' on the root view. Tapping 'a' pushes a view on a navigation view controller stack, with a flip animation. The pushed view has a button to pop the view back to the root.
The underlying code:
- (IBAction)pushOneView{
TheAppDelegate *delegate = [[UIApplication sharedApplication] delegate];
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:0.5];
[UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
[UIView setAnimationTransition: UIViewAnimationTransitionFlipFromRight
forView:delegate.navigationController.view cache:NO];
[delegate.navigationController
pushViewController:oneViewController animated:NO];
[UIView commitAnimations];
}
This seems to work fine, and the animation is quite smooth.
The root view also includes a subview ('panelView'), and another button, 'b'.
panelView can display either of two other subviews--tapping 'b' swaps between those subviews, with a spin animation. The code:
-(IBAction)swapPanels{
UIViewController *coming;
UIViewController *going;
float rotation;
if (self.aPanel.view.superview == nil) {
coming = aPanel;
going = bPanel;
rotation = 3.14;
}
else {
coming = bPanel;
going = aPanel;
rotation = -3.14;
}
// First half of spin
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:0.25];
CGAffineTransform swirlTransform = CGAffineTransformMakeRotation(rotation);
panelView.transform = swirlTransform;
[panelView setAlpha:0.1];
[UIView commitAnimations];
// Finish spin
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:0.25];
CGAffineTransform secondTransform =
CGAffineTransformRotate(swirlTransform, rotation);
panelView.transform = secondTransform;
[panelView setAlpha:1];
[UIView commitAnimations];
// Swap the panels
[going.view removeFromSuperview];
[panelView insertSubview:coming.view atIndex:0];
}
This also seems to work fine. Each of the swappable panels contains a picker and some labels.
However, I notice that the 'a' transition becomes slow and jerky if the 'b' transition has been executed before it.
In other words, if I start the app, run 'a' back and forth several times, it runs smoothly. Then exercise 'b' back and forth a few times. Then try 'a' again...'a' is now jerky, and will remain so until an app restart.
This is 100% repeatable. It is subtle using the simulator, but quite obvious on a device.
I have tested for leaks--none are shown by leaks tool.
If the animation is removed from the 'b' operation (just comment-out the animation steps), the effect on 'a' is not observed after the 'b' subview swap is exercised.
If the pickers are removed from the swappable panel nibs, the effect is similarly eliminated.
If the 'a' animation transition is set to cache, then after 'b' it does not stutter in the middle, but seems to ignore animating, simply swapping the view (this may be a matter of perception).
In case I'm not clear: I am NOT triggering these separate operations at the same time. Animation 'a', after 'b' has been executed--and completed--is not the same as if 'b' had never been executed. Is there clean-up I should be doing after an animation? Is my subview-swapping code flawed? Or...?
Thanks in advance for any suggestions.

You do have two overlapping animations in your 'b' section. When you create an animation using a begin / commit block, it gets handed off to a background thread to perform. In your 'b' section, the two animations that should be sequential are actually being fired off at nearly the same time. This can cause bizarre behavior, possibly like what you are seeing.
I'd recommend adding a callback in your first animation to a delegate method using code like the following:
[UIView setAnimationDelegate:self];
[UIView setAnimationDidStopSelector:#selector(rotationAnimationFinished:finished:context:)];
within your first animation block in 'b' (the "First half of spin" part). Then you need to define the callback method within your class, in this case
- (void)rotationAnimationFinished:(NSString *)animationID finished:(BOOL)finished context:(void *)context;
Within that delegate method, which will be called when the first part of the spin animation has finished, place the remaining code from your 'b' method (everything after your "Finish spin" comment).
By separating apart these animations, that might prevent the weirdness you're seeing.

Brad's answer does seem to have lead me to a solution: the symptoms continued to suggest that something about running those 'b' animations left the system in a different state than when it started. Finally, it occurred to me that the transform property of the panelView was left set after the 'b' animations...and perhaps that impacted further animations of a superview containing panelView.
So I set up method as Brad suggested, to execute once the 'b' animations were complete--but all that method does is set the panelView transform back to the default: CGAffineTransformIdentity:
(void)spinFinished:(NSString *)animationID finished:(BOOL)finished context:(void *)context {
panelView.transform = CGAffineTransformIdentity;
}
With this in place, post-'b' executions of the 'a' animation appear to be back to normal. So thanks again, Brad, for your help here. It is much appreciated.

Related

Animation not Shown When Calling it First Time

I have one simple animation:
- (void)showMenu
{
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.5];
[UIView setAnimationDelay:0.0];
[UIView setAnimationCurve:UIViewAnimationCurveEaseOut];
self.scrollView.frame = CGRectMake(296, -150, 432, 356);
[self.buttonMenu setImage:[UIImage imageNamed:#"menu_arrow_up.png"] forState:UIControlStateNormal];
[self.view bringSubviewToFront:self.scrollView];
[UIView commitAnimations];
}
When I call this animation the first time, just the image of my button changes,
the position of my scrollview does not change.
Everything works correctly, after I called my showMenu method twice.
I call showMenu. the image of the button changes. position of scrollview not
I call another method to reset everything. image of button changes. position of scrollview not
I call showMenu. the image of the button changes. position of scrollview changes
from now on it works every time I call showmenu
the second method is closeMenu:
- (void)closeMenu
{
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.5];
[UIView setAnimationDelay:0.0];
[UIView setAnimationCurve:UIViewAnimationCurveEaseOut];
self.scrollView.frame = CGRectMake(296, -317, 432, 356);
[self.buttonMenu setImage:[UIImage imageNamed:#"menu_arrow_down.png"] forState:UIControlStateNormal];
[UIView commitAnimations];
}
So why does it work just when I click it twice?
I had the same problem when i perform a UIAnimation and simultaneously adding a UITableView programmatically. The frame of UIView changes but it will not update in display.
To solve this problem call your method using performSelector:withObject:afterDelay: with a delay of 0.
If you have autolayout turned on, you may want to wary about changing the frame of a view. Unfortunately, when the constraints are reapplied (which triggered by a myriad of seemingly innocuous actions, such as setting a text label, etc.), your manually set frame will be replaced with values governed by the constraints.
You're probably not seeing this problem manifest itself the second time time you call this routine because you're probably not doing anything immediately thereafter that causes constraints to be reapplied. Even with autolayout on, you can sometime change a frame manually, and it will work, but as soon as constraints are reapplied, the frame may get reset.
There are two solutions:
If using auto layout, you can animate the changing of constraint constants. See the latter part of this answer for an example of how to create an IBOutlet for constraint and then changing the constant property within an animation block.
You can also simply disable autolayout.

Animate fade-out for drawings

I have a view where the user can draw. What I want is that, the strokes that were drawn by the user must slowly fade-out in the order that they were drawn. Any advice ?
JYou can try pluging in a AnimationFadeOut and also set a duration to it. Here is a code snippet for that. Let me know if this helps you out.
-(void)fadeOut:(UIView*)viewToDissolve withDuration:(NSTimeInterval)duration andWait:(NSTimeInterval)wait
{
[UIView beginAnimations: #"Fade Out" context:nil];
// wait for time before begin
[UIView setAnimationDelay:wait];
// druation of animation
[UIView setAnimationDuration:duration];
viewToDissolve.alpha = 0.0;
[UIView commitAnimations];
}
Rather than uiview you can use your action to fade out.
For what you're asking, you could simply add a stroke as a subview, then use a cross fade transition.
[drawingView addSubView:strokeView];
[UIView transitionWithView:strokeView duration:0.2f options:UIViewAnimationOptionTransitionCrossDissolve animations:NULL completion:NULL];
For something like this (showing a drawing being completed), I would personally capture the touch points and time offsets to animate the drawing of each point at the speed of the drawer. More code, but a stylistic choice.

UIView Animation Problem

[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:0.30f];
[UIView setAnimationTransition:UIViewAnimationTransitionNone forView:viewSettings cache:YES];
viewSettings.alpha = 0;
[viewSettings removeFromSuperview];
[UIView commitAnimations];
I ve written the code above that works well when I add the view via animation, but it doesn't work when i remove the view from superview. Animation works if I remove [viewSettings removeFromSuperview] line. I don't know where I'm doing wrong.
You need to remove it from the superview after the animation has completed. This is very easy to accomplish if you use the blocks based API, which Apple is encouraging you to do:
[UIView transitionWithView:viewSettings
duration:0.30f
options:UIViewAnimationOptionTransitionNone
animations:^{
[viewSettings setAlpha:0];
} completion:^(BOOL finished) {
[viewSettings removeFromSuperview];
}];
You can read about all the options in Apple's documentation.
removeFromSuperview is not an animatable action, so it is getting performed immediately. Once you commitAnimations, your view is no longer part of it's superview, so you can't see the animation, if it is still even happening.
If you want your animation to happen, then the view to get removed, call removeFromSuperview when the animation ends, such as in a selector specified with setAnimationDidStopSelector:.
Try removing view after the animation is completed. Initially alpha value of the view is 1 then, you apply the animation and make it 0. Now the view is still there but it is not visible. Once the animation is over then remove the view. I think it should work.
I think viewSettings is removed before you commit the animation.
Try inverting the two last lines.

Load a XIB with custom Transition?

Is it possible (at all) to load a XIB with custom AnimationTransition?
What I have done, is creating an animation that "Covers" the screen, and what I want is that after that animation has done playing, I would like it to display the new XIB.
I cant seem to find any proper solution to this...Any ideas?
To be more clear: Press a button --> Play Animation (cover screen) --> Load XIB.
Hello again! Yes, the last way you described is the way I am doing it. I have two UIViews (Might be wrong already there), that are placed off-bounds on each side, (like x.-160.y.0 and x.320y.0)
-(IBAction) leftDoor{
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:1];
[UIView setAnimationDelegate:self];
[UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
closeDoor1.center = CGPointMake( closeDoor1.center.x +160, closeDoor1.center.y);
[UIView commitAnimations];
}
-(IBAction) rightDoor{
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:1];
[UIView setAnimationDelegate:self];
[UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
closeDoor2.center = CGPointMake( closeDoor2.center.x -160, closeDoor2.center.y);
[UIView commitAnimations];
}
So, what I am going to do is not to "split" the current view and then open a new XIB, the effect I am searching for is a "closing door" effect, thats why I used UIView ( thought I place graphics on top of those, like two ImageViews). Then, for loading the new XIB...This is where im really puzzled. My first way of trying this out was to make three IBActions, including the two I mentioned above, and then apply all three (multiple actions) to a button. So for switching views I did something like this: `-(IBAction) newViewDisplay:(id)sender{
theView *newViewController = [[theView alloc]
initWithNibName:#"theView" bundle:nil];
[self.view addSubview:newViewController.view];
}
`
As you said, this might be over my head, but if I just got some directions, I´ll walk miles to make this work. It would really give my app a facelift. A huge thanks for taking time to answer my question, All the best/Andy
What are you covering the screen with?
Think of it this way, (it sounds like) you have 2 views, the old one and the new one that is stored in this xib. The animation is secondary.
You need to load the new view, then display it (can be off-screen), then animate it (move it) into the place you want it to go. If you want to split it into two parts, one at the bottom and one at the top of the screen, then meet in the middle, I think that's both complicated and above you skill level. (Not trying to be mean here).
If you are trying to do a split animation as described, it can be done, but you need to 'fake it'. It would involve taking a 'screenshot' (of sorts), splitting it, moving these two images so they meet with an animation, loading the view underneath, and then removing the images. Tricky stuff.
Do you have to have this sort of animation?
If you could post the code you have, I can rearrange it, and add to it, for you.
You'll need to clarify what it is exactly you want to do, though.
UPDATE 3: I added another option for autoreverse.
//You can add both doors into one animation block.
//Create an animation block. Ease Out is better for this animation but you can change it.
[UIView animateWithDuration:1.0 delay:0.0 options:(UIViewAnimationOptionCurveEaseOut | UIViewAnimationOptionAutoreverse) animations:^{
closeDoor1.center = CGPointMake( closeDoor1.center.x +160, closeDoor1.center.y);
closeDoor2.center = CGPointMake( closeDoor2.center.x -160, closeDoor2.center.y);
}completion:^(BOOL finished){
if (finished) {
//When finished, create the VC if it doesn't exist, and insert it below the 'closed door'.
if (newViewController == nil) {
UIViewController *newViewController = [[UIViewController alloc] initWithNibName:#"theView" bundle:nil];
}
[self.view insertSubview:newViewController.view belowSubview: closeDoor2];;
[self.closeDoor1 removeFromSuperview];
[self.closeDoor2 removeFromSuperview];
}
}];

UIView Animations stop working after dismiss Modal View

I just upgraded my iPhone 4 from iOS 4.2.1 to 4.3.2, and to XCode 4.0.2, and I am encountering some bizarre issues with uiview animations. When I first launch my app, code like this executes perfectly:
[UIView beginAnimations:#"fadeAlphaIn" context:nil];
[UIView setAnimationDuration:0.5f];
viewClue.alpha = 1.0f;
[UIView commitAnimations];
But then, after dismissing a presenting and then dismissing a modal view by the standard method:
[self presentModalViewController:more animated:YES];
and
[self dismissModalViewControllerAnimated:YES];
the first animation no longer works. Instead of fading in, for example, the viewClue view simply jumps from alpha = 0 to alpha = 1. Similarly, other animations altering other views' frame property just force the frame to jump from the initial to final value without animation. These animations worked fine before the modal view was presented and dismissed.
I understand that others have experienced animation issues with the upgrade to iOS 4.3.2, but the way the modal view disrupts animation seems very odd. Has anyone else experienced this problem? Any ideas as to a solution? I'm thinking of just adding the modal view as a subview and animation it as it hides and appears, but using the standard modal view method would be much preferred.
Thanks for your help,
James
EDIT: Some more code showing how the app's map is animated
-(void) viewMapfunc
{
AudioServicesPlaySystemSound(soundID);
if(mapvisible){
[UIView animateWithDuration:0.5
delay:0.1
options:UIViewAnimationOptionAllowUserInteraction
animations:^{
map.frame = CGRectMake(0, 350, 320, 27);
mapscroll.frame = CGRectMake(0, 27, 320, 0);
}
completion:nil];
mapvisible = NO;
viewMapLabel.text = #"View Map";
}else {
[UIView animateWithDuration:0.5
delay:0.1
options:UIViewAnimationOptionAllowUserInteraction
animations:^{
map.frame = CGRectMake(0, 50, 320, 300);
mapscroll.frame = CGRectMake(0, 27, 320, 300);
}
completion:nil];
mapvisible = YES;
viewMapLabel.text = #"Hide Map";
}
}
Try to check two things:
Do you commit all started animations? I got all kinds of strange effects after not committing one of them.
Do any animations take place in the same time? Especially with the same view.
Whether any animations take place right after changing properties. Something like:
-
view.alpha = 1;
[UIView beginAnimations:…];
view.alpha = 0;
[UIView commitAnimations:…];
In this example, view will not change it's alpha value from 1 to 0. It will change it instantly. To start an animation you have to extract animations block to another method and call it with performSelectorInMainThread:withObject:afterDelay:. Delay can be even 0.
I solved it by restarting my animation in my UIView subclass:
override func willMove(toWindow newWindow: UIWindow?) {
if newWindow != nil {
spinner.startSpinning() // Restart any animation here
}
}
In the end, I just removed all modal views and implemented them in other ways. For some reason, using modal views messed up animations. Makes no sense, but removing them fixed the problem. If anyone can enlighten me as to why this is going on, it might be nice for memory concerns...
I had the same issue. The root of my trouble was that my animation was being triggered by a notification, and I was adding an observer on each viewWillAppear, but forgot to remove in viewDidDisappear (remember that iOS 6 no longer calls viewDidUnload reliably).
Essentially, I was calling my animation function twice in quick succession, which was causing the visible irregularity. Hopefully this helps someone out down the line!
I've managed to solve this same issue in my own application.
I noticed while debugging that my UIImageViews which I was animating had different memory addresses before and after I pushed my modal view controller(s). At no other time did these UIImageViews switch their memory addresses.
I thought this might have been the root of the issue and it seems I was right.
My client's code had been allocating/initializing my View Controller's UIImageViews in
-viewDidAppear instead of in -viewDidLoad. Thus, every time I launched and dismissed a modal view controller my UIImageViews I was animating would get reinitialized.
Check for yourself if your map object's memory address is changing before and after you launch your modals, and if it is be sure to move your initialization logic to a more proper section of your code.
Hope this helps you!
Dexter
I was using UIView animateWithDuration: and I solved it by not using the completion block. This is code from a subclassed UIView. In the view controller's viewWillAppear: I set self.shouldAnimate to YES, and in the view controller's viewWillDisappear: I set self.shouldAnimate to NO.
-(void)continueRotate {
if (self.shouldAnimate) {
[self rotateRadarView:self.radarInner];
}
}
-(void)rotateRadarView:(UIView *)view {
[UIView animateWithDuration:0.6 delay:0 options:UIViewAnimationOptionCurveLinear animations:^{
[UIView setAnimationDelegate:self];
[UIView setAnimationDidStopSelector:#selector(continueRotate)];
[view setTransform:CGAffineTransformRotate(view.transform, M_PI_2)];
}completion:nil];
}