2013年2月24日日曜日

iOSで星を描く方法

12ホワイトボード アプリで☆を書けるようにしたのですが、その方法をご紹介します。


+ (void)addStarPath:(CGContextRef)context rect:(CGRect)rect {
    CGFloat degreeDiff = 360.0 / 10.0;
    CGFloat degree = 90;
    CGFloat radius = rect.size.width / 2.0;
    
    CGFloat x = rect.origin.x + radius;
    CGFloat y = rect.origin.y + radius;
    
    for (int i = 0; i <= 10; i++) {
        CGFloat radians = degree * (M_PI / 180.0);
        if ( i % 2 == 0) {
            CGFloat pointX = x + cos(radians) * radius;
            CGFloat pointY = y - sin(radians) * radius;
            if (i == 0) {
                CGContextMoveToPoint(context, pointX, pointY);
            } else {
                CGContextAddLineToPoint(context, pointX, pointY);
            }
        } else {
            CGFloat pointX = x + cos(radians) * (radius / 2.0);
            CGFloat pointY = y - sin(radians) * (radius / 2.0);
            CGContextAddLineToPoint(context, pointX, pointY);
        }
        degree -= degreeDiff;
    }
    CGContextClosePath(context);
}


赤丸の点 5つと、青丸の点 5つ = 合計10個の点 を結んで星を描きますので、360を10で割って、順々にポイントを打っています。
赤丸は円周の位置でポイント、青丸は半分の円周の位置でポイントしています。

円周に沿って星の点を均等にポイントして描いていますが、その際使用するのが、あのなつかしの サイン、コサイン。

習ったのはたしか高校1年でしたっけ?
習った当初は、「こんなの覚えても生活に使わないから意味ないわ」とか思っていましたが、ちゃんと使うタイミングがくるもんですねー。


サイン、コサインの関数は用意されていますが、引数に渡せるのは 角度ではなくて、ラジアン 単位。
ラジアン。名前は覚えているけど、内容なんてすっかり忘れておりました。

上記のコードはパスを描いているだけですので、
CGContextFillPath(context); などで塗りつぶすなり、線をかくなりの処理を入れてくださいね。


• • •