objective c mask animation - objective-c

Question

I want to make an animation as below. It is like Angry Birds Game's settings wheel button.
I used images to describe my problem.
I can rotate the wheel
and I can up the image (set_bg.png).
startup position:
end position (after clicked the wheel):
as you see on startup position, I want to hide above wheel but I couldn't do. How can I do this animation?
I tried that code:
on ViewDid:
CALayer *maskLayer = [CALayer layer];
UIImage *maskImage = [UIImage imageNamed:#"set_bg.png"];
maskLayer.contents = (id)maskImage.CGImage;
maskLayer.bounds = CGRectMake(0,0,92,219);
maskLayer.frame =CGRectMake(0,-135,92,219);
btn_setting_bg.layer.mask = maskLayer;
btn_setting_bg.layer.masksToBounds = YES;
on wheel touched:
CGRect position;
CGRect oldBounds;
CGRect newBounds;
CABasicAnimation* animation = [CABasicAnimation animationWithKeyPath:#"transform.rotation.z"];
if(isSubMenuOpened == YES){
animation.fromValue = [NSNumber numberWithFloat:2*M_PI];
animation.toValue = [NSNumber numberWithFloat: 0.0f];
position = CGRectMake(btn_setting_bg.frame.origin.x,btn_settings.frame.origin.y + 6, btn_setting_bg.frame.size.width, btn_setting_bg.frame.size.height);
newBounds = CGRectMake(0,-135,92,219);
oldBounds = CGRectMake(0,0,92,219);
isSubMenuOpened = NO;
}else{
animation.fromValue = [NSNumber numberWithFloat:0.0f];
animation.toValue = [NSNumber numberWithFloat: 2*M_PI];
position = CGRectMake(btn_setting_bg.frame.origin.x,btn_setting_bg.frame.origin.y - btn_setting_bg.frame.size.height -13 + btn_settings.frame.size.height, btn_setting_bg.frame.size.width, btn_setting_bg.frame.size.height);
oldBounds = CGRectMake(0,-135,92,219);
newBounds = CGRectMake(0,0,92,219);
isSubMenuOpened = YES;
// NSLog([NSString stringWithFormat:#"x:%f,y:%f", position.origin.x, position.origin.y]);
}
[UIView animateWithDuration:1.2
delay:0.0
options: UIViewAnimationCurveEaseOut
animations:^{
[btn_setting_bg setFrame:position];
//[btn_setting_bg.layer.mask setFrame:CGRectMake(0,500,92,219)];
}
completion:^(BOOL finished){
CABasicAnimation *animation2 = [CABasicAnimation animationWithKeyPath:#"scale.y"];
animation2.fromValue = [NSValue valueWithCGRect:oldBounds];
animation2.toValue = [NSValue valueWithCGRect:newBounds];
animation2.duration = 1.2f;
btn_setting_bg.layer.mask.frame = newBounds;
// btn_setting_bg.layer.mask.bounds = CGRectMake(0,0,92,219);
[btn_setting_bg.layer.mask addAnimation:animation2 forKey:#"scale.y"];
}];
animation.duration = 1.2f;
animation.repeatCount = 1;
[btn_settings.layer addAnimation:animation forKey:#"SpinAnimation"];

Answer 1

Try animating the alpha property of wheel from 0.0f to 1.0f.

Answer 2

I have solved problem using alpha. It is not what I exactly I want but this is also a good solution.
Thanks to #paulrehkugler and #kate-gregory
Now my code is as simple as:
CGRect position;
CABasicAnimation* animation = [CABasicAnimation animationWithKeyPath:#"transform.rotation.z"];
if(isSubMenuOpened == YES){
animation.fromValue = [NSNumber numberWithFloat:2*M_PI];
animation.toValue = [NSNumber numberWithFloat: 0.0f];
position = CGRectMake(btn_setting_bg.frame.origin.x,btn_settings.frame.origin.y + 6, btn_setting_bg.frame.size.width, btn_setting_bg.frame.size.height);
isSubMenuOpened = NO;
}else{
animation.fromValue = [NSNumber numberWithFloat:0.0f];
animation.toValue = [NSNumber numberWithFloat: 2*M_PI];
position = CGRectMake(btn_setting_bg.frame.origin.x,btn_setting_bg.frame.origin.y - btn_setting_bg.frame.size.height -13 + btn_settings.frame.size.height, btn_setting_bg.frame.size.width, btn_setting_bg.frame.size.height);
isSubMenuOpened = YES;
}
[UIView animateWithDuration:1.2
delay:0.0
options: UIViewAnimationCurveEaseOut
animations:^{
[btn_setting_bg setFrame:position];
}
completion:^(BOOL finished){
}];
animation.duration = 1.2f;
animation.repeatCount = 1;
[btn_settings.layer addAnimation:animation forKey:#"SpinAnimation"];
if(isSubMenuOpened == YES){
[UIView animateWithDuration:3.5 animations:^(void) {
btn_setting_bg.alpha = 1;
}];
}else{
[UIView animateWithDuration:0.8 animations:^(void) {
btn_setting_bg.alpha = 0;
}];
}