【UE4】OpenCVを使ってWebカメラの映像を出力

# 補足
本記事は過去(2016-07-08)にブロマガで書いた記事の移植です。

<h1>はじめに</h1>
<hr>8ヵ月ぶりの更新！！！！<br>
学業等が忙しくて滞っちゃいました。<br>
<br>
UE4でOpenCVを使ってWebカメラの映像を出力してみます。<br>
英語の情報がほとんどで、日本語の情報があまり出回っていなかったのでまとめてみました。<br>
<h1>手順</h1>
<hr><h2>1. プラグイン導入</h2>
<a href="https://www.google.com/url?q=https%3A%2F%2Fwiki.unrealengine.com%2FIntegrating_OpenCV_Into_Unreal_Engine_4&amp;sa=D&amp;sntz=1&amp;usg=AFrqEzf7n6yUHnS7wbkzDAbQg0OpACh-Vw" style="line-height:1.6;">UE4 OpenCV Plugin</a><span style="line-height:1.6;"> からPluginを落とす。<br>
<br>
<img data-ubi="157629" src="http://bmimg.nicovideo.jp/image/ch2559076/157629/de57ab9b5b4b2c286052558e081402a216c4ebb1.png" height="400" alt=""><br>
</span><br>
<span style="line-height:1.6;color:rgb(255,0,0);">UE4.9</span><span style="line-height:1.6;">の</span><span style="line-height:1.6;color:rgb(255,0,0);">C++</span><span style="line-height:1.6;">でプロジェクトを作成。</span><br>
<span style="line-height:1.6;">(他のVerで使いたい場合は自分で再コンパイルが必要)<br>
<br>
<img data-ubi="157630" src="http://bmimg.nicovideo.jp/image/ch2559076/157630/6209591f619f8a2873f6f5ccf3704f007b01da88.png" width="680" alt=""><br>
</span><br>
<span style="line-height:1.6;">落としたPluginの中身をプロジェクトディレクトリにコピー。<br>
<br>
<img data-ubi="157946" src="http://bmimg.nicovideo.jp/image/ch2559076/157946/2dae9278a9ee0d33d8d6dd26086c7ada4f325ca0.png" width="680" alt=""><br>
<br>
<img data-ubi="157947" src="http://bmimg.nicovideo.jp/image/ch2559076/157947/c05d9f1dcac3c79c11adadfeb55a5ceed4cf1861.png" width="680" alt=""><br>
</span><br>
<span style="line-height:1.6;">ソースコードのBuild.csを書き換える。<br>
</span><br>
<img data-ubi="157633" src="http://bmimg.nicovideo.jp/image/ch2559076/157633/b4ea1d6a7c857fd69cb424182e8d15174368217d.png" width="680" alt=""><br>
<br>
<h2>2. ソースコードを書く</h2>
<span style="line-height:1.6;">C++クラスを追加。<br>
<br>
<img data-ubi="157634" src="http://bmimg.nicovideo.jp/image/ch2559076/157634/1843d673476cd5986daedd33bc462097df8b8fec.png" height="400" alt=""><br>
</span><br>
<span style="line-height:1.6;">親はActor。</span><br>
<span style="line-height:1.6;">publicにして作る。<br>
<br>
<img data-ubi="157636" src="http://bmimg.nicovideo.jp/image/ch2559076/157636/e15e3a7192f1fa0145b54721102c6f42de217c3c.png" height="400" alt=""><br>
</span><br>
<span style="line-height:1.6;">コードを書く。<br>
</span>Plugin配布サイトのAdding a WebcamReader Classの部分にヘッダーとソースがあります。<br>
<span style="line-height:1.6;">エディタに戻ってコンパイル。</span><br>
<h2>3. Blueprintを書く</h2>
<span style="line-height:1.6;">Blueprintを作成。</span><br>
<span style="line-height:1.6;">先ほど作ったWebcamReaderを親クラスに。</span><br>
<span style="line-height:1.6;">名前はBP_WebcamBillboard。<br>
<br>
<img data-ubi="157637" src="http://bmimg.nicovideo.jp/image/ch2559076/157637/b20a6c206c9c28b9b2c9f41d1963b3f8200c2556.png" height="400" alt=""><br>
</span><br>
<span style="line-height:1.6;">コンポーネントにCubeを追加。<br>
<br>
<img data-ubi="157638" src="http://bmimg.nicovideo.jp/image/ch2559076/157638/28432151ae3d114429521651d2273b1bd87fd467.png" height="400" alt=""><br>
</span><br>
<span style="line-height:1.6;">ノードを組む。</span><br>
<span style="line-height:1.6;">(画像は参照の線が重なるのを避けるため、あえてノードをずらしてます)<br>
<br>
<img data-ubi="157635" src="http://bmimg.nicovideo.jp/image/ch2559076/157635/ed837324f0153e1edc12a7bc20c4398cf50e5050.png" height="400" alt=""><br>
</span><br>
<h2>4. Materialを作る</h2>
<span style="line-height:1.6;">マテリアルを作成。</span><span style="line-height:1.6;"><br>
</span><span style="line-height:1.6;">名前はM_Webcam。</span><span style="line-height:1.6;"><br>
</span><span style="line-height:1.6;">シェーディングモデルをUnlitに変更。</span><span style="line-height:1.6;"><br>
</span><span style="line-height:1.6;">適当なテクスチャを入れる。</span><span style="line-height:1.6;"><br>
</span><span style="line-height:1.6;">T + LMBでも追加できる。<br>
<br>
<img data-ubi="157639" src="http://bmimg.nicovideo.jp/image/ch2559076/157639/2b15b51dea258af06a3d4403b18b22e548d4f7ab.png" height="400" alt=""><br>
</span><span style="line-height:1.6;"><br>
</span><span style="line-height:1.6;">追加したテクスチャを右クリックしパラメータに変換。<br>
<br>
<img data-ubi="157640" src="http://bmimg.nicovideo.jp/image/ch2559076/157640/db3b409f9265a401c1d39be78ee3a26bfce5a215.png" height="400" alt=""><br>
</span><span style="line-height:1.6;"><br>
</span><h2>5. 動作確認</h2>
<span style="line-height:1.6;">BP_WebcamBillboardを設置。</span><span style="line-height:1.6;"><br>
</span><span style="line-height:1.6;">カメラIDを変更可能。</span><span style="line-height:1.6;"><br>
</span><span style="line-height:1.6;">普通は0のままでおｋ。</span><span style="line-height:1.6;"><br>
</span><br>
<img data-ubi="157642" src="http://bmimg.nicovideo.jp/image/ch2559076/157642/9be2d75e6885b6d642cb5702001a7a989c7b5ff4.png" width="680" alt=""><br>
<br>
<img data-ubi="157641" src="http://bmimg.nicovideo.jp/image/ch2559076/157641/a0e3d606440d71b026586d4e2da7a3961464fdef.png" width="680" alt=""><br>
<br>
<h1>おわりに</h1>
<hr>間違ってたらごめんなさいね ＞＜<br>
今度はARに挑戦してみようかな。