ぼっちゲーム開発

Unreal Engineを中心とした3Dツール周りのネタを備忘録を兼ねて気ままに書き連ねています

SpriteStudioで2Dブルーマン作成

SpriteStudioでアニメーション作成

前回はSpriteStudioの導入とサンプルアニメーションのインポートについてご紹介しましたが、今回は実際にSpriteStudioを使ってアニメーションを作成し、UE4で動かしたいと思います。

2Dブルーマンの作成

まず、アニメーションの素材となる画像を用意します。

今回はIllustratorでプリミティブ形状から、パーツを作成しました。

 

f:id:msyasuda:20161114011050p:plain

急いで作ったものなので、こんなものでご容赦を。。。

新規プロジェクト作成

では、SpriteStudioを起動したら、メニュー > ファイル > 新規プロジェクトと選択し、

Bluemanという名前でプロジェクトを作成します。

f:id:msyasuda:20161114011601j:plain

 

セルマップ作成

プロジェクト内のセルマップを右クリックし、新規作成します。

警告が表示されますが、「はい」を選択します。

作成した上記素材となる画像を指定します。

この時画像が2のべき乗のサイズでないと警告が出ますので、2のべき乗となるようにしましょう。

 

f:id:msyasuda:20161114012044j:plain

 

すると、指定した画像がセルマップという領域に表示されます。

 

f:id:msyasuda:20161114012540j:plain

 

セル作成

次にパーツを矩形選択した後、右クリックしてセル作成を選択します。

 

f:id:msyasuda:20161114012841j:plain

 

選択すると作成したパーツの名前を求められるのでHeadと命名します。

そして、画面左のセルリストに作成したセルが追加されているのが確認出来ます。

 

f:id:msyasuda:20161114013420j:plain

 

同じ要領で上のブルーマン画像を下のような名前でセルを作成して行きます。

 

f:id:msyasuda:20161114020305j:plain

 

下のようにセルリストに各パーツのセルが全て作成されているのを確認してください。

 

f:id:msyasuda:20161114015649j:plain

 

中心の設定

各セルは回転や移動を設定された中心点から行うため、ここで中心点を設定しないと回転した時にセルの中央を中心として回転してしまいます。

腕や脚のパーツに関しては下の画像のようにセル上部の真ん中を中心とした動きをとるはずなので、腕や足に関わるパーツは中心点を変更します。

 

f:id:msyasuda:20161114024254j:plain

 

ただし、Footに関してはLowerLegの中心点からの延長線とFootの高さを二分する線との交点に中心点を置いた方が良いでしょう。

と言いつつ座標値は見た感じでざっくり置いてしまいました。

本当はちゃんとピクセル測って決めた方が良いです。

 

f:id:msyasuda:20161114025651j:plain

 

レイアウト作成

作成したセルをドラッグ&ドロップで配置して行き、下のような状態をつくります。

 

f:id:msyasuda:20161114021426j:plain

 

配置したままではパーツの表示順序が配置した順になってしまっているので、

アトリビュート > 一般 > 優先度を表示したい順に変更します。

数値が高くなる程手前に表示されます。

 

f:id:msyasuda:20161114022256j:plain

 

下の画像のようなレイアウトになれば大丈夫です。

 

f:id:msyasuda:20161114022102j:plain

 

階層を作る

階層を作る事で子のセルは親のセルの移動(回転)の影響を受けるのでアニメーションが作成し易くなります。

また、階層構造にする事でIKを適用する事も出来ます。

階層は以下のようにしました。

root

┗LowerBody

 ┗MiddleBody

  ┗UpperBody

   ┗Head

   ┗LeftUpperArm

    ┗LeftLowerArm

     ┗LeftHand

   ┗RightUpperArm

    ┗RightLowerArm

     ┗RightHand

┗LeftUpperLeg

 ┗LeftLowerLeg

  ┗LeftFoot

┗RightUpperLeg

 ┗RightLowerLeg

  ┗RightFoot

LeftUpperLegとRightUpperLegは足を曲げて屈めるためにLowerBodyから外してます。

私が知らないだけで、良い解決策があるかもしれないですが。。。

アニメーションのキーを設定する

次にアニメーションのキーフレームとなるフレームにキーを設定して行きます。

画面下のフレームコントロールでキーを設定したいフレームに移動します、キーを設定するセルを選択し、アトリビュート一般内のキーを設定したいプロパティにチェックを入れればキーが設定されます。

設定されたキーは各セル毎のタイムライン上に楕円のアイコンとして表示されます。

また、特定のフレームのキーを別のフレームにコピーしたい時は楕円のアイコンを右クリックし、コピー先のフレームで貼り付ける事でコピーが可能です。

 

