第3回「すなばで遊ぼう」です。
(※東京リトルロケット(Tokyo Little Rocket)は
４コマ漫画をプログラムで動かそうという企画です)
元絵はこちら
サンプルコード
(Xcode iOS6 iPhone Simulatorで動かしています。)
@interface OutLineLabel : UILabel
@end
@implementation OutLineLabel
– (void)drawTextInRect:(CGRect)rect
{
CGSize shadowOffset = self.shadowOffset;
UIColor *textColor = self.textColor;
CGContextRef c = UIGraphicsGetCurrentContext();
CGContextSetLineWidth(c, 10);
CGContextSetLineJoin(c, kCGLineJoinRound);
CGContextSetTextDrawingMode(c, kCGTextStroke);
self.textColor = [UIColor whiteColor];
[super drawTextInRect:rect];
CGContextSetTextDrawingMode(c, kCGTextFill);
self.textColor = textColor;
self.shadowOffset = CGSizeMake(0, 0);
[super drawTextInRect:rect];
self.shadowOffset = shadowOffset;
}
@end
#import “ViewController.h”
@interface ViewController (){
UIView *startView;
// 背景
UIImage *back0, *back1;
// papa
UIImage *papa1, *papa2, *papa3;
UIImage *papa_hand1;
// boku
UIImage *boku_body1, *boku2, *boku3;
UIImage *boku_face1, *boku_hand1;
UIImage *boku_face2, *boku_hand2;
// mama
UIImage *sand1, *sand2, *sand3, *sand4, *sand5, *mama1;
// comment
UIImage *comment1, *comment2, *comment3, *comment4, *comment5;
// hole
UIImage *hole;
// View
UIImageView *boku;
UIImageView *papa;
UIImageView *papaHand;
UIImageView *mama;
UIImageView *holeV;
UIImageView *commentV1;
UIImageView *commentV2;
UIImageView *background0;
UIImageView *background1;
}
@end
@implementation ViewController
– (void)viewDidLoad
{
[super viewDidLoad];
[self loadResource];
[self createOpening];
}
– (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event
{
static int lock;
if(lock == 0) {
lock++;
[self showProgram];
}
// CGPoint p = [[touches anyObject] locationInView:self.view];
// NSLog(@”%f, %f”, p.x, p.y);
}
– (void)loadResource
{
boku_body1 = [UIImage imageNamed:@”boku_body_1″];
boku_face1 = [UIImage imageNamed:@”boku_face_1″];
boku_face2 = [UIImage imageNamed:@”boku_face_2″];
boku_hand1 = [UIImage imageNamed:@”boku_hand_1″];
boku_hand2 = [UIImage imageNamed:@”boku_hand_2″];
boku2 = [UIImage imageNamed:@”boku_2″];
boku3 = [UIImage imageNamed:@”boku_3″];
papa1 = [UIImage imageNamed:@”papa_1″];
papa2 = [UIImage imageNamed:@”papa_2″];
papa3 = [UIImage imageNamed:@”papa_3″];
papa_hand1 = [UIImage imageNamed:@”papa_hand_1″];
sand1 = [UIImage imageNamed:@”sand1″];
sand2 = [UIImage imageNamed:@”sand2″];
sand3 = [UIImage imageNamed:@”sand3″];
sand4 = [UIImage imageNamed:@”sand4″];
sand5 = [UIImage imageNamed:@”sand5″];
mama1 = [UIImage imageNamed:@”mama1″];
comment1 = [UIImage imageNamed:@”comment1″];
comment2 = [UIImage imageNamed:@”comment2″];
comment3 = [UIImage imageNamed:@”comment3″];
comment4 = [UIImage imageNamed:@”comment4″];
comment5 = [UIImage imageNamed:@”comment5″];
hole = [UIImage imageNamed:@”hole”];
back0 = [UIImage imageNamed:@”back_0″];
back1 = [UIImage imageNamed:@”back_1″];
}
– (void)showProgram
{
// 幕を上げる
[UIView animateWithDuration:1.0 animations:^{
startView.center = CGPointMake(250, –300);
} completion:^(BOOL finished) {
[startView removeFromSuperview];
}];
// シーン 1
float delay = 0.5;
[self showScene:^{
[self scene1];
} afterDelay:delay];
// シーン 2
delay += 4;
[self showScene:^{
[self scene2];
} afterDelay:delay];
// シーン 3
delay += 6;
[self showScene:^{
[self scene3];
} afterDelay:delay];
// シーン 4
delay += 2;
[self showScene:^{
[self scene4];
} afterDelay:delay];
// end
delay += 2;
[self showScene:^{
[self createEnding];
} afterDelay:delay];
}
– (void)scene1
{
// 背景表示
background0 = [[UIImageView alloc] initWithImage:back0];
background0.frame = self.view.bounds;
[self.view addSubview:background0];
background1 = [[UIImageView alloc] initWithImage:back1];
background1.frame = self.view.bounds;
[self.view addSubview:background1];
// ボクを表示
boku = [[UIImageView alloc] initWithImage:boku_body1];
UIImageView *bhand1 = [[UIImageView alloc] initWithImage:boku_hand1];
UIImageView *bhand2 = [[UIImageView alloc] initWithImage:boku_hand2];
UIImageView *bface1 = [[UIImageView alloc] initWithImage:boku_face1];
UIImageView *bface2 = [[UIImageView alloc] initWithImage:boku_face2];
boku.frame = self.view.bounds;
bhand1.frame = self.view.bounds;
bhand2.frame = self.view.bounds;
bface1.frame = self.view.bounds;
bface2.frame = self.view.bounds;
[boku addSubview:bhand1];
[boku addSubview:bface1];
[boku addSubview:bhand2];
[boku addSubview:bface2];
bhand2.alpha = 0.0;
bface2.alpha = 0.0;
// 吹き出し「きょうはお砂遊び」
commentV1 = [[UIImageView alloc] initWithImage:comment1];
commentV1.frame = self.view.bounds;
commentV1.alpha = 0;
[self.view addSubview:commentV1];
[UIView animateWithDuration:0.5 animations:^{
commentV1.alpha = 1.0;
} completion:^(BOOL finished) {
[UIView animateWithDuration:2.5 animations:^{
commentV1.alpha = 0;
}];
}];
// 手ですなをパンパンする
for (int i=0; i<6; i++) {
[self showScene:^{
bhand1.alpha = i % 2 ? 0.0 : 1.0;
bface1.alpha = i % 2 ? 0.0 : 1.0;
bhand2.alpha = i % 2 ? 1.0 : 0.0;
bface2.alpha = i % 2 ? 1.0 : 0.0;
} afterDelay:0.5 * i + 1.0];
}
[self.view insertSubview:boku atIndex:0];
// パパ
papaHand = [[UIImageView alloc] initWithImage:papa_hand1];
papaHand.frame = self.view.bounds;
[self.view addSubview:papaHand];
papa = [[UIImageView alloc] initWithImage:papa1];
papa.frame = self.view.bounds;
[self.view addSubview:papa];
}
– (void)scene2
{
// 吹き出し「パパトンネルつくって」
commentV1.image = comment2;
[UIView animateWithDuration:0.5 animations:^{
commentV1.alpha = 1.0;
} completion:^(BOOL finished) {
[UIView animateWithDuration:2.5 animations:^{
commentV1.alpha = 0;
}];
}];
// パパ手を動かす
float delay = 1.0;
for (int i=0; i<5; i++) {
[self showScene:^{
[UIView animateWithDuration:0.4 animations:^{
float x = 150;
float y = 50;
float a = i%2 ? M_PI * 0.1 : 0;
papaHand.transform = CGAffineTransformMake(cos(a),sin(a),-sin(a),cos(a),x-x*cos(a)+y*sin(a),y-x*sin(a)-y*cos(a));;
}];
} afterDelay:delay];
delay += 0.6;
}
// 穴を空ける
[self showScene:^{
holeV = [[UIImageView alloc] initWithImage:hole];
holeV.alpha = 0.0;
holeV.frame = self.view.bounds;
[self.view addSubview:holeV];
[UIView animateWithDuration:1.0 animations:^{
holeV.alpha = 1.0;
}];
} afterDelay:delay – 1.0];
// 吹き出し「あれなにかいるぞ」
delay += 0.5;
[self showScene:^{
commentV2 = [[UIImageView alloc] initWithImage:comment3];
commentV2.frame = self.view.bounds;
[self.view addSubview:commentV2];
[UIView animateWithDuration:0.5 animations:^{
commentV2.alpha = 1.0;
} completion:^(BOOL finished) {
[UIView animateWithDuration:2.5 animations:^{
commentV2.alpha = 0;
}];
}];
} afterDelay:delay];
}
– (void)scene3
{
// 吹き出し「うるさーい」
float delay = 0;
[self showScene:^{
commentV1.image = comment4;
[self.view insertSubview:commentV1 aboveSubview:mama];
[UIView animateWithDuration:0.5 animations:^{
commentV1.alpha = 1.0;
} completion:^(BOOL finished) {
[UIView animateWithDuration:2.5 animations:^{
commentV1.alpha = 0;
}];
}];
} afterDelay:delay];
// 砂登場
delay += 0.5;
[self showScene:^{
mama = [[UIImageView alloc] initWithImage:sand1];
mama.frame = self.view.bounds;
[self.view addSubview:mama];
NSArray *sandArr = [NSArray arrayWithObjects:sand2, sand3, sand4, sand5, nil];
for (int i=0; i<[sandArr count]; i++) {
[self showScene:^{
mama.image = [sandArr objectAtIndex:i];
} afterDelay:0.1 * i + 0.1];
}
} afterDelay:delay];
delay += 0.5;
[self showScene:^{
commentV1.image = comment4;
[self.view insertSubview:commentV1 aboveSubview:mama];
[UIView animateWithDuration:0.1 animations:^{
papa.transform = CGAffineTransformMakeTranslation(0, –20.0);
boku.transform = CGAffineTransformMakeTranslation(0, –20.0);
} completion:^(BOOL finished) {
[UIView animateWithDuration:0.1 animations:^{
papa.transform = CGAffineTransformMakeTranslation(0, 0);
boku.transform = CGAffineTransformMakeTranslation(0, 0);
}];
}];
} afterDelay:delay];
}
– (void)scene4
{
// 吹き出し「うお～」
float delay = 0;
[self showScene:^{
commentV1.image = comment5;
[self.view insertSubview:commentV1 aboveSubview:mama];
[UIView animateWithDuration:0.5 animations:^{
commentV1.alpha = 1.0;
} completion:^(BOOL finished) {
[UIView animateWithDuration:2.5 animations:^{
commentV1.alpha = 0;
}];
}];
} afterDelay:delay];
// ママ出現
delay += 0.1;
[self showScene:^{
UIImageView *mamaV2 = [[UIImageView alloc] initWithImage:mama1];
mamaV2.frame = self.view.bounds;
[self.view addSubview:mamaV2];
for (int i=0; i<6; i++) {
[self showScene:^{
mamaV2.alpha = (i % 2) * 1.0;
mama.alpha = (5 – i) * 0.1;
} afterDelay: i* 0.2];
}
} afterDelay:delay];
//パパ ボク
[self showScene:^{
papa.image = papa2;
boku.image = boku2;
for (UIView *v in boku.subviews) {
[v removeFromSuperview];
}
for (int i=0; i<4; i++) {
[self showScene:^{
papa.image = i%2 ? papa2 : papa3;
boku.image = i%2 ? boku2 : boku3;
} afterDelay:i*0.4];
}
[UIView animateWithDuration:2.0 animations:^{
papa.transform = CGAffineTransformMakeTranslation(50, 50);
boku.transform = CGAffineTransformMakeTranslation(-50, –100);
}];
} afterDelay:delay];
}
#pragma – mark TLR Create Helper
– (void)showScene:(void (^)(void))block afterDelay:(NSTimeInterval)delay
{
[self performSelector:@selector(executeBlock:) withObject:block afterDelay:delay];
}
– (void)executeBlock:(void (^)(void))block
{
block();
}
– (UILabel*)createWord:(NSString*)word size:(int)size
{
OutLineLabel *label = [[OutLineLabel alloc] init];
label.font = [UIFont fontWithName:@”Chalkduster” size:30];
label.text = word;
label.backgroundColor = [UIColor clearColor];
[label sizeToFit];
return label;
}
– (void)createOpening
{
UIImage *rocket = [UIImage imageNamed:@”rocket_back.jpg”];
startView = [[UIImageView alloc] initWithImage:rocket];
[self.view addSubview:startView];
UILabel *l = [self createWord:@” Start \n\n Tokyo Little Rocket\n 03″ size:30];
l.numberOfLines = 0;
l.textColor = [UIColor blueColor];
l.frame = CGRectMake(0, 0, 500, 320);
l.center = startView.center;
[startView addSubview:l];
}
– (void)createEnding
{
UIImage *rocket = [UIImage imageNamed:@”rocket_back.jpg”];
UIImageView *endView = [[UIImageView alloc] initWithImage:rocket];
endView.frame = CGRectMake(0, –340, 500, 320);
[self.view addSubview:endView];
UILabel *l = [self createWord:@” End \n\n Tokyo Little Rocket\n 02″ size:30];
l.numberOfLines = 0;
l.textColor = [UIColor redColor];
l.frame = CGRectMake(0, 0, 500, 320);
[endView addSubview:l];
[UIView animateWithDuration:1 animations:^{
endView.center = CGPointMake(250, 160);
}];
}
– (void)didReceiveMemoryWarning
{
[super didReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
}
@end