おっきい四角の中のかずと、ちいさい四角の中のかずをくらべてみよう。大きいと思ったら右、小さいと思ったら左に小さい四角をどんどん投げていこう！という感じの子供向けiPhoneアプリの作り方を書いていきます。
動作イメージ
XcodeからiOS6 iPhone Simulatorで動かすとこんな感じになります。
ポイント
小さい四角を左右に飛ばすために、UISwipeGestureをViewControllerのviewに直接設定。イベントの中で、タッチを開始した座標に小さい四角がある場合、それをSwipeの方向に飛ばすようにしました。
サンプルコード
#import “ViewController.h”
#import <QuartzCore/QuartzCore.h>
#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]
@interface ViewController () {
NSMutableArray *numbers;
UIView *selected;
UILabel *boundary;
int boundaryValue;
}
@end
@implementation ViewController
– (void)viewDidLoad
{
[super viewDidLoad];
self.view.backgroundColor = [self color:0];
[self createArrows];
[self createBoundaryValue];
[self createNumbers];
[self setSwipe];
}
– (void)createArrows
{
float baseRoot2 = 320.0 * (1 – 1 / sqrt(2)) / 2.0;
CGPoint center = self.view.center;
// 大きい
UILabel *arrowLeft = [[UILabel alloc] initWithFrame:CGRectMake(10, center.y, baseRoot2, baseRoot2)];
arrowLeft.text = @”<~”;
arrowLeft.font = [UIFont boldSystemFontOfSize:baseRoot2/2.0];
arrowLeft.textColor = [self color:4];
arrowLeft.backgroundColor = [UIColor clearColor];
UILabel *wordBig = [[UILabel alloc] initWithFrame:CGRectMake(10, center.y – 20, 100, 20)];
wordBig.text = @”小さい“;
wordBig.font = [UIFont systemFontOfSize:15];
wordBig.textColor = [self color:4];
wordBig.backgroundColor = [UIColor clearColor];
[self.view addSubview:arrowLeft];
[self.view addSubview:wordBig];
// 小さい
UILabel *arrowRight = [[UILabel alloc] initWithFrame:CGRectMake(310 – baseRoot2, center.y, baseRoot2, baseRoot2)];
arrowRight.text = @”~>”;
arrowRight.textAlignment = NSTextAlignmentRight;
arrowRight.font = [UIFont boldSystemFontOfSize:baseRoot2/2.0];
arrowRight.textColor = [self color:4];
arrowRight.backgroundColor = [UIColor clearColor];
UILabel *wordSmall = [[UILabel alloc] initWithFrame:CGRectMake(310 – 100, center.y – 20, 100, 20)];
wordSmall.text = @”大きい“;
wordSmall.textAlignment = NSTextAlignmentRight;
wordSmall.font = [UIFont systemFontOfSize:15];
wordSmall.textColor = [self color:4];
wordSmall.backgroundColor = [UIColor clearColor];
[self.view addSubview:arrowRight];
[self.view addSubview:wordSmall];
}
– (void)createBoundaryValue
{
boundaryValue = arc4random() % 9 + 1; // 1 ~ 9
float size = 320/powf(sqrt(2), 2);
boundary = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, size, size)];
boundary.text = [NSString stringWithFormat:@”%d”, boundaryValue];
boundary.textAlignment = NSTextAlignmentCenter;
boundary.textColor = [self color:4];
boundary.font = [UIFont boldSystemFontOfSize:size/sqrt(2)];
boundary.center = CGPointMake(160, 568 – size * 0.8);
boundary.backgroundColor = [UIColor whiteColor];
boundary.layer.borderColor = [self color:4].CGColor;
boundary.layer.borderWidth = 10;
boundary.layer.cornerRadius = 20;
[self.view addSubview:boundary];
}
– (void)createNumbers
{
if (!numbers) {
numbers = [[NSMutableArray alloc] init];
}
for (int i=0; i<4; i++) {
UILabel *number = [[UILabel alloc] initWithFrame:CGRectMake(130, i * 80 + 30, 60, 60)];
int numberWithoutAnser = arc4random() % 8 + 1;
if (numberWithoutAnser >= boundaryValue) {
numberWithoutAnser++;
}
number.text = [NSString stringWithFormat:@”%d”, numberWithoutAnser];
number.textAlignment = NSTextAlignmentCenter;
number.textColor = [self color:arc4random() % 3 + 1];
number.font = [UIFont boldSystemFontOfSize:60.0/sqrt(2)];
number.backgroundColor = [UIColor whiteColor];
number.layer.borderColor = number.textColor.CGColor;
number.layer.borderWidth = 12;
number.layer.cornerRadius = 12;
[self.view addSubview:number];
[numbers addObject:number];
}
}
– (void)setSwipe
{
int directions[] = {
UISwipeGestureRecognizerDirectionRight,
UISwipeGestureRecognizerDirectionLeft,
};
for (int i=0; i<2; i++) {
UISwipeGestureRecognizer *s = [[UISwipeGestureRecognizer alloc] initWithTarget:self action:@selector(swipe:)];
s.direction = directions[i];
[self.view addGestureRecognizer:s];
}
}
– (void)swipe:(UISwipeGestureRecognizer*)gr
{
CGPoint p = [gr locationInView:self.view];
for (UIView *v in numbers) {
if (CGRectContainsPoint(v.frame, p)) {
selected = v;
}
}
if (!selected) {
return;
}
float d;
switch (gr.direction) {
case UISwipeGestureRecognizerDirectionRight:
d = 200;
break;
case UISwipeGestureRecognizerDirectionLeft:
d = –200;
break;
default:
return;
}
int answer = [((UILabel*)selected).text intValue];
if ((answer > boundaryValue && gr.direction == UISwipeGestureRecognizerDirectionRight)
|| (answer < boundaryValue && gr.direction == UISwipeGestureRecognizerDirectionLeft)) {
[UIView animateWithDuration:0.5 animations:^{
selected.transform = CGAffineTransformMakeTranslation(d, 0);
} completion:^(BOOL finished) {
[numbers removeObject:selected];
selected = nil;
// check restart
if ([numbers count] == 0) {
//restart
[boundary removeFromSuperview];
[self createBoundaryValue];
[self createNumbers];
}
}];
} else {
[UIView animateWithDuration:0.5 animations:^{
selected.transform = CGAffineTransformMakeTranslation(d / 2.0, 0);
} completion:^(BOOL finished) {
[UIView animateWithDuration:0.3 animations:^{
selected.transform = CGAffineTransformIdentity;
}];
}];
}
}
– (UIColor*)color:(int)i
{
switch (i) {
case 0:
return UIColorHex(0x00FFD3);
case 1:
return UIColorHex(0xE8FF00);
case 2:
return UIColorHex(0xE80094);
case 3:
return UIColorHex(0x40FF00);
case 4:
return UIColorHex(0x7100ED);
default:
break;
}
return nil;
}
– (void)didReceiveMemoryWarning
{
[super didReceiveMemoryWarning];
}
@end