f:id:msyasuda:20161114031941j:plain

IK(Inverse Kinematics)

SpriteStudioではIKによる操作も可能です。

通常親子関係があれば、親の動きに子が追従するものです。

これをFK(Forward Kinematics)と呼びます。

これとは逆に子の動きに親が追従するものがIKです。

では、どうIKを操作するかと言うとかなりシンプルでセルを選択した状態で、

Alt + ドラッグ

 

しかし、このIK意図した場所にフリップさせないで持ってくるのが少し手間なんですよね。。。

 

また、IKの影響数も変更可能です。

人型であれば2で充分なので、変更します。

レイアウトの右上にある三角の連続したアイコンを選択し、IKの影響リンク数を変更を選択して2と打ち込みます。

 

f:id:msyasuda:20161114033948j:plain

 

そして、全てのキーを設定して出来たのがこの待機アニメーションです。

 

f:id:msyasuda:20161114034513g:plain

 

簡易的に作ったものなので、この程度でご容赦ください。

ここまで出来たら保存し、前回と同じようにUE4にインポートします。

2DブルーマンをUE4で動かす

インポートすると下のような感じで無事表示できました。

 

f:id:msyasuda:20161114035718g:plain

 

せっかくなので、Blueprintも試してみたいと思います。

てっとり早くアクターを選択して、DetailsタブからBlueprint/Add Scriptクリックして、

Blueprintを作成します。

後は通常のBlueprint同様にスクリプティング出来ます。

 

各ノードについてはhistoriaさんのこちらのページに記載されています。

historia.co.jp

 

その中で試して気になったものを挙げたいと思います。

 

Pause

文字通りの機能ですが、Actorを最初からPauseした状態で始めたらどうなるのかなと思って試してみました。

具体的にはEvent Begin PlayですぐPauseすると言った感じですが、

Actorは表示されず。。。

再生がされてからのキーボードイベント等では正常にPauseしました。

上記ケースは想定した使用方法ではないんですかね?

 

Get Loop Count

ループの残り回数を取得するものです。

現在のループ回数ではないので、Set Loop Count 0(=無限)だと常に0を返します。

 

Auto DestroyはSpawn時のみのオプション

動的にSpawn関数で作成する場合にはAuto Destroyを引数として設定出来るのですが、静的なBlueprintとして用意してあるものは、On Ss End Playで終了タイミングを取得してDestroy Actorする必要があります。

 

ひとつおもしろいものとしてAdd Texture Replacementと言うものが存在します。

指定したパーツのテクスチャを変更出来るようです。

2Dブルーマンの画像を加工してこんな画像を作ってみました。

 

f:id:msyasuda:20161114042337p:plain

 

RightUpperArmとRightUpperLegに包帯を付けた画像です。

ためしにRightUpperArmを変更してみます。

上の画像をインポートしておき、下グラフのようにスクリプトを組みます。

Aを離すとRightUpperArmのテクスチャが切り替わります。

 

f:id:msyasuda:20161114042944j:plain

 

実行すると、RightUpperArmの部分が包帯に変わっています。

これで装備の変更やダメージといった事も表現出来そうですね。

 

f:id:msyasuda:20161114043513g:plain

 

逆にテクスチャを戻す場合はRemove Texture Replacementを使用すれば可能です。

 

今回はSpriteStudioを使ってアニメーションを作成し、UE4に組み込みBlueprintを試す所までやってみました。

 

次回はUE4に戻ってマテリアルを紹介したいと思います。

SpriteStudio導入

SpriteStudio

スプライトを作成ツールとしてSpriteStudioと言うソフトがあり、UnityやUE4用にプラグインも公開されており、3Dゲームエンジンでも容易に2D画像のアニメーションが可能です。

2Dアニメーションを使用しなかったとしても、テクスチャパックから任意のUV画像を抽出するにも良いツールだと思います。

SpriteStudioにはインディーズ(昨年の収入が1000万未満の個人または直近の決算における売り上げが1000万未満の会社)のためのSpriteStudio for Indieと言うものが提供されています。

タイトル画面にSpriteStudioのスプラッシュスクリーンを表示しなければならないという条件はありますが、利用可能期間は6ヵ月間で商用でも利用する事が可能です。

www.webtech.co.jp

今回はSpriteStudioの導入とUE4のプラグイン導入まで紹介したいと思います。

SpriteStudioダウンロード

まずはインディーライセンスの申し込みをします。

ページトップのインディーライセンス申し込みをクリックします。

 

f:id:msyasuda:20161112115130j:plain

 

クリックするとインディーライセンスの申し込みボタンにスクロールしますので、もう一度クリックします。

