最近猫ブームが非常に盛り上がっておりますね。そこに便乗したアプリを開発して一発稼いでみたい！！というゲスな極みとして現在製作途中のAR猫転送装置(仮)をご紹介いたします。
◼︎AR猫転送装置(仮)について
アプリを起動するとカメラ越しの映像が表示されて、画面に円をなぞっていくと、そこにかわいい猫が転送されてくるアプリです。
◼︎出来上がり動画
◼︎画面キャプチャ
画面をなぞっていくと。。。。
なんと！！
なぞった円の中に猫が転送されてきます！！！
猫が転送される瞬間の動画はgif画像に出力をおこない、
そのうちSNSなどに投稿ができるように考えております。
自分の飼っている猫を転送できるのもいいかもしれませんね。。。
ARなので転送場所は問いません。
・オフィスの中で
・東京スカイツリーの頂上で
なぞった場所が転送場所です。
◼︎猫転送装置とは？？
そもそも猫転送装置とは何でしょうか？
私はどちらかというと犬派なのでわかりませんが、猫というのは狭いところが好きな傾向にあるようです。
テープで床に円があると猫が円の中に入っていくという習性を利用したものを猫転送装置というのだそうです。
AR猫転送装置は床だけでなく、空にでも転送が可能です！！
◼︎開発者向けの実装方法
さてこの「AR猫転送装置」のiOSアプリ実装方法についてですが、大きく３つあります。
①カメラからの入力情報を画面上に表示する
②１の画面の上になぞるようのViewを用意する
③なぞり完了後１と２のViewを合体させgifに出力する
①こちらについては以前の私の投稿に似たような内容がありますので、下記URLをみてください。
http://bitwave.showcase-tv.com/%E8%BA%AB%E8%BF%91%E3%81%AA%E3%82%82%E3%81%AE%E3%81%A7iot%EF%BC%81%E4%BD%BF%E3%82%8F%E3%81%AA%E3%81%8F%E3%81%AA%E3%81%A3%E3%81%9Fiphone%E3%81%A7%E9%A1%94%E8%AA%8D%E8%AD%98/
②UIVIewのタッチ検出機能として、３つあります。
touchesBegan なぞり開始（タッチ開始）
touchesMoved なぞり中（タッチ中）
touchesEnded なぞり終了（タッチ終了）
なぞっている箇所の実装はUIBezirePathというものを使います。
|
1 2 3 4 5 |
touchesBegan UITouch *touch = [touches anyObject]; self.currentPath = [UIBezierPath bezierPath]; currentPath.lineWidth = 6.0; [currentPath moveToPoint:[touch locationInView:self]]; |
タッチ中はどんどんこのBezirePathにaddしていきます。
|
1 2 3 |
touchesMoved UITouch *touch = [touches anyObject]; [self.currentPath addLineToPoint:[touch locationInView:self]]; |
タッチが終了したらBezirePathをクローズして、BezirePathの開始から終了までの形状の中に猫用のUIImageViewをaddSubViewします。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
touchesEnded [self.currentPath closePath]; UIImageView* img = [[UIImageView alloc]init]; UIImage* image = [UIImage imageNamed:@"nekos"]; [img setImage:image]; [img setContentMode:UIViewContentModeScaleAspectFit]; CGRect frame = self.currentPath.bounds; [img setFrame:CGRectMake(frame.origin.x, frame.origin.y, frame.size.width,frame.size.height)]; [img setTag:1]; [img setAlpha:0]; [self addSubview:img]; |
③gif画像への出力は「カメラ入力VIew」と「なぞりVIew」を足したimageを
配列にaddしていきます。
２つのViewを足したキャプチャ画像の生成(画面全体をキャプチャしています。)
|
1 2 3 4 5 6 7 8 9 |
UIWindow *window = [[UIApplication sharedApplication] keyWindow]; UIGraphicsBeginImageContextWithOptions(window.bounds.size, NO, 0.0f); CGContextRef context = UIGraphicsGetCurrentContext(); for (UIWindow *aWindow in [[UIApplication sharedApplication] windows]) { [aWindow.layer renderInContext:context]; } UIImage *capturedImage = UIGraphicsGetImageFromCurrentImageContext(); UIGraphicsEndImageContext(); [gifImages addObject:capturedImage]; |
これを0.5秒間隔で取得しております。
完了後にgif画像に出力です。
実装方法は長いため省略。
細かい部分は除き、ざっとこんな感じで作っております！！
猫好きの皆様のご要望お待ちしております！！！
