How to scale NSView from center with Facebook Pop animation?
Please note that this is a Mac OS X ( NSView
) related question.
I'm trying to use Facebook POP animation to scale an NSView from center (to 75% of its size) and then back to 100%, however I can't seem to get it to work. Considering what kPOPLayerScaleXY
doesn't seem to work, I did the following, but it gives me the wrong results (since it seems to scale down from the top left, and when zoomIn
false, it gets too large:
CGRect baseRect = CGRectMake(0, 0, 30, 24);
CGFloat scale = (zoomIn) ? 0.75 : 1.0;
CGFloat x = baseRect.origin.x;
CGFloat y = baseRect.origin.y;
CGFloat width = baseRect.size.width;
CGFloat height = baseRect.size.height;
if (zoomIn) {
width -= floorf((1.0 - scale) * width);
height -= floorf((1.0 - scale) * height);
x += floorf((width * (1.0f - scale)) / 2);
y += floorf((height * (1.0f - scale)) / 2);
}
CGRect scaleRect = CGRectMake(x, y, width, height);
[myView.layer pop_removeAllAnimations];
POPSpringAnimation *animation = [POPSpringAnimation animationWithPropertyNamed:kPOPLayerBounds];
animation.springBounciness = 8;
animation.toValue = [NSValue valueWithCGRect: scaleRect];
[myView.layer pop_addAnimation:animation forKey:@"zoom"];
+3
source to share
1 answer
I finally got it using two animations:
CGRect baseRect = CGRectMake(0, 0, 30, 24);
CGFloat scale = (zoomIn) ? 0.80 : 1.0;
CGFloat x = baseRect.origin.x;
CGFloat y = baseRect.origin.y;
if (zoomIn) {
x = floorf((baseRect.size.width * (1.0 - scale)) / 2);
y = floorf((baseRect.size.height * (1.0 - scale)) / 2);
}
[myView.layer pop_removeAllAnimations];
POPSpringAnimation *animation = [POPSpringAnimation animationWithPropertyNamed:kPOPLayerScaleXY];
animation.springBounciness = 8;
animation.toValue = [NSValue valueWithCGSize:CGSizeMake(scale, scale)];
[myView.layer pop_addAnimation:animation forKey:@"zoom"];
animation = [POPSpringAnimation animationWithPropertyNamed:kPOPLayerTranslationXY];
animation.springBounciness = 8;
animation.toValue = [NSValue valueWithCGPoint:CGPointMake(x, y)];
[myView.layer pop_addAnimation:animation forKey:@"translate"];
+5
source to share