次に登録画面が出るので、情報を入力します。

ホームページやサークル等ない場合は空欄で良いと思います。

 

f:id:msyasuda:20161112115404j:plain

 

入力情報に間違いがなければ確認を押し、確定させます。

するとOPTPiXさんから申し込み完了のメールが届きます。

メール中に記載されているプログラムダウンロードページへ遷移し、お使いのOSに合わせたものをダウンロードします。

OPTPiX SpriteStudio 本体のダウンロード | OPTPiX Help Center

 

ダウンロードが完了したら、インストーラーを起動します。

起動したら次へを選択します。

 

f:id:msyasuda:20161112120220j:plain

 

インストール先を適宜指定します。

 

f:id:msyasuda:20161112120307j:plain

 

問題なければ次へを選択します。

 

f:id:msyasuda:20161112120503j:plain

 

インストールが開始されるので完了するまで待ちます。

 

f:id:msyasuda:20161112120531j:plain

 

インストールが完了したら起動してみます。

ライセンスキーを求められますので、メールに記載されているライセンスキーを打ち込み、ライセンス認証を完了させます。

これでSpriteStudioを使えるようになりました。

 

f:id:msyasuda:20161112121005j:plain

 

UE4用SpriteStudioプラグイン導入

プラグインの導入についてはヒストリアさんとalweiさんの方で良くまとめてもらっているのでそちらを参照するのが良いかと思います。

ビルド環境が揃っていないようであればヒストリアさんのページを

SpriteStudio5 Player for UE4 | historia Inc - 株式会社ヒストリア - Part 2

 

ビルド環境が揃っているようであればalweiさんのページを参考にして頂ければ導入出来ると思います。

unrealengine.hatenablog.com

 

またビルド環境については過去記事の「ソースコードをビルドする」をご確認ください。

msyasuda.hatenablog.com

 

プラグインの導入が完了すれば、後はFBXと同じ要領でSpriteStudioのプロジェクトをインポート出来ます。

 

OPTPiXさんがサンプル用のデータを提供してくれていますので、そちらをダウンロードしてみます。

サンプルデータ | OPTPiX Help Center

 

ページにある基本的なアニメーションのサンプルをダウンロードしてみます。

その中のComipoと言うサンプルをインポートしてみます。

インポートが完了するとContent Browserには下の画像のようにテクスチャとプロジェクトが作成されます。

 

f:id:msyasuda:20161112123309j:plain

 

ComipoProjectをレベル上にドラッグ&ドロップします。

すると・・・

 

f:id:msyasuda:20161112123758g:plain

 

女の子がアニメーションしています。

これでキャラクターや背景はもちろんUIやエフェクトについてもUE4上で2Dアニメーション出来るようになりました。

 

次回はSpriteStudioを使ったアニメーション作成を紹介したいと思います。

キャラクターにアニメーションを適用する

AnimInstanceクラス

前回はCharacterクラスを使ってPawn(Character)を操作する所まで作成しました。

今回はFBXでインポートしたアニメーションをキャラクターに適用して行きます。

UE4ではアニメーションをState Machineで管理しています。

State Machineとは現在の状態(State)と入力条件により、次の状態が決まる順序回路の事を言います。

Unityでも同様にステートマシンでアニメーション管理されていたかと思います。

そして、State Machineから成るアニメーションを管理するものとしてAnimInstanceクラスが存在します。

また、このAnimInstanceで作成されたBlueprintをAnimation Blueprintと言います。

では、さっそくAnimation Blueprintを作成して行きます。

Animation Blueprint作成

今回の作業も前々回、前回の続きを想定しています。

アニメーションのFBXインポートはこちらをご確認ください。

msyasuda.hatenablog.com

まずContent BrowserからAnimation > Animation Blueprintの順に選択してBlueprintを作成します。

 

f:id:msyasuda:20161112001417j:plain

 

親クラスにAnimInstanceを選択し、SkeletonにはSK_Mannequin_Skeletonを選択します。

 

f:id:msyasuda:20161112001722j:plain

 

名前はMyAnim_BPとして、作成したBlueprintsフォルダに配置します。

 

f:id:msyasuda:20161112002712p:plain

 

出来たMyAnim_BPを開くと次のようなEvent GraphとAnim Graphという二つのGraphを持った画面が表示されます。

Event Graphではアニメーションに関わるBlueprintのスクリプティングをし、Anim Graphではアニメーションのステートマシンでアニメーションの遷移を作成して行きます。

 

f:id:msyasuda:20161112003112j:plain

 

では、State Machineを新規に作成してみましょう。

Anim Graph内の空白を右クリックした後、Add New State Machineと入力し、新しいState Machineを作成します。

 

