ソフトバンク・au・ドコモの方は、公式のオンラインショップを利用すれば頭金不要で通常のショップよりお得に購入できます。
今年はVR元年。
そしてPlayStation®VRの発売。どこもかしこもVRの話題で持ちきりです。
しかし、私はVR端末を持っていないので、残念ながら話題についていくことができません。
「えっ、ricemanさんはエンジニアなのにVRのこと知らないんスカ！？」
そんなことを言われる日もそう遠くはないでしょう。
私も技術者の端くれ、本当のことは知らなくとも、せめて雰囲気だけでも“VRを知っている”風を醸し出したいんです。
そんな自暴自棄になろうとしていた私が出会ったのが、この『Google Mobile Vision』でした。
＜参考ページ「Mobile Vision公式サイト」＞
『Mobile Vision』の３大機能
『Mobile Vision』には大きく３つの機能があるようです。
①顔認識
②バーコード認識
③文字認識
「①顔認識」はリアルタイムで認識をしてくれるようです。早速、デモをiOSに組み込んでみましょう。
Macをお持ちの方でXcodeやCocoaPodも入っている方は、下記のコマンドを「ターミナル」などで打てば、簡単にアプリにインストールができます。ぜひ、お試しください。
|
1 |
pod try GoogleMobileVision |
インストールしたデモを早速試してみます。
なんと、フィギュアのスティーブさんの顔も、しっかりトラッキングしてくれるではないですか！
Apple純正のライブラリーでも同様に顔認識ができるのですが、あくまで顔全体の矩形のみしか取得できません。しかし、『Mobile Vision』では目の位置や耳の位置まで追ってくれます。まさに驚きです。
さて、本番はここから。
せっかく耳の位置や目の位置が取得できるのですから、この距離感をベースに目元にVRを装着させてあげましょう。スティーブさんがソニー製品を装着する日が来るなんて！
前記の通り、ホンモノのPlayStation®VRは持っておりませんので、本家サイトから画像を拝借しましょう。
よりリアルな装着感を実現するために、拝借した画像はなんとか画像ソフトなどで背景透過にしてくださいね！！
加工画像を先ほど作成したデモアプリにインポートしてください。
デモアプリのコードもそのままで、最後の方に数行付け足してみます。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 |
if(face.hasLeftEarPosition && face.hasRightEarPosition && face.hasLeftEyePosition && face.hasRightEyePosition){ CGPoint leftEarPos = [self scaledPoint:face.leftEarPosition xScale:xScale yScale:yScale offset:videoBox.origin]; CGPoint rightEarPos = [self scaledPoint:face.rightEarPosition xScale:xScale yScale:yScale offset:videoBox.origin]; CGPoint leftEyePos = [self scaledPoint:face.leftEyePosition xScale:xScale yScale:yScale offset:videoBox.origin]; CGPoint rightEyePos = [self scaledPoint:face.rightEyePosition xScale:xScale yScale:yScale offset:videoBox.origin]; CGFloat width = rightEarPos.x - leftEarPos.x; UIImage *img = [UIImage imageNamed:@"vr"]; UIImageView *imgView = [[UIImageView alloc]initWithImage:img]; imgView.frame = CGRectMake(0, 0, width, width); imgView.center = CGPointMake((rightEyePos.x + leftEyePos.x) / 2, (rightEyePos.y + leftEyePos.y)/2);<!--nextpage--> imgView.contentMode = UIViewContentModeScaleAspectFit; [self.overlayView addSubview:imgView]; } |
プログラムの流れを簡単に説明すると、以下のような感じになります。
①すべての顔パーツが揃っていることを確認
②それぞれのパーツの位置を確認
③左耳と右耳の位置から横幅を計算
④画像を呼び出してサイズを指定
⑤画像の中央位置をお互いの目の中央あたりに
⑥画像を比率を変えずに、③の幅MAXまで表示
（※今回は顔の傾きとかを考慮していませんが、実際には取得できます！）
それでは完成形をご覧ください！
これでいつでもVRしてますって言えますぜ！！
チャオ！！