Setting layer.transform flashes the layer at the end location then animates it from current location.

Question

On occasion when setting layer.transform to a new transform I see the layer blink at its finished location, then animate from its current location to its finished location.

I don't know if this is related but at the same time I am setting the sublayerTransform on the layer's superlayer.

I've really have no clue why this is happening, any thoughts would be appreciated.

Thanks.

Update

When I remove the sublayer transform, this behavior does not occur.

This is my initial setup.

I avoid implicit actions with my sublayerTransform with:

self.actions = [NSDictionary dictionaryWithObject:[NSNull null] forKey:@"sublayerTransform"];

This method transforms the individual layer

- (void)setSelectedCover:(int)cover{    
    selectedCover = cover;

    CoverLayer *coverLayer = [onScreenCovers objectForKey:[NSNumber numberWithInt:cover]];

    [CATransaction begin];
    [CATransaction setValue:[NSNumber numberWithFloat:0.3f]
                    forKey:kCATransactionAnimationDuration];

    coverLayer.transform = flippedUpTransform;
    [CATransaction commit];
}

This method creates a scroll like effect (I know there are more convenient ways of scrolling, but this is the best implementation for my needs so far) this method is called whenever the finger is moving on the screen.

- (void)setScrollOffset:(float)offset absolute:(BOOL)absolute animated:(BOOL)animated{
     CATransform3D aSublayerTransform = self.sublayerTransform;
     scrollOffset = aSublayerTransform.m41;

     if (absolute) {
        scrollOffset = offset;
     }else {
        scrollOffset += offset;
     }

     [self setValue:[NSNumber numberWithInt:scrollOffset] forKeyPath:@"sublayerTransform.translation.x"];
}

Also. I can only reproduce this on 2nd generation devices (not on 3rd) so it makes me think it is partly a device performance issue, but I still need a work around.

I have considered using a CABasicAnimation (explicit animations) like so:

  - (void)setSelectedCover:(int)cover{  
    selectedCover = cover;

    CoverLayer *coverLayer = [onScreenCovers objectForKey:[NSNumber numberWithInt:cover]];

    CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"transform"];
    animation.toValue = [NSValue valueWithCATransform3D:flippedUpTransform];
    animation.duration = 0.3f;

        [coverLayer addAnimation:animation forKey:@"transform"];
   }

This actually works really good, no flickering! the only problem now is making it stay.

So I added this to the animation:

animation.removedOnCompletion = NO;
animation.fillMode = kCAFillModeForwards;

This actually made it stay at the end of the animation but I think it is important for anyone who is working on a similar task to know that adding these two lines only makes the presentation layer stick, it does not persist it out to the model layer. In my case I have additional transforms for the the layer at hand if i want to transform again, by saying layer.transform = newtransform and the model was never changed, my layer will revert to its original transform before I executed the explicit animation.

So I thought I had a pretty good fix for the problem of persisting the transform. I added:

animation.delegate = coverLayer.delegate;

In my case each layer that gets animated, needs its own delegate because I could have multiple layers animating at the same time because things move so quickly. so I want each layer responsible for it self.

This is what I implemented in the delegate.

- (void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag{

   if (flag) {

    [CATransaction begin];
    [CATransaction setValue:(id)kCFBooleanTrue
                     forKey:kCATransactionDisableActions];
    cover.transform = flippedUpTransform;
    [CATransaction commit];
    [cover performSelector:@selector(removeAllAnimations) withObject:nil afterDelay:0.2];

   }
}

If the animation completed successfully I take the finished transform and apply it to the model itself

Shortly after I remove the explicit animation because when other transforms are set, it will run the animation I last added.

This works.

If the animation did not complete I do nothing . I don't need to update the modal layer because the animation that interrupted should be responsible for picking up where this one left off and making sure the presentation is persisted.

The problem is relying on delayed calls to always be right on. They aren't, It keeps it together enough, but sometimes things can look a little off. In the end I will accept this solution If I can't further rectify it. It just isn't as smooth...

Answer 1

It would help if you would show the code you're using, but sometimes I've seen a flicker occur when the code animates the property (transform in your case) and then sets the property in a later run loop. What's happening is that it's getting an animation added to it (the layer) twice. Just keep in mind that making a change to a non root layer property directly will (implicitly) animate that property unless you disable animation. Also, remember that animating the property doesn't automatically set the property. If you are using explicit animation, make sure when you add the animation to the layer, you use "transform" as the key--something like:

CABasicAnimation *transformAnim = [CABasicAnimation 
                                         animationForKey:@"transform"];
[transformAnim setToValue:CATransform3DMake...];
[transformAnim setDuration:...]; // etc. etc.

// This next line actually sets the transform
[transformLayer setTransform:CATransform3DMake...];
// This overrides the default animation for animating the transform
[transformLayer addAnimation:transformAnim forKey:@"transform"];

Not sure if you're using explicit animation, but that's what came to mind.

Also, you're sublayerTransform could be affecting this. What happens when you comment that out? It might help if you would update your question with some code.

Best regards.

Answer 2

iOS4 update resolves this issue.