f:id:msyasuda:20161112003419j:plain

 

F2で名前をTopStateと変更します。

次にTopStateをダブルクリックすると、TopState内のAnim Graphへと遷移します。

Asset Browser内にThirdPersonIdleというアニメーションがあるので、ドラッグ&ドロップすると新しいステートが作成されます。

 

f:id:msyasuda:20161112004146j:plain

 

F2でステート名をIdleに変更し、Entryにつなぎます。

 

f:id:msyasuda:20161112004634j:plain

 

一番上の階層のAnim Graphに戻ります。

下の画像にあるようにAnim Graphを選択する事で戻る事が出来ます。

 

f:id:msyasuda:20161112004829j:plain

 

戻ったら、TopStateとFinal Animation Poseを繋ぎコンパイルします。

 

f:id:msyasuda:20161112005055j:plain

 

コンパイルが終わると下の画像のようにState MachineからFinal Animation Poseへと遷移し、プレビューのモデル(グレイマンと呼ばれているらしいので、以後グレイマンと呼びます)が待機アニメーションを始めたはずです。

 

f:id:msyasuda:20161112005245j:plain

 

次に作成したAnimation BlueprintをCharacterに適用します。

MyCharacter_BPを開き、Mesh ComponentのDetailsタブ内のAnimation Classに作成したMyAnim_BPを指定します。

 

f:id:msyasuda:20161112005948j:plain

 

MyAnim_BPをコンパイルし、Level Editorもコンパイルします。

すると、レベル上でもアニメーションをしているのが確認出来ました。

 

f:id:msyasuda:20161112010401g:plain

 

よし、成功!

っと、よく見るとグレイマンの左肩が脱臼したみたいになってます。。。

これが前々回のアニメーションをインポートした際に出た警告の結果です。

これはスケルトンのボーンとアニメーションのボーンとで差異がある事に起因しています。

そこで、その差異を修正するためにアニメーションのTranslation Retargetingというものが必要になります。

 

アニメーションのTranslation Retargeting

もう一度MyAnim_BPを開き、メニュー下にあるAnimationという項目を選択します。

 

f:id:msyasuda:20161112011322j:plain

 

次のような画面になるので、画面左Skeleton Treeタブ内のShow Advanced Optionsにチェックを入れます。

Skeleton TreeにTranslation Retargetingと言うものが表示されたはずです。

Translation (Re)targetingとは何かと言うとアニメーションの平行移動を何を元に行うかという設定です。

初期状態だと全てAnimationになっています。

 

f:id:msyasuda:20161112011607j:plain

 

この設定を現在のSkeletonに合わせるため、全てをSkeletonに変更します。

Skeleton Tree内で右クリックし、Recursively Set Translation Retargeting Skeletonを選択します。

 

f:id:msyasuda:20161112012637j:plain

 

すると、Translation Retargetingが全てSkeletonに変わったのが確認出来ます。

プレビューを確認すると脱臼は治りましたが、グレイマンが床に埋まってしまっています。

どうやら、全てをSkeletonにしただけでは駄目なようです。

 

f:id:msyasuda:20161112012939j:plain

 

pelvis(骨盤)の位置まで床に埋まってしまっているので、AnimationとSkeletonでpelvisの位置が違っているようです。

pelvisの位置をAnimationでの位置になるようにスケールをかけます。

pelvisのTranslation RetargetingをAnimation Scaledに変更します。

これで、床に足がつくようになりました。

 

f:id:msyasuda:20161112013415j:plain

 

最後にrootのTranslation Retargetingですが、Skeletonだとアニメーションによっては起点からずれてしまう事にもなるので、rootのTranslation RetargetingをAnimationに変更します。

 

f:id:msyasuda:20161112014201j:plain

 

現在のアニメーションだと違いは出ませんが、これでRetargetingが終了です。

最後にレベル上で確認してみます。

腕はちゃんと繋がっていますね。

 

f:id:msyasuda:20161112015038g:plain

 

今回はAnimInstanceクラスを親としたAnimation Blueprintの作成とTranslation RetargetingによるSkeletonの調整まで行いました。

また、今回のRetargetingは平行移動についてですが、AnimationのボーンをSkeletonのボーンに変更するRetargingも存在します。

そちらについてもまた追々紹介出来ればと思います。

 

次回は少し外れて、SpriteStudioの導入について紹介しようと思います。

Characterクラスによるキャラクター制御

キャラクターの制御に特化したPawn派生クラス

前々回の記事でPawnクラスを紹介しましたが、今回紹介するのはキャラクターの制御に特化したCharacterクラスと言うものです。

このクラスにはキャラクターを動かすために必要な様々な機能やプロパティが用意されています。

