ラケットにガットをアニメーション表示するiPhoneアプリのサンプルコードを描いてみます。
#import “ViewController.h”
@interface ViewController ()
@property (nonatomic, weak) CAShapeLayer *racketFrame;
@end
@implementation ViewController
– (void)viewDidLoad
{
[super viewDidLoad];
self.view.backgroundColor = [UIColor colorWithRed:0.4 green:0.8 blue:0.4 alpha:1];
[self createRacket];
[self createButton];
}
– (void)createRacket
{
CALayer *racket = [CALayer layer];
racket.position = CGPointMake(190, 200);
[self.view.layer addSublayer:racket];
UIBezierPath *path = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(-100, –80, 200, 160)];
CAShapeLayer *l = [CAShapeLayer layer];
l.path = path.CGPath;
l.fillColor = [UIColor clearColor].CGColor;
l.strokeColor = [UIColor blackColor].CGColor;
l.lineWidth = 10;
[racket addSublayer:l];
self.racketFrame = l;
CALayer *grip = [CALayer layer];
grip.frame = CGRectMake(0, 0, 100, 20);
grip.position = CGPointMake(-140, 0);
grip.backgroundColor = [UIColor blackColor].CGColor;
[racket addSublayer:grip];
racket.transform = CATransform3DMakeRotation(-M_PI/4.0, 0, 0, 1);
}
– (void)createButton
{
UIButton *btn = [UIButton buttonWithType:UIButtonTypeCustom];
btn.frame = CGRectMake(0, 0, 200, 50);
[btn setTitle:@”stringing” forState:UIControlStateNormal];
[btn setBackgroundImage:[self imageWithColor:[UIColor darkGrayColor]] forState:UIControlStateNormal];
btn.center = CGPointMake(160, CGRectGetMaxY(self.view.bounds) – 80);
[self.view addSubview:btn];
[btn addTarget:self action:@selector(stringing) forControlEvents:UIControlEventTouchUpInside];
}
– (UIImage *)imageWithColor:(UIColor *)color
{
CGRect rect = CGRectMake(0, 0, 1, 1);
UIGraphicsBeginImageContext(rect.size);
CGContextRef ctx = UIGraphicsGetCurrentContext();
CGContextSetFillColorWithColor(ctx, color.CGColor);
CGContextFillRect(ctx, rect);
UIImage *img = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return img;
}
– (void)stringing
{
UIBezierPath *path = [UIBezierPath bezierPath];
CGSize size = CGSizeMake(200, 160);
float dw = size.width / 30.0;
float dh = size.height / 20.0;
for (int i=0; i<25; i++) {
if (i<=10) {
[path moveToPoint:CGPointMake(size.width/2.0, i * dh)];
[path addLineToPoint:CGPointMake(-size.width/2.0, i * dh)];
[path moveToPoint:CGPointMake(size.width/2.0, -i * dh)];
[path addLineToPoint:CGPointMake(-size.width/2.0, -i * dh)];
} else {
[path moveToPoint:CGPointMake((i-11)*dw, size.height/2.0)];
[path addLineToPoint:CGPointMake((i-11)*dw, -size.height/2.0)];
[path moveToPoint:CGPointMake(-(i-11)*dw, size.height/2.0)];
[path addLineToPoint:CGPointMake(-(i-11)*dw, -size.height/2.0)];
}
}
CAShapeLayer *string = [CAShapeLayer layer];
string.path = path.CGPath;
string.fillColor = [UIColor clearColor].CGColor;
string.strokeColor = [UIColor colorWithWhite:0.2 alpha:1].CGColor;
string.lineWidth = 1.5;
CAShapeLayer *mask = [CAShapeLayer layer];
mask.path = self.racketFrame.path;
mask.transform = CATransform3DMakeScale(0.95, 0.95, 1);
string.mask = mask;
[self.racketFrame addSublayer:string];
CABasicAnimation *a = [CABasicAnimation animationWithKeyPath:@”strokeEnd”];
a.fromValue = @0;
a.toValue = @1;
a.duration = 3.0;
[string addAnimation:a forKey:nil];
CAShapeLayer *stringMask = [CAShapeLayer layer];
stringMask.path = path.CGPath;
stringMask.fillColor = [UIColor clearColor].CGColor;
stringMask.strokeColor = [UIColor colorWithWhite:0.2 alpha:1].CGColor;
stringMask.lineWidth = 1.5;
CALayer *ball = [CALayer layer];
ball.frame = CGRectMake(-30, –30, 60, 60);
ball.cornerRadius = 30;
ball.backgroundColor = [UIColor yellowColor].CGColor;
ball.mask = stringMask;
[self.racketFrame addSublayer:ball];
[stringMask addAnimation:a forKey:nil];
}
– (void)didReceiveMemoryWarning
{
[super didReceiveMemoryWarning];
}
@end