くるくる遊びながらドット絵を作るアプリを作ってみる。

(XcodeのiOS6 iPhone simulatorで試しています。)

ポイント

・キャンバスの回転と発射台の横移動で12×12のマスに色を飛ばす

・ドットをのせるターンテーブルを配置する

・飛ばすドットの色にあわせたボタンをおすことで発射

・UIView convertRectで座標変換してテーブルのsubViewにaddする

サンプルコード

#import “ViewController.h”

#import <QuartzCore/QuartzCore.h>

typedef enum {

    BallStatusStop = 1,

    BallStatusMove,

} BallStatus;

@interface ViewController () {

    NSTimer *timer;

    UIView *canvas;

    UILabel *arrow;

}

@end

@implementation ViewController

– (void)viewDidLoad

{

    [super viewDidLoad];

    

    [self createConsole];

    

    [self createCanvas];

    

    [self start];

}

– (void)createConsole

{

    // ガイド

    arrow = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, 30, 100)];

    arrow.center = CGPointMake(160, 380);

    arrow.text = @”^\n^\n^”;

    arrow.numberOfLines = 0;

    arrow.textAlignment = 1;

    arrow.font = [UIFont fontWithName:@”Chalkduster” size:20];

    arrow.backgroundColor = [UIColor lightGrayColor];

    arrow.layer.cornerRadius = 5.0;

    arrow.userInteractionEnabled = YES;

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

    [arrow addGestureRecognizer:pan];

    [self.view addSubview:arrow];

    

    // カラーボタン

    UIColor *red = [UIColor redColor];

    UIColor *gold = [UIColor colorWithRed:0.8 green:0.7 blue:0.1 alpha:1.0];

    UIColor *skin = [UIColor colorWithRed:0.9 green:0.6 blue:0.2 alpha:1.0];

    NSArray *colors = [NSArray arrayWithObjects:red, skin, gold, nil];

    for (int i=0; i<[colors count]; i++) {

        float x = 100 * i + 60;

        float y = 420;

        UIView *btn = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 50, 50)];

        btn.center = CGPointMake(x,y);

        btn.layer.cornerRadius = 10.0;

        btn.backgroundColor = [colors objectAtIndex:i];

        btn.layer.borderColor = [UIColor grayColor].CGColor;

        btn.layer.borderWidth = 5.0;

        [self.view addSubview:btn];

        

        UITapGestureRecognizer *tap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(shot:)];

        [btn addGestureRecognizer:tap];

    }

}

– (void)move:(UIGestureRecognizer*)gr

{

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

    float d = 320.0 / 12.0;

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

        if (p.x > i * d && p.x < (i + 1) * d) {

            gr.view.center = CGPointMake(d * i, gr.view.center.y);

        }

    }

}

– (void)shot:(UIGestureRecognizer*)gr

{

    float d = 320.0/12.00.1;

    UIView *v = [[UIView alloc] initWithFrame:CGRectMake(150, 400, d, d)];

    v.center = CGPointMake(arrow.center.x, arrow.center.y);

    v.backgroundColor = gr.view.backgroundColor;

    v.tag = BallStatusMove;

    [self.view addSubview:v];

}

– (void)createCanvas

{

    canvas = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 300, 300)];

    canvas.center = CGPointMake(160, 180);

    canvas.layer.cornerRadius = 150.0;

    canvas.layer.borderColor = [UIColor grayColor].CGColor;

    canvas.layer.borderWidth = 1.0;

    [self.view addSubview:canvas];

    

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

    [canvas addGestureRecognizer:pan];

}

– (void)pan:(UIPanGestureRecognizer*)gr

{

    static CGPoint sPoint;

    if (gr.state == UIGestureRecognizerStateBegan) {

        sPoint = [gr locationInView:self.view];

    }

    

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

    if (abs(p.x – sPoint.x) > 50) {

        [UIView animateWithDuration:0.5 animations:^{

            int clockwise = (p.x – sPoint.x) > 0 ? –1 : 1 ;

            canvas.transform = CGAffineTransformRotate(canvas.transform, clockwise * M_PI * 0.5);

        }];

        sPoint = p;

    }

}

– (void)start

{

    timer = [NSTimer scheduledTimerWithTimeInterval:1.0/60.0 target:self selector:@selector(updateDisp:) userInfo:nil repeats:YES];

}

– (void)updateDisp:(NSTimer*)sender

{

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

        if (v.tag == BallStatusMove) {

            v.center = CGPointMake(v.center.x, v.center.y4);

            

            // stop check

            if ([self stopCheck:v]) {

                v.tag = BallStatusStop;

                [canvas addSubview:v];

                v.center = [self.view convertPoint:v.center toView:canvas];

            }

        }

    }

}

– (BOOL)stopCheck:(UIView *)ball

{

    // 真ん中チェック

    if (ball.center.y <= canvas.center.y) {

        ball.center = canvas.center;

        return YES;

    }

    

    // ぶつかりチェック

    for (UIView *v in canvas.subviews) {

        if (v.tag == BallStatusStop && CGRectIntersectsRect([self.view convertRect:ball.frame toView:canvas], v.frame)) {

            // 停止位置を微調整

            CGRect r = [canvas convertRect:v.frame toView:self.view];

            float y = r.origin.y + r.size.height;

            ball.center = CGPointMake(ball.center.x, y + ball.bounds.size.height * 0.5);

            return YES;

        }

    }

    

    return NO;

}

– (void)didReceiveMemoryWarning

{

    [super didReceiveMemoryWarning];

    // Dispose of any resources that can be recreated.

}

@end