それでは、前回インポートしたFBXを使用してCharacterを作成して行きたいと思います。

Character作成

FBXのインポートについては前回記事に記載していますので、そちらをご確認ください。

msyasuda.hatenablog.com

 

では、まずCharacterクラスを作成します。

Content Browser内のAdd Newもしくは空白右クリックで作成するBlueprintの親クラスをCharacterを選択してください。

 

f:id:msyasuda:20161101172425j:plain

 

Content Browserに下のようなアイコンが出来たはずです。

今回は名前をMyCharacter_BPとします。

 

f:id:msyasuda:20161101172705j:plain

 

MyCharacter_BPを開きます。

下のような画面になっているはずです。

また、以下のComponentがAddされた状態にあります。

CapsuleComponent・・・カプセル状の範囲を持つComponentで、キャラクター用にCollision(衝突)が設定されている

ArrowComponent・・・Characterの向きを示している

Mesh・・・Characterに設定するMesh

CharacterMovement・・・キャラクターの移動を管理している。

f:id:msyasuda:20161101172907j:plain

 

では、次にMeshに前回インポートしたSkeleton Meshを適用します。

MeshのDetailsタブ内にあるMesh > SkeletalMeshのNoneをプルダウンし、

SK_Mannequinを指定します。

 

f:id:msyasuda:20161101173919j:plain

 

すると、下のようなViewになっているはずです。

このままでは、CapsuleComponentからはみ出しているので、Meshの相対位置とCapsuleComponentのサイズを調整して行きます。

 

f:id:msyasuda:20161101174525j:plain

 

CamsuleComponentのDetailsタブ内のShapeにあるCapsule Half Heightを90にします。

 

f:id:msyasuda:20161101175231j:plain

 

MeshのDetailsタブ内TransformのLocationXを-90、RotationZを-90にします。

Rotationも変更したのはArrowComponentの向きにMeshの向きを合わせるためです。

 

f:id:msyasuda:20161101175057j:plain

 

結果、このようになりました。

Characterの向きとMeshの向きが合い、CapsuleComponent内にMeshが収まりました。

 

f:id:msyasuda:20161101175653j:plain

 

ここまで出来たものに、前々回のPawn同様にSpringArmとCameraを追加します。

設定についてはこちらでご確認ください。

 

msyasuda.hatenablog.com

 

Spring ArmのTarget Arm LengthやCameraのTransformationは俯瞰になるぐらいで適宜変更してください。

追加すると下のようなViewになります。

 

f:id:msyasuda:20161101180433j:plain

 

ここまでで一旦Compileして、GameModeのDefault Pawn Classを変更して確認してみます。

GameModeについてはこちらをご確認ください。

 

msyasuda.hatenablog.com

 

World Settingsタブ内のGameModeのDefault Pawn ClassをMyCharacter_BPに変更します。

 

f:id:msyasuda:20161101180901j:plain

 

このように一人たたづむキャラクターが表示されていれば成功です。

 

f:id:msyasuda:20161101181153j:plain

Characterを移動させる

ここまででViewの作成は完了しました。

次はCharacterを移動させるための設定とBlueprintを作成して行きます。

まず入力処理を作成して行きますが、入力設定についてはこちらをご確認ください。

今回も作成したMoveForwardとMoveRightイベントを使用します。

msyasuda.hatenablog.com

 

まず、キャラクターの前方ベクトルを作成します。

こちらは前々回紹介したものと同じです。

 

f:id:msyasuda:20161101182930j:plain

 

右方ベクトルもGet Right Vectorも使って同様に作成します。

 

f:id:msyasuda:20161101184559j:plain

 

今回はCharacterクラス内にあるCharacter Movementに移動処理を任せるため、

Add Movement Inputというノードを使います。

World Directionで指定したベクトルに対してScale Valueと移動量を掛けたベクトルを足すノードです。

また、移動量はCharacterMovementのWalkSpeedが反映されます。

 

f:id:msyasuda:20161101183232j:plain

 

では、MoveForwardのScaleValueをAdd Movement InputのScale Valueに作成した前方ベクトルをWorld Directionに繋げます。

 

f:id:msyasuda:20161101184346j:plain

 

MoveRightも同様です。

 

f:id:msyasuda:20161101184800j:plain

 

これでBlueprintは完成です。

Compileしてテストしてみましょう。

 

。。。わかりづらいですが、右前方に移動しました。

 

アニメーションは設定してないので、静止状態のままですが、前後左右に動かせました。

しかし、このままでは後ろ歩き、カニ歩きしている事になるので進行方向に回転するようにしましょう。

 

f:id:msyasuda:20161101190507j:plain

 

