I want to animate, in fact fade, "within" drawRect

Question

Is there a way to make drawRect animate FROM THE PREVIOUS SCENE to the next one?

(Amazingly) you can animate inside drawRect - try it. You can fade, translate or animate any other property.

However, it starts "from fresh", from blank. So for example if you put a fade-in animation block in drawRect, the previous scene with disappear and the new scene will fade up from white.

I want the screen to fade from the previous image (drawn in the previous cycle of drawRect) to the new image I have just drawn ... err, am drawing.

Is there a way to do that, perhaps trickily by manipulating what's going on with drawRect?

This would seem to be a very common use case - blending from one scene to the next.

Does anyone know the secret?

Of course, obviously this can be done in the core animation milieu or in many other ways, but having drawRect fade from one drawRect to the next is an obvious idea. Cheers.

Astounding update thanks to the genius of WrightCS.....

Thanks only to WrightCS, we now know that drawRect handles animations perfectly. Simply paste this code at the end of any drawRect and try it:

self.alpha = 0.0;
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:2];
self.alpha = 1.0;
[UIView commitAnimations];

it treats the entire drawRect, no matter how complex, as one enormous block and it wraps it in that animation. Yes, it even includes painted in offscreen areas, bitmap rendering or anything else. Everything gets animated. Who knew?

The problem at hand - how to make it start the animation from the previous scene rather than start from blank?

Kris Van Bael · Answer 1 · 2011-01-19T00:18:00.013

Drawrect Is invisible. It happens in the 'backbuffer' which the iOS displays on screen only when you're ready with drawRect. So you can definitely not animate while in drawrect. However, you can commit animation instrucions from just about anywhere, including drawrect. But the animation will be performed afterwards.

Animation requires timing and showing different frames to the user.

You CAN do that all by yourself (constantly forcing a redraw and doing something slightly different in drawrect each the time) but that's a lot of work, especialy if you want it done right.

Luckily iOS has many animation effects programmed for you. Either using Core Animation, or the (more simple and basic) animation in UIKit. But since it works by animating certain properties of views (eg the alpha of a whole view, or the rotation of a whole view, ...) you might need to rearrange your views and subviews to make good use of it.

E.g. Each horse limb is separate subview and you animate their transformations (no redraw needed, iOS will do the rest)

E.g. The old and new frame are two separate views and you animate the new frame (which is on top) from alpha 0 to alpha 1.

I'm not saying that the code will fail, but it will never work fading from a previous keyframe to the current that way. — Kris Van Bael, Jan 19 '11 at 00:00
Working with animation is a bit tricky at first, until you realize all animatable properties are stored twice: the one you access in the code is the 'goal', while coreanimation calculates the 'halfway' values that are actually shown on screen. CommitAnimations immediately returns control, the actual animation will happn afterwards, without you having to care bout it anymore. That's you can call it from within drawrect (I'll adapt woding of my answer) — Kris Van Bael, Jan 19 '11 at 00:14

score 2 · Answer 2 · answered Jan 18 '11 at 23:11

2

You can animate the alpha:

[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:2.0];
myObject.alpha = 0.0;
[UIView commitAnimations];

answered Jan 18 '11 at 23:11

WrightsCS

50,551
22
134
186

5

No, you are NOT allowed to do that from inside drawRect:! Do that in another place and don't bother about animating inside your drawRect: – Christian Beer Jan 18 '11 at 23:46

score 1 · Answer 3 · answered Feb 15 '12 at 14:01

if you are under iOS 5.0+, you can use the following:

...
            [UIView animateWithDuration:0.3 
                                  delay:0.0 
                                options:UIViewAnimationOptionBeginFromCurrentState 
                             animations:^{
                                 //do your stuff here
                             }completion:^(BOOL finished) {
                                 //completition stuff go here
                             }];
...

score 0 · Answer 4 · answered Feb 15 '12 at 14:22

0

The best thing you can do is to use two UIView instances and animate between them.

When you are starting the animation you have to know which is the original and final state of the animation. That's difficult if it's only one view.

answered Feb 15 '12 at 14:22

Sulthan

128,090
22
218
270

I want to animate, in fact fade, "within" drawRect

4 Answers4

Linked