Search code examples
objective-ccocoa-touchcore-animation

CALayer sublayerTransform and contentsScale do not play well together

I've set up some example layers like this. Every layer scales down its sublayers contents by 0.75.

CGColorRef color = [UIColor colorWithRed:1 green:0 blue:0 alpha:1].CGColor;
CGRect frame = CGRectMake(0, 0, 128, 128);

m_layer0 = [CATextLayer new];
m_layer0.string = @"0";
m_layer0.frame = frame;
m_layer0.sublayerTransform = CATransform3DMakeScale(0.75, 0.75, 0.75);
m_layer0.masksToBounds = NO;
m_layer0.foregroundColor = color; 

m_layer1 = [CATextLayer new];
m_layer1.string = @"  1";
m_layer1.frame = frame;
m_layer1.sublayerTransform = CATransform3DMakeScale(0.75, 0.75, 0.75);
m_layer1.masksToBounds = NO;
m_layer1.foregroundColor = color;

m_layer2 = [CATextLayer new];
m_layer2.string = @"    2";
m_layer2.frame = frame;
m_layer2.sublayerTransform = CATransform3DMakeScale(0.75, 0.75, 0.75);
m_layer2.masksToBounds = NO;
m_layer2.foregroundColor = color;

[m_layer0 addSublayer:m_layer1];
[m_layer1 addSublayer:m_layer2];

[m_hostView.layer addSublayer:m_layer0];

The hostView is a subview of an UIScrollView and on zoom, I set the appropriate contentsScale factor on its sublayers to get a crisp look.

- (void)scrollViewDidEndZooming:(UIScrollView *)scrollView withView:(UIView *)view atScale:(float)scale {
    [CATransaction begin];
    [CATransaction setDisableActions:YES];
    m_layer0.contentsScale = scale;
    m_layer1.contentsScale = scale;
    m_layer2.contentsScale = scale;
    [CATransaction commit];
}

This produces following output image when zoomed in. image

Why is the first sublayer rendered correctly but the sublayer of that all blurry?

Solution

  • I opened a TSI on this one. Here is the solution:

    The problem is that I'm scaling the Z axis as well as the X and Y axes, which causes the layer to take a more complex rendering path. So CATransform3DMakeScale(0.75, 0.75, 1.0) would be the 'correct' way to do it.

    If you truly want to enable z-depth in sublayer transforms, you would set the m34 value such as:

    CATransform3D thisIsHowYouEnable3DForALayer = CATransform3DIdentity; 
thisIsHowYouEnable3DForALayer.m34 = -1.0/kSomeCameraDistanceValue;
parentView.layer.sublayerTransform = thisIsHowYouEnable3DForALayer;