MyCharacter_BP(self)のDetailsタブ内のPawn > Use Controller Rotation Yawのチェックを外します。

このチェックを外さないとControllerの回転が適用され、常にまっすぐを向いてしまいます。

 

f:id:msyasuda:20161101181807j:plain

 

次にキャラクターが回転して後ろに向かった時、Cameraはキャラクターの正面にありたいので、SpringArmのDetailsタブ内にあるCamera SettingsのUse Pawn Control Rotationにチェックを入れます。

これによりCameraにもPawnと同じ分だけ回転が加わるので、後ろに向かっている時でもCameraが正面になります。

 

常にカメラが後ろを追っかけているようにしたいのであれば、この処理は必要ありません。

f:id:msyasuda:20161101191451j:plain

 

次にCharacterMovementのDetailsタブ内にある

General Settings > Orient Rotation to Movement

にチェックを入れます。

こうする事で進行方向に回転するようになります。

 

f:id:msyasuda:20161101182402j:plain

 

Compileして実行してみます。

後ろに向かった時にキャラクターも回転しているので成功です!!

 

f:id:msyasuda:20161101192021j:plain

 

CharacterMovementを見て気づいたかもしれませんが、Fly、Swimming、Jumpといった項目まで存在するので、CharacterMovementを駆使すれば大体のキャラクターの動きを制御出来るのではないでしょうか。 

すこし長くなりましたが、今回はCharacterクラスの作成から、移動処理と設定まで紹介しました。

 

次回はAnimationの適用について紹介したいと思います。

FBXインポート

FBXファイル

FBXとはDCCツールの相互運用を可能とするために作られたファイル形式で、ファイル中にはMesh、Skeleton、Materialといった情報があります。

UE4でもFBXのインポートが可能なため、DCCツールで作ったモデルをUE4で動かす事が出来ます。

また、注意する点としてはDCCツールの種類やそのバージョンにより同じFBXでも差異が生じます。

FBXのダウンロード

下記EPIC GAMESのページより、人型のモデルのFBXを入手する事が出来るので、

ダウンロードします。

File:ThirdPerson FBX.zip - Epic Wiki

FBXをインポート

上記サイトよりダウンロードしたZipを任意の場所に解凍しておきます。

Content Browser内のImportをクリックし、解凍されたフォルダからSK_Manequin_FBXというものを選択します。

または、解凍されたフォルダを直接開き、Content Browser内にドラッグ&ドロップする事でもインポート出来ます。

 

今回はCharacterというフォルダを作成し、そこにインポートする事にします。

f:id:msyasuda:20161031015416j:plain

 

次に下のようなウィンドウが出ます。

Importを選択します。

 

f:id:msyasuda:20161031020331j:plain

 

下のような警告が表示されますが、一旦無視してください。

 

f:id:msyasuda:20161031020641j:plain

 

Content Browserには以下5つのファイルが作成されました。

Fbx_Default_Material_1・・・Materialと言いインポートしたオブジェクトの質感を設定するもの

M_UE4Man_Body・・・Materialと言いインポートしたオブジェクトの質感を設定するもの

SK_Mannequin・・・Skeletal Meshと言いMesh、Skeleton、マテリアルなどの情報を持つもの

SK_Mannequin_PhysicsAsset・・・Mesh、Skeletonに物理設定を行うもの

SK_Mannequin_Skeleton・・・Skeletonと言いボーン情報を持つもの

 

f:id:msyasuda:20161031020913j:plain

 

ただのMeshとして扱うのであれば、SK_Mannequinをドラッグ&ドロップすれば、レベル上に表示する事が可能です。

 

f:id:msyasuda:20161031022412j:plain

 

次に残りのアニメーションのFBXについてもインポートします。

Animationsというフォルダを作成し、そこにSK_Mannequin以外をインポートします。

次のようなウィンドウが表示されるのでMesh > Skeletonのプルダウンをクリックします。

 

f:id:msyasuda:20161031023051j:plain

 

SK_Mannequin_Skeletonを選択します。

 

f:id:msyasuda:20161031023533j:plain

 

これによりSkeletonとAnimationが関連付けられます。

次にウィンドウ内のImport Allをクリックして、全てインポートします。

 

f:id:msyasuda:20161031024049j:plain

 

また警告が出ましたが、これまた一旦無視します。

Animationにはあるが、Skeletonにないボーンがあると言われています。

元々違うモデルのアニメーションを適用したためこのような警告が出ています。

これは後で解消したいと思います。

下のようなファイルがContent Browser内に作成されたはずです。

 

f:id:msyasuda:20161031024456j:plain

 

これで全てのインポートは完了しました。

