「こどもあぷり」

基本的なかたちをしっかり書けるようになれば、

もっと楽しくお絵描きができるのでは?

と思い、作ってみました。

ポイント

・車のラベルは絵文字に置き換えてください。

・横向き固定 (Landscape)

・指で丸と四角をなぞる練習になるようにコインを配置する

・指を動かしているあいだは、車の音、コインをとったらチャリーン

サンプルコード

#import “ViewController.h”

#import <QuartzCore/QuartzCore.h>

#import <AVFoundation/AVFoundation.h>

@interface ViewController () {

    UIView *circle;

    UIView *rectangle;

    UIView *line;

    UILabel *car;

    AVAudioPlayer *driveSound;

    AVAudioPlayer *coinSound;

}

@end

@implementation ViewController

– (void)viewDidLoad

{

    [super viewDidLoad];

    

    self.view.backgroundColor = [UIColor colorWithRed:0 green:0.5 blue:0 alpha:1.0];

    

    [self initSound];

    

    [self createFigure];

    

    [self setCoins];

    [self createCar];

}

– (void)initSound

{

    NSString *path = [[NSBundle mainBundle] pathForResource:@”engine” ofType:@”mp3″];

    driveSound = [[AVAudioPlayer alloc] initWithContentsOfURL:[NSURL fileURLWithPath:path] error:nil];

    // repeat

    driveSound.numberOfLoops = –1;

    

    path = [[NSBundle mainBundle] pathForResource:@”coin” ofType:@”mp3″];

    coinSound = [[AVAudioPlayer alloc] initWithContentsOfURL:[NSURL fileURLWithPath:path] error:nil];

}

– (void)createFigure

{

    //

    circle = [[UIView alloc] initWithFrame:CGRectMake(20, 20, 400, 400)];

    circle.backgroundColor = [UIColor clearColor];

    circle.layer.borderWidth = 50.0;

    circle.layer.borderColor = [UIColor whiteColor].CGColor;

    circle.layer.cornerRadius = 200;

    [self.view addSubview:circle];

    

    // 四角

    rectangle = [[UIView alloc] initWithFrame:CGRectMake(570, 320, 400, 400)];

    rectangle.backgroundColor = [UIColor clearColor];

    rectangle.layer.borderWidth = 50.0;

    rectangle.layer.borderColor = [UIColor whiteColor].CGColor;

    [self.view addSubview:rectangle];

    

    // 直線

    line = [[UIView alloc] initWithFrame:CGRectMake(230, 370, 380, 50)];

    line.backgroundColor = [UIColor whiteColor];

    [self.view addSubview:line];

}

– (void)setCoins

{

    // 円にコインを並べる

    float r = circle.bounds.size.width * 0.44;

    for (int i=0; i<20; i++) {

        float th = (M_PI / 10.0) * i;

        float x = circle.center.x + r * cos(th);

        float y = circle.center.y + r * sin(th);

        [self createCoinAtPoint:CGPointMake(x, y)];

    }

    

    // 直線にコインを並べる

    float length = line.bounds.size.width;

    float space = 40.0;

    int count = length / space;

    for (int i=2; i<count; i++) {

        float y = line.center.y;

        float x = line.frame.origin.x + space * i;

        [self createCoinAtPoint:CGPointMake(x, y)];

    }

    

    // 四角にコインを並べる

    float w = rectangle.frame.size.width;

    float h = rectangle.frame.size.height;

    for (int i=0; i<w/space ; i++) {

        for (int j=0; j<h/space; j++) {

            if (i == 0 || j == 0) {

                float x = space * (i + 0.55) + rectangle.frame.origin.x;

                float y = space * (j + 0.55) + rectangle.frame.origin.y;

                [self createCoinAtPoint:CGPointMake(x, y)];

            } else if (i == w/space – 1 || j == h/space – 1) {

                float x = space * (i + 0.45) + rectangle.frame.origin.x;

                float y = space * (j + 0.45) + rectangle.frame.origin.y;

                [self createCoinAtPoint:CGPointMake(x, y)];

            }

        }

    }

}

– (void)createCoinAtPoint:(CGPoint)p

{

    UIColor *red = [UIColor colorWithRed:0.8 green:0 blue:0 alpha:1.0];

    UIColor *green = [UIColor colorWithRed:0 green:0.8 blue:0 alpha:1.0];

    UIColor *blue = [UIColor colorWithRed:0 green:0 blue:0.8 alpha:1.0];

    UIColor *yellow = [UIColor colorWithRed:0.8 green:0.8 blue:0 alpha:1.0];

    NSArray *colors = [NSArray arrayWithObjects:red, green, blue, yellow, nil];

    

    int colorIndex = arc4random() % [colors count];

    

    int dx = arc4random() % 105;

    int dy = arc4random() % 105;

    

    UIView *coin = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 20, 20)];

    coin.center = CGPointMake(p.x + dx, p.y + dy);

    coin.backgroundColor = [colors objectAtIndex:colorIndex];

    coin.layer.cornerRadius = 10.0;

    [self.view addSubview:coin];

    

    coin.tag = 1;

}

– (void)createCar

{

    car = [[UILabel alloc] init];

    car.text = @”;

    car.center = circle.center;

    car.transform = CGAffineTransformMakeScale(4, 4);

    car.backgroundColor = [UIColor clearColor];

    [car sizeToFit];

    [self.view addSubview:car];

    car.userInteractionEnabled = YES;

    

    UIPanGestureRecognizer *pan = [[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(pan:)];

    [car addGestureRecognizer:pan];

}

– (void)pan:(UIPanGestureRecognizer*)pan

{

    if (pan.state == UIGestureRecognizerStateBegan) {

        [driveSound play];

    }

    

    if (pan.state == UIGestureRecognizerStateEnded) {

        [driveSound pause];

    }

    

    CGPoint p = [pan locationInView:self.view];

    car.center = p;

    

    // 通ったところにマーク

    UIView *mark = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 5, 5)];

    mark.center = p;

    mark.backgroundColor = [UIColor blackColor];

    [self.view addSubview:mark];

    

    // コインをとったかチェック

    for (UIView *v in self.view.subviews) {

        if (v.tag == 1 && CGRectIntersectsRect(v.frame, car.frame)) {

            v.tag = 2;

            coinSound.currentTime = 0;

            [coinSound play];

            [UIView animateWithDuration:1.0 animations:^{

                v.transform = CGAffineTransformMakeTranslation(0, –100);

            } completion:^(BOOL finished) {

                [UIView animateWithDuration:0.5 animations:^{

                    v.alpha = 0;

                } completion:^(BOOL finished) {

                    [v removeFromSuperview];

                }];

            }];

        }

    }

}

– (void)didReceiveMemoryWarning

{

    [super didReceiveMemoryWarning];

    [self clear];

}

– (void)clear

{

    circle = nil;

    rectangle = nil;

    line = nil;

    car = nil;

    driveSound = nil;

    coinSound = nil;

}

// for ios5

– (void)viewDidUnload

{

    [self clear];

}

– (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)toInterfaceOrientation

{

    return UIInterfaceOrientationIsLandscape(toInterfaceOrientation);

}

@end