iPhone色形表

表の縦に「まる、しかく、さんかく」の形を、横に「赤、緑、青」の色を並べた表を埋めてみるiPhoneアプリを描いてみます。

動作イメージ
XcodeからiOS6 iPhone Simulatorで動かすとこんな感じになります。

サンプルコード

#import “ViewController.h”

#import <QuartzCore/QuartzCore.h>

@interface ViewController ()

@end

@implementation ViewController

– (void)viewDidLoad

{

    [super viewDidLoad];

    

    self.view.backgroundColor = [UIColor brownColor];

    

    [self drawChart];

    

    [self createFigures];

}

-(void)drawChart

{

    UIView *base = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 320, 330)];

    base.backgroundColor = [self color:4];

    int colorCount = 0;

    int markCount = 0;

    

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

        float x = (i % 4) * 80;

        float y = (i / 4) * 80;

        

        BOOL firstRow = (i / 4 == 0);

        BOOL firstCol = (i % 4 == 0);

        

        if (firstCol && firstRow) {

            // none

        } else if (!firstCol && firstRow) {

            // color

            UIView *color = [[UIView alloc] initWithFrame:CGRectMake(x+20, y + 15, 40, 40)];

            color.backgroundColor = [self color:colorCount];

            color.layer.borderWidth = 2;

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

            [base addSubview:color];

            

            colorCount++;

        } else if(firstCol && !firstRow) {

            // mark

            UIView *mark;

            switch (markCount) {

                case 0:

                {

                    mark = [self createCircle:[UIColor whiteColor]];

                    mark.center = CGPointMake(40, 120);

                    [base addSubview:mark];

                }

                    break;

                    

                case 1:

                {

                    mark = [self createDia:[UIColor whiteColor]];

                    mark.center = CGPointMake(40, 200);

                    [base addSubview:mark];

                }

                    break;

                    

                case 2:

                {

                    mark = [self createTriangle:[UIColor whiteColor]];

                    mark.center = CGPointMake(40, 280);

                    [base addSubview:mark];

                }

                    break;

                    

                default:

                    break;

            }

            

            markCount++;

            

        } else {

            UIView *panel = [[UIView alloc] initWithFrame:CGRectMake(x, y + 5, 75, 75)];

            panel.backgroundColor = [self color:3];

            [base addSubview:panel];

        }

    }

    

    [self.view addSubview:base];

}

– (UIView*)createCircle:(UIColor*)color

{

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

    circle.backgroundColor = [UIColor clearColor];

    circle.layer.cornerRadius = 25;

    circle.layer.borderWidth = 6;

    circle.layer.borderColor = color.CGColor;    

    return circle;

}

– (UIView*)createDia:(UIColor*)color

{

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

    dia.backgroundColor = [UIColor clearColor];

    dia.layer.borderWidth = 6;

    dia.layer.borderColor = color.CGColor;

    dia.transform = CGAffineTransformMakeRotation(M_PI/2.0);

    return dia;

}

– (UIView*)createTriangle:(UIColor*)color

{

    UIBezierPath *path = [UIBezierPath bezierPath];

    [path moveToPoint:CGPointMake(25, 0)];

    [path addLineToPoint:CGPointMake(50, 50)];

    [path addLineToPoint:CGPointMake(0, 50)];

    [path closePath];

    

    CAShapeLayer *sl = [CAShapeLayer layer];

    sl.fillColor = [UIColor clearColor].CGColor;

    sl.strokeColor = color.CGColor;

    sl.lineWidth = 6;

    sl.path = path.CGPath;

    

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

    [triangle.layer addSublayer:sl];

    return triangle;

}

– (void)createFigures

{

    NSArray *cols = @[@0, @1, @2, @0, @1, @2, @0, @1, @2];

    

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

        UIView *mark;

        switch (i / 3) {

            case 0:

            {

                mark = [self createCircle:[self color:[cols[i] intValue]]];

                mark.center = CGPointMake(arc4random() % 240 + 50, arc4random() % 150 + 370);

                [self.view addSubview:mark];

            }

                break;

                

            case 1:

            {

                mark = [self createDia:[self color:[cols[i] intValue]]];

                mark.center = CGPointMake(arc4random() % 240 + 50, arc4random() % 150 + 370);

                [self.view addSubview:mark];

            }

                break;

                

            case 2:

            {

                mark = [self createTriangle:[self color:[cols[i] intValue]]];

                mark.center = CGPointMake(arc4random() % 240 + 50, arc4random() % 150 + 370);

                [self.view addSubview:mark];

            }

                break;

                

            default:

                break;

        }

        

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

        [mark addGestureRecognizer:pan];

    }

}

– (void)pan:(UIPanGestureRecognizer*)gr

{

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

    gr.view.center = p;

}

#define UIColorHex(rgbValue) [UIColor colorWithRed:((float)((rgbValue & 0xFF0000) >> 16))/255.0 green:((float)((rgbValue & 0xFF00) >> 8))/255.0 blue:((float)(rgbValue & 0xFF))/255.0 alpha:1.0]

– (UIColor*)color:(int)i

{

    switch (i) {

        case 0:

            return UIColorHex(0xDE3961);

        case 1:

            return UIColorHex(0xA4E670);

        case 2:

            return UIColorHex(0x00ADA7);

        case 3:

            return UIColorHex(0xFFFFDC);

        case 4:

            return UIColorHex(0xB3EECC);

        default:

            break;

    }

    return nil;

}

– (void)didReceiveMemoryWarning

{

    [super didReceiveMemoryWarning];

    // Dispose of any resources that can be recreated.

}

@end