この後アニメーションの設定やPawnの生成等がありますが、話が長くなりますので、インポートについてはここまでとしたいと思います。

 

次回以降でアニメーションの設定とPawnの生成を行って行きます。

その時に今回出た警告の意味についてもわかるかと思います。

PawnとPlayer ControllerによるActor移動

UE4でのプレーヤー操作の基本

前回のGameModeでも少し紹介しましたが、UE4ではプレーヤーが操作するオブジェクトをPawn(駒)と考え、それをコントロールするものとしてPlayer Controllerというものが存在します。

Player ControllerはPawnを所持するといような作りになっており、Pawnの所持を破棄するとPawnに対する操作は行えなくなります。

また、GameModeにPawnとPlayer Controllerを設定する事により、ゲーム開始時にPlayer ControllerはPawnを所持している状態になります。

今回はこのPawnとPlayer Controllerを作成して、Actorを動かしてみたいと思います。

PawnとPlayer Controllerの作成

ではまずPawnとPlayer Controllerを作成します。

Conent Browser内のAdd Newもしくは右クリックのBlueprintを選択して親クラスをそれぞれ選択します。

f:id:msyasuda:20161030152858j:plain

 

Content Browserは下のようなアイコンが二つ出来ています。

PawnクラスをMyPawn_BPとPlayer ControllerクラスをMyPlayerControlller_BPという名前にしました。

 

f:id:msyasuda:20161030153235j:plain

 

また、BlueprintsフォルダとMapsフォルダというフォルダがありますが、

事前に右クリックNew folderで作成しました。

BlueprintsにBlueprint、Mapsにテスト用レベルを保存しています。

既に作ってしまったものを移動させたい場合は移動先フォルダにドラッグ&ドロップしてください。

コピーでよければCopy Here、移動でよければMove Hereを選択してください。

 

f:id:msyasuda:20161030153746j:plain

 

Pawn実装

次にコンポーネントスクリプトを追加して行きます。

MyPawn_BPを開き、Viewportに切り替えたら、Cube Componentを追加します。

f:id:msyasuda:20161030154304j:plain

 

作成して出来たCubeが少し大きいので、Detailタブ内のScaleをそれぞれ0.5ぐらいにします。

 

f:id:msyasuda:20161030154538j:plain

 

次にSpring ArmというComponentを追加します。

Componentリストから探すのは面倒なので、Spring Armと検索して選択します。

 

f:id:msyasuda:20161030154853j:plain

 

すると、下の画像のようにCubeから棒状のものが突き刺さった様な状態になります。

このSpring Armは文字通りバネのようなものを表現するのに適しています。

今回はこのSpring Armの子供としてCamera Componentを追加する事でCubeに追従するカメラを作ります。

 

f:id:msyasuda:20161030155010j:plain

 

次にCamera Component を追加します。

 

f:id:msyasuda:20161030155612j:plain

 

CameraをSpring Armの子供にしたいので、CameraをSpring Armにドラッグ&ドロップします。

 

f:id:msyasuda:20161030160043j:plain

 

追加すると、下のようなViewになったはずです。

 

f:id:msyasuda:20161030160202j:plain

 

このままではCameraの位置と角度が正面を向いた状態ので、少し遠めから俯瞰した状態にします。

Spring Arm のDetailsタブ内のCamera Settings > Target Arm Lengthを500ぐらいにします。

 

f:id:msyasuda:20161030160439j:plain

 

次にカメラの高さと角度を変更します。

Camera Detailsタブ内のTransformを次の値にします。

Location Z = 200、Rotation Y = -20

するとViewは下のようカメラが俯瞰するようになったはずです。

 

f:id:msyasuda:20161030160841j:plain

 

入力によるPawn移動

次に入力からPawnを移動させたいと思います。

以前紹介したInput設定では、レベルブループリントからActorを移動させましたが、それはPawnを継承していないクラスでは、入力処理を扱えないからです。

msyasuda.hatenablog.com

今回はPawnのEvent Graphに直接入力処理を作成して行きます。

また、入力マッピングについては以前紹介したのでそちらを参考にしてください。

入力イベントはMoveForwardとMoveRightを使用します。

 

まず、移動量を求めます。

Axis ValueとGet World Delta Secondsをかける事で、前回処理からの経過時間分のスケールを求めます。

Add pinをクリックすると入力ピンが増えるので、ここに移動量を入力します。

 

f:id:msyasuda:20161030163519j:plain

 

今回は移動量を500にします。

 

f:id:msyasuda:20161030163758j:plain

 

次に移動方向を求めます。

今回は平面での移動だけを想定しているので、Get Control RotationからBreak RotatorでY角度のみを抽出し、Make Rotatorで移動角度を作成します。

 

