こぶたのしっぽ チョンボリチョロリ チョンボリチョロリチョンボリチョロリ こぶたのしっぽチョンボリチョロリ どうしてチョロリどうしてなのかだれもしらない だけどこぶたのしっぽチョンボリチョロリ チョンボリチョロリチョンボリチョロリ こぶたのしっぽチョンボリチョロリ おもしろいね という歌を背景に、「しっぽが隠れたこぶた」をさがしてタップするiPhoneアプリの作成方法を書いてみます。
動作イメージ
XcodeからiOS6 iPhone Simulatorで動かすとこんな感じになります。
ポイント
こぶたの配置は２５個のCGPointをグリッド状に配置、その上にランダムにこぶたが表示されるようにしました。しっぽがかくれたこぶたをタッチされたら、レベルを上げて表示するこぶたの数を増やしていきます。あとは、童謡「おうまはみんな」の歌の２番があまりに印象的なので、UILabelに歌詞をいれ、Rotationをかけたものを背景として表示しています。
サンプルコード
#import “ViewController.h”
@interface ViewController () {
int level;
CGPoint grid[25];
BOOL ready;
}
@end
@implementation ViewController
– (void)viewDidLoad
{
[super viewDidLoad];
self.view.backgroundColor = [UIColor yellowColor];
[self createBack];
level = 1;
ready = YES;
[self createGrid];
[self pigMapping];
}
– (void)createBack
{
NSString *lyrics = @”こぶたのしっぽチョンボリチョロリ“
” チョンボリチョロリチョンボリチョロリ“
“こぶたのしっぽチョンボリチョロリ“
“どうしてチョロリどうしてなのかだれもしらない“
“だけどこぶたのしっぽチョンボリチョロリ“
“チョンボリチョロリチョンボリチョロリ“
“こぶたのしっぽチョンボリチョロリ おもしろいね “;
UILabel *words = [[UILabel alloc] initWithFrame:CGRectMake(-100, 150, 700, 300)];
words.text = [@”” stringByPaddingToLength:1000 withString: lyrics startingAtIndex:0];
words.numberOfLines = 0;
words.backgroundColor = [UIColor clearColor];
words.font = [UIFont systemFontOfSize:12];
words.textColor = [UIColor greenColor];
words.transform = CGAffineTransformMakeRotation(M_PI * 0.3);
[self.view addSubview:words];
}
– (void)createGrid
{
float w = 320.0 / 6.0;
for (int i=0; i<25; i++) {
float x = (i%5) * w + w;
float y = (i/5) * w * 1.618 + w * 1.618;
grid[i] = CGPointMake(x, y);
}
}
– (void)pigMapping
{
int pigCount = level * 2;
UIImage *pig = [UIImage imageNamed:@”pig”];
UIImage *pigNoTail = [UIImage imageNamed:@”pigNoTail”];
NSMutableArray *choices = [NSMutableArray array];
for(int i=0; i<25; i++) {
[choices addObject:@(i)];
}
int noTailNumber = arc4random() % level;
for (int i=0; i<pigCount; i++) {
int rand = arc4random() % [choices count];
int choice = [[choices objectAtIndex:rand] intValue];
UIImageView *pigV;
if (i != noTailNumber)
{
pigV = [[UIImageView alloc] initWithImage:pig];
pigV.frame = CGRectMake(0, 0, pig.size.width/3.0, pig.size.height/3.0);
pigV.userInteractionEnabled = YES;
UITapGestureRecognizer *tap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(missPig:)];
[pigV addGestureRecognizer:tap];
}
else
{
pigV = [[UIImageView alloc] initWithImage:pigNoTail];
pigV.frame = CGRectMake(0, 0, pigNoTail.size.width/3.0, pigNoTail.size.height/3.0);
pigV.userInteractionEnabled = YES;
UITapGestureRecognizer *tap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(okPig:)];
[pigV addGestureRecognizer:tap];
}
pigV.backgroundColor = [UIColor clearColor];
pigV.center = grid[choice];
[choices removeObjectAtIndex:rand];
[self.view addSubview:pigV];
}
}
– (void)missPig:(UITapGestureRecognizer*)gr
{
CGAffineTransform t = gr.view.transform;
[UIView animateWithDuration:0.3 animations:^{
gr.view.transform = CGAffineTransformRotate(t, M_PI*0.2);
} completion:^(BOOL finished) {
[UIView animateWithDuration:0.3 animations:^{
gr.view.transform = t;
}];
}];
}
– (void)okPig:(UITapGestureRecognizer*)gr
{
if (ready) {
ready = NO;
int i=0;
for (UIView *v in self.view.subviews) {
if ([v isKindOfClass:[UIImageView class]]) {
[self performSelector:@selector(escapePig:) withObject:v afterDelay:i * 0.1];
i++;
}
}
[self performSelector:@selector(nextLevel) withObject:nil afterDelay:(i + 2) * 0.1];
}
}
– (void)escapePig:(UIView*)pig
{
[UIView animateWithDuration:0.3 animations:^{
pig.transform = CGAffineTransformTranslate(pig.transform, 320, 500);
} completion:^(BOOL finished) {
[pig removeFromSuperview];
}];
}
– (void)nextLevel
{
// restart
if (level < 12) {
level +=1;
}
[self pigMapping];
ready = YES;
}
– (void)didReceiveMemoryWarning
{
[super didReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
}
@end