Search code examples
iosobjective-ccalayercaanimation

Change height of layer using caanimation


I am learning the caanimations and I face an issue. I want to display a rectangle which height start to 1 and goes to 100. I want this rectangle to stay in the middle of the view and just expand its height.

this is the code i made so far:

CAShapeLayer *rect = [CAShapeLayer layer];
CGRect frame = CGRectMake(0, 0,destView.frame.size.width, 1);

rect.frame = frame;
rect.path = [UIBezierPath bezierPathWithRect:frame].CGPath;
//DestView is the view that will receive this layer
rect.position = destView.center;
//For debug purpose
rect.fillColor = [UIColor blackColor].CGColor;
rect.strokeColor = [UIColor redColor].CGColor;
rect.anchorPoint = CGPointMake(0.5, 0.5);

CABasicAnimation *test = [CABasicAnimation animationWithKeyPath:@"bounds.size.height"];
[test setFromValue:[NSNumber numberWithFloat:1.0f]];
[test setToValue:[NSNumber numberWithFloat:100.0f]];
test.duration = 5.0f;
[test setFillMode:kCAFillModeForwards];

[rect addAnimation:test forKey:@"rectGrowing"];
[destView.layer addSublayer:rect];

The result I have is the redline (rectangle with 1 height and red stroke) moving from bottom to middle... The height does not increase.


Solution

  • From your code, the height should increase. However you should use backgroundColor instead of fillColor.

    This is because although the height changed, the path does not however.