f:id:msyasuda:20161030163946j:plain

 

また、スカラー値でない出力ピンはピンを右クリックし、Split Struct Pinを選択する事で出力される構造体が分解されて表示されます。

今回はピン数もそれ程多くないのでこの状態で作成して行きます。

 

f:id:msyasuda:20161030164245j:plain

 

次にRotatorから前方ベクトルを取得します。

 

f:id:msyasuda:20161030164443j:plain

 

これで移動方向が求められたので、先に作った移動量と掛け合わせます。

 

f:id:msyasuda:20161030165532j:plain

 

最後にAdd Actor Local Offsetの実行ピンとDelta Locationに求めたベクトルを繋げます。

これでMoveForwardは完成です。

 

f:id:msyasuda:20161030171244j:plain

 

MoveRightはGet Forward Vectorの部分をGet Right Vectorに置き換えます。

 

f:id:msyasuda:20161030171302j:plain

GameModeにPawnとPlayer Controllerを設定する

最後に前回紹介したWorld Settingsに作成したPawnとPlayer Controllerを指定する事により、プレーヤーが操作するPawnが変更されます。

msyasuda.hatenablog.com

 

前回のMyGameModeを使用してWorld Settingsを変更したのが下のものです。

 

f:id:msyasuda:20161030171517j:plain

 

では、実行してみると・・・

 

f:id:msyasuda:20161030171647j:plain

 

静止画ですみません。。。

Cubeが宙に浮いていますが、W、S、D、Aで移動出来ました。

 

今回はPawnとPlayer Controllerを作成してPawnを移動させるまでを紹介しました。

次回はFBXのインポートについて紹介したいと思います。

GameModeを作成する

ゲーム内のルールを定めるGameMode

UE4(UnrealEngine4の略称として以後使用します)では、ほとんどのゲームにおいてGameModeというものを作成する必要があります。

GameModeには大まかに以下の役割があります。

  1. ブループリントによるゲームに関わる処理
  2. ゲーム内で使用されるクラス設定

今回はこのGameModeの作成とGameModeに関連する設定について紹介したいと思います。

GameModeの作成

まずはGameModeを作成して行きます。

Content BrowserのAdd Newもしくは空白を右クリックして、Bluprint Classの中からGameModeを選択して作成します。

f:id:msyasuda:20161030012616j:plain

 

Content Browser内に下のようなアイコンが生成されているのが確認出来ます。

今回は作成されたGameModeをMyGameModeという名前にします。

 

f:id:msyasuda:20161030013022j:plain

 

アイコンをクリックすると次のようなウィンドウが表示されます。

他のBlueprintクラス同様の構成になっており、EventGraphにスクリプティングする事も可能です。

 

f:id:msyasuda:20161030014001j:plain

デフォルトのGameModeを設定する

次に作成したGameModeをプロジェクトで使用するデフォルトのGameModeに設定します。

Edit > Project Setting > Maps&Modes > Default GameMode

GameModeのプルダウンをクリックし、作成したMyGameModeを指定します。

 

f:id:msyasuda:20161030015752j:plain

 

これでデフォルトのGameModeを変更する事が出来ました。

GameModeで設定できるクラス

次にGameModeで設定できるクラスについて確認して行きます。

メニュー > Window > WorldSettingsと選択します。

ウィンドウが表示されると思いますので、Detailsタブの横あたりまでドラッグ&ドロップすると下のような画面になります。

タブ化しておいた方がスッキリして見易くなるのでおすすめです。

 

f:id:msyasuda:20161030021014j:plain

 

設定出来るクラスは次のようなものになります。

GameMode Override・・・デフォルトからオーバーライドするGameMode

Default Pawn Class・・・プレーヤーが操作する駒にあたるクラス

HUD Class・・・スクリーン上にオーバーレイ表示させるためのクラス

Player Controller Class・・・プレーヤーが操作する駒をコントロールするためのクラス

Game State Class・・・ゲームの状態を監視するクラス

Player State Class・・・プレーヤー情報をクライアントにレプリケートさせるクラス

Spector Class・・・アクションを観戦する受動プレーヤーを管理するクラス

 

クライアントでのシングルプレイのゲームであれば使用するものはGameMode Override、Default Pawn Class、HUD Class、Player Controller Classになるかと思います。

 

各クラスについては追々詳しく紹介して行きたいと思います。

GameModeのブループリント

 他のBlueprint同様に使用する事が出来ます。

ただレベルBlueprintとは異なり、レベル上のアクターのリファレンスを作成する事が出来ません。

 

久々の記事でしたが、今回はGameModeについて紹介しました。

次回はPawnとPlayer Controllerを作成してアクターを動かしたいと思います。