iOS animate parent view's bounds changes child view bounds - ios

Question

I am trying to create a view animation similar to facebook's expanding X when removing a message in the iPhone version. The problem I am facing right now is, I am animating the parent view's bounds using core animation and the resulting subviews animations are animating with it. Ultimately what I want is the parent view to animate and the subview to remain unanimated, in the center of it's parent's view. Below is the code I am using.
#interface FCXView : UIView
#end
#implementation FCXView
- (id)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self) {
self.backgroundColor = [UIColor clearColor];
self.layer.opacity = 1.0f;
self.alpha = 1.0f;
self.autoresizingMask = UIViewAutoresizingNone;
}
return self;
}
- (void)drawRect:(CGRect)rect
{
CGContextRef context = UIGraphicsGetCurrentContext();
CGFloat lineWidth2 = 1.0f;
CGContextSetLineWidth(context, lineWidth2);
CGFloat red[4] = {1.0f, 0.0f, 0.0f, 0.9f};
CGContextSetStrokeColor(context, red);
CGContextBeginPath(context);
CGContextMoveToPoint(context, 17.0f, 15.0f);
CGContextAddLineToPoint(context, 28.0f, 30.0f);
CGContextStrokePath(context);
CGContextBeginPath(context);
CGContextMoveToPoint(context, 28.0f, 15.0f);
CGContextAddLineToPoint(context, 17.0f, 30.0f);
CGContextStrokePath(context);
CGContextFillPath(context);
}
#end
#interface FCRoundView ()
#end
#implementation FCRoundView
- (id)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self) {
// Initialization code
self.backgroundColor = [UIColor clearColor];
self.layer.opacity = 1.0f;
self.userInteractionEnabled = YES;
self.multipleTouchEnabled = NO;
self.autoresizesSubviews = NO;
[self setupXView];
}
return self;
}
- (void)setupXView
{
// Load X
FCXView *xView = [[FCXView alloc] initWithFrame:CGRectMake(0, 0, 45, 45)];
[self addSubview:xView];
}
- (void)drawRect:(CGRect)rect
{
CGFloat lineWidth = 5;
CGRect borderRect = CGRectInset(rect, lineWidth * 0.5, lineWidth * 0.5);
CGContextRef context = UIGraphicsGetCurrentContext();
CGContextSetRGBStrokeColor(context, 1.0, 1.0, 1.0, 1.0);
CGContextSetRGBFillColor(context, 175.0/255.0, 175.0/255.0, 175.0/255.0, 0.6);
CGContextSetLineWidth(context, 5.0);
CGContextFillEllipseInRect (context, borderRect);
CGContextStrokeEllipseInRect(context, borderRect);
}
#pragma mark - Handle touch
- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event
{
if (self.bounds.size.height == 45) {
SKBounceAnimation *bounceAnimation = [SKBounceAnimation animationWithKeyPath:#"bounds"];
bounceAnimation.fromValue = [NSValue valueWithCGRect:self.frame];
bounceAnimation.toValue = [NSValue valueWithCGRect:CGRectMake(0, 0, 75, 75)];
bounceAnimation.duration = 0.5f;
bounceAnimation.numberOfBounces = 4;
bounceAnimation.delegate = self;
bounceAnimation.removedOnCompletion = NO;
bounceAnimation.fillMode = kCAFillModeForwards;
bounceAnimation.shouldOvershoot = YES;
[self.layer addAnimation:bounceAnimation forKey:#"someKey"];
}
else {
SKBounceAnimation *bounceAnimation = [SKBounceAnimation animationWithKeyPath:#"bounds"];
bounceAnimation.fromValue = [NSValue valueWithCGRect:self.frame];
bounceAnimation.toValue = [NSValue valueWithCGRect:CGRectMake(0, 0, 45, 45)];
bounceAnimation.duration = 0.5f;
bounceAnimation.numberOfBounces = 4;
bounceAnimation.delegate = self;
bounceAnimation.removedOnCompletion = NO;
bounceAnimation.fillMode = kCAFillModeForwards;
[self.layer addAnimation:bounceAnimation forKey:#"someKey1"];
}
}
- (void)animationDidStop:(SKBounceAnimation *)animation finished:(BOOL)flag
{
[self.layer setValue:animation.toValue forKeyPath:animation.keyPath];
[self.layer removeAnimationForKey:#"someKey"];
[self.layer removeAnimationForKey:#"someKey1"];
}