【Unity道場 2017】PlayMakerによる初めてのUnityプログラミング

1.2K Views

July 27, 17

スライド概要

7月29日開催のUnity道場資料です。
講師:石井勇一(ユニティ・テクノロジーズ・ジャパン合同会社)

profile-image

リアルタイム3Dコンテンツを制作・運用するための世界的にリードするプラットフォームである「Unity」の日本国内における販売、サポート、コミュニティ活動、研究開発、教育支援を行っています。ゲーム開発者からアーティスト、建築家、自動車デザイナー、映画製作者など、さまざまなクリエイターがUnityを使い想像力を発揮しています。

シェア

またはPlayer版

埋め込む »CMSなどでJSが使えない場合

関連スライド

各ページのテキスト
1.

PlayMakerによる 初めてのUnityプログラミング ユニティ・テクノロジーズ・ジャパン合同会社 1

2.

0. はじめに 2

3.

研修の概要 • 本研修は外部アセット「PlayMaker」による Unityをアプリケーションの作成について紹介 します。 3

4.

使用しているソフトウェアについて ソフトウェア名 バージョン Unity 5.6.0f3(5.6.2f1でも動作確認済み) PlayMaker https://www.assetstore.unity3d.com/jp/#!/content/368 1.8.4 4

5.

目次 1. 2. 3. 4. PlayMaker概要 基本操作 衝突判定 Unity UIとの連携 5

6.

1. PlayMaker概要 6

7.

PlayMakerとは • 特徴 • 状態遷移ベースのフロー設計ができる • ロジックをノンコーディングで記述できる • 実行中プログラムの状態を視覚的に把握でき、デバッグ 効率が高い • 既存コードや他アセットとの連携が容易 • ユーザー独自の「アクション」の開発が可能 • 全てをPlayMakerだけで作成することができる。 • C#スクリプトと連携させてプロジェクトの一部にだけ PlayMakerを適用することもできる 7

8.

PlayMakerとは • 導入における効果 • • • • • モック製作/ラピッドプロトタイピング UI/状態遷移の管理システム Tweenアニメーションの制御 AIの思考ルーチン Unity Engine APIの学習 8

9.

PlayMakerとは • チーム開発における注意点 • コードではないのでマージができない(Template Export機能である程度カバーできる) • 厳密なカプセル化は困難 • 自由度が高く、ほぼどんなロジックも書けてしまう ため、統一感を図るのが難しい。 9

10.

PlayMakerとは • 前述の注意点に対する対策案 • 使用範囲を特定シーンに限定する • 既存コードとの連携ルールを明文化する • コードは全てPlayMakerのアクションにして使用す る • 状態遷移制御のみに使用して、ロジックを書かない • iTween制御のみに使用する 10

11.

FSMとは • FSM(Finite State Machine:有限状態機械)と呼 ばれるUMLの状態遷移図に似た形式で記述 • 主な構成要素 • ステート:オブジェクトの状態 • イベント:状態遷移を起こすトリガーとなるもの • アクション:ある状態におけるオブジェクトの振る 舞い • 変数:FSMが扱うオブジェクトや数値などの値を格 納する ※有限状態機械(英:  finite  state  machine,  FSM)は別の呼び⽅方で有限オートマトン(英:  finite   automaton,  FA)もある 11

12.

FSMとは • 具体例:プレイヤ・キャラクタ • ステート • 「待機」、「歩き」、「走り」、「ジャンプ中」など • イベント • 「待機」から「歩き」、「歩き」から「走り」などのへのス テート変化を引き起こすもの(一般的にはユーザからの入力 操作をトリガとする) • アクション • 「待機」時の具体的な挙動、「歩き」時の具体的な挙動など 各ステートにおける具体的な挙動 • 変数 • プレイヤの移動方向(Vector3型)と速度(float型)など 12

13.

PlayMakerのインストール • Asset Storeにアクセスし、検索欄に 「PlayMaker」と入力して検索するか、「エデ ィタ拡張」-「ビジュアルスクリプティング」 と辿り以下のアイコンを探す 13

14.

PlayMakerのインストール • またはWeb Browserで以下のURLを表示する • https://www.assetstore.unity3d.com/jp/#!/content/368 • PlayMakerは「エディタ拡張」のため利用者数分のラ イセンスが必要な点に注意してください(他のカテゴリ のアセットはチームで一つだけ購入するだけで全員が 利用できる) 14

15.

PlayMakerのインストール • パッケージインポート直後の画面 15

16.

PlayMakerのインストール • PlayMaker 1.8.xのインストール • この資料は「1.8. 4」を元に記述されています。 • Unityのメニューに「PlayMaker」が増えている ので、[PlayMaker]-[Install PlayMaker]を実行す る 16

17.

PlayMakerのインストール • このウィンドウの「Install PlayMaker」ボタンを押す 17

18.

PlayMakerのインストール • 自動的に互換性のチェック が行われます。今回は新規 なので特に問題は出ません。 18

19.

PlayMakerのインストール • 「Install PlayMaker 1.8.x」ボタンを押す 19

20.

PlayMakerのインストール • 「I Made a Backup. Go Ahead!」ボタンを押す 20

21.

PlayMakerのインストール • 「Import」ボタンを押す 21

22.

PlayMakerのインストール • 「OK」ボタンを押す 22

23.

PlayMakerのインストール • 似たようなダイアログが出ます。この画面が出 たら「I Made a Backup. Go Ahead!」ボタンを 押す 23

24.

PlayMakerのインストール • インストール作業直後の状態 24

25.

PlayMakerのインストール • アップデートチェックダイ アログは不要なので閉じて ください。 25

26.

PlayMakerのインストール • このウィンドウは不要なの で右下の「Show At Startup」のチェックを外し てから閉じてください。 26

27.

PlayMakerのインストール • PlayMakerのインス トールが完了した 直後のProjectビュ ー 27

28.

PlayMakerの基本設定(オプション) • 表示言語の変更 • [PlayMaker]-[PlayMaker Editor]を実行 • 右下の[Preferences]ボタ ンを押す 28

29.

PlayMakerの基本設定(オプション) • 右上でGeneralを選び、「Language」を [English]から[Japanese]に変更する 29

30.

PlayMakerの基本設定(オプション) • PlayMaker Editorウィンドウを好みの大きさ/位 置に調整してレイアウトを保存(次に使うとき に楽になります) • F1キーを押すか右下の「ヒント(F1)」を押して ヒントを消してください。 • 例として次のスライドを参照 30

31.

PlayMakerの基本設定(オプション) • レイアウトの例 31

32.

2.基本操作 32

33.

2.1. ステージの作成 33

34.

今回のワークショップのゴール • Unityチュートリアルの「玉転がし」を PlayMakerで作成する • https://unity3d.com/jp/learn/tutorials/projects /roll-ball-tutorial • WebGL版 • https://developer.cloud.unity3d.com/share/J8WDI2XUz/ 34

35.

ステージの作成 • ステージはPlaneをベースにします。 • Planeを作成してPosition (0, 0, 0)、Scale(2,1,2)とし て名前を「Ground」に変更 • 詳細 • • • • [GameObject]-[3D Object]-[Plane]でPlaneを作成 InspectorのTransformのPositionを(0, 0, 0)に設定 InspectorのTransformのScaleを(2, 1, 2)に設定 HierarchyのPlaneをクリックして少し待つと編集可能に なるので、「Ground」に変更(MacユーザはRETURNキー で、WindowsユーザはF2キーでも編集可能) 35

36.

ステージの作成 • イメージ図 36

37.

プレイヤーの作成 • プレイヤーは球(Sphere)です。 • Sphereを作成してPosition (0, 0.5, 0) として名前を 「Player」に変更 • 詳細 • [GameObject]-[3D Object]-[Sphere]でSphereを作成 • InspectorのTransformのPositionを(0, 0.5, 0)に設定 • HierarchyのSphereをクリックして少し待つと編集可能 になるので、「Player」に変更(MacユーザはRETURNキ ーで、WindowsユーザはF2キーでも編集可能) 37

38.

プレイヤーの作成 • イメージ図 38

39.

フォルダーの作成 • ボールや床などに色をつけたり、テクス チャを貼り付けるにはマテリアル (Material)を使用します。 • マテリアルはファイルとして保存するた めProjectビューで作成します。 • マテリアルを格納するフォルダーを作成 し、そこの保存します。 • Projectビューの[Create]ボタンを押して、 [Folder]を選択しフォルダーを作成 • フォルダーの名前を「Materials」に変更 39

40.

マテリアルの作成 • ProjectビューのMaterialsフォルダーを選択状 態にする(そうするとそのフォルダー内にファ イルが作成できる) • [Create]ボタンでも良いのですが、もう一つの 方法も紹介します。Materialsフォルダーで右 マウスボタンをクリックし、[Create]-[Material] でMaterialファイルを作成します(次ページ参 照) 40

41.

マテリアルの作成 41

42.

マテリアルの作成 • 作成したマテリアルの名 前を「New Material」か らを「Background」に変 更 • InspectorのAlbedoの右側 にある白四角部分をクリ ックしてカラーピッカー を開く • R:0, G:32, B:64 (濃い青色) に設定して閉じる 42

43.

マテリアルの適用 • 作成したBackgroundマテリ アルをProjectビューから SceneビューにあるGround、 またはHierarchyにある Groundのいずれかにドラッ グ&ドロップ(以下、D&D) 43

44.

ライトの調整(オプション) • シーン全体はDirectional Lightで一様に照らされて います。太陽光をイメージすると良い。 • Directional Lightは距離は無関係でX軸、Y軸で太陽 高度と向きを調整します。 • X軸:太陽高度(0度、180度=水平線、90度=真上、190 度以上、あるいは負の値=日没) • Y軸:太陽方位 • 好みに応じて適当に調整しましょう。 • ここではDirectional LightのRotationを(50, 60, 0)と します。 44

45.

シーンの保存 • これまでの作業内容はシー ンとして記録されています。 シーンは適宜保存しましょ う。 • [Ctrl]-[S](Win) / [Cmd][S](Mac)を押してシーンを 保存します。 • シーン名は「MiniGame」と します。 45

46.

シーンの保存 • 今回はシーンファイルは一つしかあ りませんが、複数作成することも考 慮してフォルダーを作成して整理し ます。 • Projectビューで[Create]-[Folder]でフ ォルダーを作成 • 名前を「Scenes」に変更 • MiniGameシーンファイルをScenesフ ォルダーにD&Dして移動 46

47.

これまでのデータ • もしこの時点でうまくいかなかった場合は、 Roll-a-ball_Playmaker.zipに含まれているRoll-aball_Playmaker1 のプロジェクトファイルを開 いて次に備えてください。 • ただし、PlayMakerのパッケージは含まれてい ませんのでプロジェクトファイルを開いたら、 PlayMakerのインストールを行ってください (他のプロジェクトファイルも同様です)。 47

48.

2.2. プレイヤーの移動 48

49.

プレイヤーの移動 • プレイヤーをキーボードで移動できるようにし ます。 • プレイヤーの動きをリアルなボールのような感 じにするために物理エンジン(Rigidbody)を使 用します。 • HierarchyまたはSceneビューのPlayerを選択 • [Component]-[Physics]-[Rigidbody]を実行し、 Rigidbody コンポーネントをアタッチ (次スライド参照) 49

50.

プレイヤーの移動 • イメージ図 50

51.

プレイヤーの移動 • InspectorビューでRigidbody コンポーネントがアタッチ されていることを確認 51

52.

プレイヤーの移動 • 移動はキーボードを使用します • 矢印キーまたはW A S Dキー • キーボードの入力に応じてボールに徐々に力を 加えて移動させます。 • 通常、これらの処理をUnityではスクリプトを 記述時して実現しますが、今回はPlayMakerで 実現します。 52

53.

プレイヤーの移動 • PlayMakerは必ず対象となるGameObjectを指 定する必要があります • Playerゲームオブジェクを選択状態にする • PlayMaker Editorの左側のエリアでマウス右ボタン を押し、[状態遷移を追加]を実行(次スライド参照) 53

54.

プレイヤーの移動 • マウス右ボタンを押した直後の画面 54

55.

PlayMakerの操作の基本 • 「状態遷移を追加」直後の様子 55

56.

用語の解説 • PlayMakerで使用する用語とイメージ 開始イベント (システムイベント) 遷移 ステート (状態) 56

57.

タブの選択 FSMの名前 • FMSの名前の初期設定は 「状態遷移」です。 • PlayMaker Editorの右側 の上にある「状態遷移」 タブを選択し、すぐ下の 欄で名前を変更できます。 • ここではPlayerController に変更します。 FSMの名前 57

58.
[beta]
スクリプト(イメージ)
using UnityEngine;
using System.Collections;
public class PlayerController : MonoBehaviour {
public float speed;
private Rigidbody rb;
void Start ()
{
rb = GetComponent<Rigidbody>();
}
void FixedUpdate ()
{
float moveHorizontal = Input.GetAxis ("Horizontal");
float moveVertical = Input.GetAxis ("Vertical");
Vector3 movement = new Vector3 (moveHorizontal, 0.0f, moveVertical);
rb.AddForce (movement * speed);
}
}

58

59.

変数の定義 • PlayMakerにおける変数は2種類 • ローカル変数(そのFSMのみで使える変数) • グローバル変数(FSM間で利用できる変数) • 変数はInspectorに表示/非表示が選択可能 • Inspectorに表示させるとUnity Editorから直接 値の入力や設定が可能 59

60.
[beta]
スクリプト(イメージ)
using UnityEngine;
using System.Collections;
public class PlayerController : MonoBehaviour {
public float speed;
private Rigidbody rb;
void Start ()
{
rb = GetComponent<Rigidbody>();
}

float型
インスペクター表⽰示(public)
Rigidbody型
インスペクター⾮非表⽰示(private)

void FixedUpdate ()
{
float moveHorizontal = Input.GetAxis ("Horizontal");
float moveVertical = Input.GetAxis ("Vertical");
Vector3 movement = new Vector3 (moveHorizontal, 0.0f, moveVertical);
rb.AddForce (movement * speed);
}
}

60

61.
[beta]
スクリプト(イメージ)
using UnityEngine;
using System.Collections;
public class PlayerController : MonoBehaviour {
public float speed;
private Rigidbody rb;
void Start ()
{
rb = GetComponent<Rigidbody>();
}

float型変数が2つ

void FixedUpdate ()
{
float moveHorizontal = Input.GetAxis ("Horizontal");
float moveVertical = Input.GetAxis ("Vertical");

Vector3型変数

Vector3 movement = new Vector3 (moveHorizontal, 0.0f, moveVertical);
rb.AddForce (movement * speed);
}
}

61

62.

PlayMakerによる変数の定義 • 変数を作成するには、PlayMaker Editorの[変数]タブを選択し、下の[新 しい変数]欄に変数名を入力し、変数 の型を選択して、[追加]ボタンを押し ます。 • すると変数が作成されて、さらに詳 細設定画面が表示されます。 • 続けて変数を作成するときは、一旦 空いている箇所をクリックしてから 行ってください。 62

63.

PlayMakerによる変数の定義 • 右図はPlayMakerで標準的に指定でき る型の一覧 • Rigidbody型は一旦Object型で作成し、 選択した後に表示される詳細設定画面 にて、Object TypeをUnityEngine > Rigidbodyに変更します。 63

64.

PlayMakerによる変数の定義 • 変数を追加した後のイメージ 64

65.

PlayMakerによる変数の定義 • Speedは変数の詳細 設定画面の「イン スペクタ」をチェ ックすると Inspectorビューに 表示されます • 値は好みで変えて ください。ここで は10とします。 65

66.

処理の記述(アクション) • PlayMakerにおける処理は「アクション」と記 述します。 • アクションは「状態(ステート)」に記述します。 • つまり、特定の状態になった時の処理をアクシ ョンとして記述します。 66

67.
[beta]
スクリプト(イメージ)
using UnityEngine;
using System.Collections;
public class PlayerController : MonoBehaviour {
public float speed;
private Rigidbody rb;
void Start ()
{
rb = GetComponent<Rigidbody>();
}

アクションとして記述する

void FixedUpdate ()
{
float moveHorizontal = Input.GetAxis ("Horizontal");
float moveVertical = Input.GetAxis ("Vertical");
Vector3 movement = new Vector3 (moveHorizontal, 0.0f, moveVertical);
rb.AddForce (movement * speed);
}
}

67

68.

処理の記述(アクション) • PlayMaker Editorの 「State1」を選択 • [状態]タブの「State1」 を「Init」に変更 68

69.

処理の記述(アクション) • アクションの一覧は[状態]タブの下 にある[アクションブラウザ]ボタン を押すと表示されます。 • 慣れるまで大変ですが、上の検索 欄に単語を入力すると絞り込みが できるのでうまく使ってください。 69

70.

処理の記述(アクション) • アクションブラウザの検索欄に 「get com」と入力するとGet Componentアクションが絞り込 まれます。 • [状態にアクションを追加]ボタ ンを押すとアクションが追加さ れます。 • なお、アクションブラウザは邪 魔なら閉じるか、Inspectorの裏 に移動すると良いでしょう。 70

71.

処理の記述(アクション) • Get Componentアクショ ンは対象となるゲームオ ブジェク(Game Object) から値を格納する変数 (Store Component)の型 に応じたコンポーネント 取得して格納します。 • Every Frameは毎フレー ムごとに実行するかどう かを指定するチェックボ ックスです。 71

72.

処理の記述(アクション) • 赤丸!の記号は指定を 誤っていたり、必須 パラメータが不足し ていることを表して います。 何か問題がある ここに問題がある 72

73.

処理の記述(アクション) • Store Componentの Noneをクリックして rbを選択します。rb とは変数の定義で Rigidbody型として指 定した変数です。 73

74.

処理の記述(アクション) • Every Frameチェックボ ックスは毎フレーム実 行するかどうかを指定 します。今回は初期化 の一回だけなのでチェ ックしません。 • Init状態におけるアクシ ョンはこれで完成です。 74

75.

実行と状態のリアルタイム確認 • Playボタンを押してプレビューしましょう • PlayMaker Editorの左側のグリーンの枠は現在 の状態を表しています。 • 変数のrbを選択するとValueに Player(Rigidbody)を表示されています。これは PlayにアタッチされているRigidbodyコンポー ネントへの参照を得たことを表しています。 • 次スライド参照 75

76.

実行と状態のリアルタイム確認 現在の状態 76

77.

実行と状態のリアルタイム確認 • 【重要】Playボタンをもう一度押してプレビュ ーを止めてから続きのアクションを書きます。 77

78.

参考:毎フレームアクションの記述 • FixedUpdate()関数の部分を記述します。 • Unityには3つのUpdate()関数があります。 • Update() • 一般的なキー入力やゲーム内の様々な判定処理など • FixedUpdate() • 物理エンジンを用いた処理を記述する • LateUpdate() • すべてのUpdate()終了後に呼び出される。主にカメラの 制御に使用する 78

79.

参考:毎フレームアクションの記述 • PlayMakerでは一般的なルールに基づいてアクシ ョンが定義されていますので、スクリプトによる プログラミングのルールをそこまで意識しなくて も良い構造になっています。 •例 • GetAxisアクション:Update()で実行 • AddForceアクション:FixedUpdate()で実行 • 詳細はAssets/PlayMaker/Actions/にあるスクリプ トを参照してください。 79

80.

キー入力 • キーボードに限らずマウ ス、コントローラー、タ ブレットなど全ての入力 処理はすべてInputが行い ます。 • 今回はVirtual Inputによ る入力を使用しています。 80

81.

キー入力 • Virtual InputはUnityが用意している汎用的な入 力システムです。 • 「水平移動」、「垂直移動」、「ボタン1」な どキーボード、コントローラ、マウスに関わら ず同じように扱うことができるようにしたシス テムです。 • 初期設定はUnityの[Edit]-[Project Settings][Input]で確認ができます。 81

82.

キー入力 • Virtual Inputの初期設定 • 今回はHorizontal(水平)と Vertical(垂直)を使用します。 • 値は -1から1までの範囲 • 二箇所に同じ記述がありますが、 上はキーボード(矢印キーと WASDキー)で、下はコントロ ーラの十字キーが設定されてい ます。 82

83.
[beta]
スクリプト(イメージ)
using UnityEngine;
using System.Collections;
public class PlayerController : MonoBehaviour {
public float speed;
private Rigidbody rb;
void Start ()
{
rb = GetComponent<Rigidbody>();
}

InputのGetAxis()を使⽤用してキーの⼊入⼒力状態を取得。
そこで得られた値をそれぞれの変数に代⼊入している。

void FixedUpdate ()
{
float moveHorizontal = Input.GetAxis ("Horizontal");
float moveVertical = Input.GetAxis ("Vertical");
Vector3 movement = new Vector3 (moveHorizontal, 0.0f, moveVertical);
rb.AddForce (movement * speed);
}
}

83

84.

キー入力 • Play Maker Editorでどこか空いているところで 右クリックし、「状態の追加」を実行します。 84

85.

キー入力 • 「State 1」の名前を 「Moving」に変更 • アクションブラウザを開く • アクションブラウザの検索 欄に「GetAx」と入力し、 「Get Axis」を選択 • アクションブラウザの[状 態にアクションを追加]ボ タンを2回押す。 85

86.

キー入力 • Axis Nameにそれぞれ 「Horizontal」、 「 Vertical」と 入力。 • 一字一句正確に大文字小文字を 間違えずに入力しなければなり ませんので、先ほど紹介した Input Settingsからコピーするこ とをお勧めします。 • Storeにはそれぞれ moveHorizontal、moveVertical を指定 86

87.

キー入力 • シーンを保存してPlay ボタンを押します。 • しかし、状態はInitの ままになっています。 これはMoving状態に 遷移するイベントがな いからです。 87

88.

InitからMoving状態への遷移 • 【重要】Playボタンをもう一度押して プレビューを止めてから続きのアクシ ョンを書きます。 • Init状態を選択し、右クリックして[遷 移を追加]-[FINISHED]を実行します。す ると状態の下に[遷移イベント]が追加さ れます。 • FINISHEDイベントはこの状態に記述し たアクションをすべて実行した後に発 生するイベントです。 • 赤丸!マークはそのイベントが発生した 後に遷移する状態の指定が無いためで す。正しく指定すると消えます。 88

89.

InitからMoving状態への遷移 • InitのFINISHEDをマウスの左ボタンでクリックし ながらMovingまで移動して手を離すことで遷移 先を指定することできます。 89

90.

InitからMoving状態への遷移 • シーンを保存してPlayボタ ンを押します。 • 無事にMoving状態に遷移 しました。 • キーの入力状況は変数に格 納していますが、まだ球を 動かすアクションを記述し ていないので動きません。 90

91.

移動処理 • 今回採用した移動方法は自分自身(球)に「力」 を加える方法です。 • 力を加えるのはAddForceアクションを使用し ます。 • 力の強さはキーボードから入力した値に外部か ら指定したSpeedを掛けた値を使用します。 91

92.
[beta]
スクリプト(イメージ)
using UnityEngine;
using System.Collections;
public class PlayerController : MonoBehaviour {
public float speed;
private Rigidbody rb;
void Start ()
{
rb = GetComponent<Rigidbody>();
}

InputのGetAxis()で得られた値をX⽅方向(左右)とZ⽅方向
(前後)に設定してmovementを求める

void FixedUpdate ()
{
float moveHorizontal = Input.GetAxis ("Horizontal");
float moveVertical = Input.GetAxis ("Vertical");

Vector3 movement = new Vector3 (moveHorizontal, 0.0f, moveVertical);
rb.AddForce (movement * speed);
}
}

Movementにspeedを掛けた値だけ⼒力を加える

92

93.

移動処理 • XYZに変数や値を指定してVector3型の変数を新た に作成するアクションはSet Vector3 XYZです。 • まずMoving状態を選択し[状態]タブを選択し、[ア クションブラウザ]ボタンを押して起動します。 • 検索欄にset vector3と入力して、 Set Vector3 XYZ を選択してから[状態にアクションを追加]ボタンを 押します。 93

94.

移動処理 • アクションの挿入位置は どうなりましたか? • アクションの実行順番は 上から下に向かって実行 します。 • もし一番上にアクション が挿入された場合、この ままではキーボードで入 力した値を得る前に計算 してしまい誤動作の元に なります。 処 理 順 番 94

95.

移動処理 • アクションの順番を入れ替えるには2通りの方 法があります。 • アクション名(Set Avtor3 XYX、Get Axisなど)をマウ スでD&Dする • 歯車メニューの中から「アクションを下に移動」 「アクションを先頭に移動」などを選択する 95

96.

移動処理 • 歯車アイコンのメニューによる移動 96

97.

移動処理 • このような順番になる ように調整してくださ い。 97

98.

移動処理 • Set Vector3 XYZを次のように 設定してください。 • 各変数の右にある二重線をク リックすると、変数による指 定と値による指定を切り替え ることができます。 • Yは値による指定に切り替え て0を入力しています。 • 毎フレーム計算をするために Every Frameをチェックします。 98

99.

移動処理 • Moving状態にAdd Forceアクションを追 加。 • 実行順番が最後になっ ていることを確認して 適宜調整してください。 • 変更点はVectorと Every Frameです。 99

100.

移動処理 • シーンを保存してPlayボタンを押して動作確認 • これでボールが動くようになりました。 • しかし、想定よりとても遅いです。これはSpeed を掛ける処理を行っていなためです。 • Speedパラメータを使用するためにSet Vector3 XYZとAdd Forceの間にアクションを追加します。 100

101.
[beta]
スクリプト(イメージ)
using UnityEngine;
using System.Collections;
public class PlayerController : MonoBehaviour {
public float speed;
private Rigidbody rb;
void Start ()
{
rb = GetComponent<Rigidbody>();
}

InputのGetAxis()で得られた値をX⽅方向(左右)とZ⽅方向
(前後)の⼒力にするためにVector3を求めている

void FixedUpdate ()
{
float moveHorizontal = Input.GetAxis ("Horizontal");
float moveVertical = Input.GetAxis ("Vertical");

Vector3 movement = new Vector3 (moveHorizontal, 0.0f, moveVertical);
rb.AddForce (movement * speed);
}
}

Movementにspeedを掛けた値だけ⼒力を加える

101

102.

移動処理 • Vector3とfloatの掛け算を行うアクションは Vector3 Multiplyです。 • 参考 • • • • 足し算:Add 引き算:Subtract 掛け算:Multiply 割り算:Divide 102

103.

移動処理 • Set Vector3 XYZとAdd Force の間にVector3 Multiplyアク ションを追加します。 • Vector3 Variableを movementに、Multiply Byを speedに設定(右の二重線をク リックして変数を使用するの を忘れずに) • Every Frameをチェックしま す。 103

104.

移動処理 • シーンを保存してPlayボ タンを押しましょう。 • これで先ほどの10倍の速 度で移動します。 • もし移動しない場合は、 Inspectorビューのspeed に10を設定してから再度 実行し直してください。 104

105.

補足 • 実は変数rb(Rigidbody型)は使用していません。 • PlayMaker側で用意しているAddForceアクショ ンの内部で指定されたGameObjectにアタッチ されているRigidbodyコンポーネントへの参照 を取得しています。 (今回は自分自身のGameObject) 105

106.

これまでのデータ • もしこの時点でうまくいかなかった場合は、 Roll-a-ball_Playmaker.zipに含まれているRoll-aball_Playmaker2 のプロジェクトファイルを開 いて次に備えてください(別途PlayMakerのイ ンストールもお忘れなく)。 106

107.

2.3. カメラの移動 107

108.

カメラの移動 • ボールの動きに合わせてカメラを移動させます。 • イメージとしては常にボールの正面を捉えなが ら移動します。 • Unityではすべてのキャラクターの移動が終わ った後にカメラを動かすためにLateUpdate()が 用いられます。 108

109.

スクリプト(イメージ) using UnityEngine; using System.Collections; public class CameraController : MonoBehaviour { public GameObject player; private Vector3 offset; void Start () { offset = transform.position - player.transform.position; } void LateUpdate () { transform.position = player.transform.position + offset; } } 109

110.

カメラの移動 • HierarchyのMain Cameraを選択し、[PlayMaker][Components]-[Add FSM To Selected Objects]を実行 • PlayMaker Editorの[状態遷移]タブの「状態遷移」を 「CameraController」に変更 • PlayMaker Editorの[状態]タブの「State 1」を「Init」 に変更 • [変数]タブでplayerとoffset変数を追加。playerは[イン スペクタ]をチェックする(インスペクタで値の指定が できる) 110

111.

カメラの移動 • 登録のイメージ 111

112.

カメラの移動 • Init状態ではPlayerとカメラとの差分を計算して offset変数に代入しています。あとでこれを使用し ます。 void Start () { offset = transform.position - player.transform.position; } • C#では「(自GameObjectの)transformのpositionプ ロパティを取得し、そのまま続けてplayerゲーム オブジェクとのtransformのpositionを取得し引き 算する」のように複数の処理を一度に書くことが できます。 112

113.

カメラの移動 • PlayMakerでは基本的に一つ一つ丁寧にアクションと 指定記述します。 • 自GameObjectのPositionを取得して「格納する」(A) • 指定されたGameObjectのPositionを取得して「格納する」(B) • (A)-(B)の結果をoffsetに格納する • つまり、(A)と(B)の値を格納する変数が別途必要にな ります。 • ここでは少しだけ処理を効率的に行う方法を紹介しま す。どうしてこれでうまくいくかご自身で考えてみて ください。 113

114.

カメラの移動 • 予め[変数]タブですべての変数を指定しても良いの ですが、必要に応じて追加する方法も紹介します。 • Main Cameraを選択し、PlayMaker EditorのInit状 態を選択し、Get Positionアクションを追加 • Get PositionのVectorをクリックし、[New Variable…]を実行 • New Variableと入力欄が表示されるので[offset]と 入力し、[Create Variable]ボタンを押す 114

115.

カメラの移動 115

116.

カメラの移動 • もう一つGet Positionを追加 • Game Objectを[Specify Game Object]に変更 • すぐ下に入力欄が増えるので、変数を指定に切り 替える • 変数playerを選択 • VectorでNew Variable…]を実行 • New Variableと入力欄が表示されるので [playerPos]と入力し、[Create Variable]ボタンを押 す 116

117.

カメラの移動 117

118.

カメラの移動 • Vector3 Subtractアクションを追加(処理順番は最 後) • Vector3 Variableにoffset、Subtract Vectorに playerPosを指定 118

119.

カメラの移動 • Trackingステートを追加 • InitステートにFINISHED遷移を追加 • InitステートのFINISHED遷移からTrackingステ ートへの遷移を追加 119

120.

カメラの移動 • プレイヤーの現在位置を取得(Get Position) • プレイヤーの現在位置にoffsetを加える(Vector3 Add) • 計算結果を自GameObjectのtransformのPositionに 代入する(Set Position) • すべてEvery Frameをチェックする • 最後のSet PositionのLate Updateをチェックする 120

121.

カメラの移動 121

122.

カメラの移動 • カメラの高さと向きを調整します。好みで変え ても構いません。 122

123.

カメラの移動 • 最後にMain Cameraの Inspectorの Play Maker FSMコンポーネント内 のplayerにInspectorの Playerゲームオブジェ クとをD&Dする 123

124.

カメラの移動 • シーンを保存してPlayボタンを押しましょう。 • Player(球)を移動させるとカメラが追いかけて くるはずです。うまくいかない場合は何度も見 直してみてください。 124

125.

これまでのデータ • もしこの時点でうまくいかなかった場合は、 Roll-a-ball_Playmaker.zipに含まれているRoll-aball_Playmaker3 のプロジェクトファイルを開 いて次に備えてください(別途PlayMakerのイ ンストールもお忘れなく) 。 125

126.

2.4.カメラとプレイエリア 126

127.

ステージ枠の作成 • プレイヤー(球)は床のないところに移動すると 落ちてしまいます。 • そこで壁を作ります。 • まず、空のGameObject(Empty GameObject)を 作成し、Position(0, 0, 0)にします。 • 名前をWallsとします。 127

128.

ステージ枠の作成 • Wallsを選択し、[Create]-[3D Object]-[Cube]を 作成。名前をWest Wallに変更。 • Transformを以下のように変更 128

129.

ステージ枠の作成 • West Wallを[Ctrl]-[D](Win) / [Cmd]-[D](Mac)で複 製して同様に壁を作成 129

130.

ステージ枠の作成 名前 Position Rotation West  Wall -‑10, 0,  0 0,  0,  0 East  Wall 10,  0,  0 0,  0,  0 North  Wall 0,  0,  10 0,  90,  0 South   Wall 0,  0,  -‑10 0,  90,  0 Scaleはすべて(0.5, 2, 20.5) 130

131.

ステージ枠の作成 • シーンを保存してPlayボタンを押しましょう。 • これでステージから落ちなくなります。 • もしこの時点でうまくいかなかった場合は、 Roll-a-ball_Playmaker.zipに含まれているRoll-aball_Playmaker4 のプロジェクトファイルを開 いて次に備えてください(別途PlayMakerのイ ンストールもお忘れなく) 。 131

132.

収集アイテムの作成 • プレイヤーが移動して集め得るアイテムを作成 します。 • アイテムはCubeを加工したものです。 • [GameObject]-[3D Object]-[Cube]でCubeを作成 • 名前を「Pick Up」に修正 • Transformを以下のように修正 • Position(0, 0.5, 0) • Rotation(45, 45, 45) • Scale(0.5, 0.5, 0.5) 132

133.

収集アイテムの作成 • アイテムっぽくするために自転させます • スクリプトのイメージ クラス名 using UnityEngine; using System.Collections; 毎フレーム PlayMakerではFSM名 public class Rotator : MonoBehaviour { void Update () 回転する { transform.Rotate (new Vector3 (15, 30, 45) * Time.deltaTime); } } X軸15度 Y軸30度 Z軸45度 1フレームの時間 133

134.

収集アイテムの作成 • Pick Upゲームオブジェク を選択 • PlayMaker Editorで右クリ ックし[状態遷移を追加]を 実行 • [状態遷移]タブを開いて 「状態遷移」を 「Rotator」に変更 • 「State 1」ステートの名 前をRotatingに変更 134

135.

収集アイテムの作成 • Rotatingステートを選択し、 アクションブラウザから Transformの[Rotate]を追加 • X Angle, Y Angle, Z Angleに それぞれ15, 30, 45を代入 • Pre Second(指定した角度は 1秒あたりの角度とみなす) をチェック • Every Frameをチェック(初期 設定でチェック済み) 135

136.

収集アイテムの作成 • このままPlayをするとプレイ ヤーと同じ座標なので開始と 同時に衝突しておかしな動き になります。 • そのため一時的にPlayerを無 効にします。 • Playerを選択して、Inspector の左上のチェックを外します 136

137.

収集アイテムの作成 • シーンを保存してPlayボタンを押しましょう。 • ゆっくりと回転すれば成功です。 137

138.

収集アイテムの作成 • 収集アイテムをプレハブにします • プレハブ(Prefab) • シーン上で様々な設定を施したゲームオブジェクを資産(Asset)にして再 利用することができる仕組み。 • PrefabをシーンにD&Dすると、同じ設定のゲームオブジェクを作成でき ます(インスタンス化するとも言う)。 • ProjectビューのPrefabを変更するとシーンに複製されたゲームオブジェ クもまとめて変更できる • Prefabからシーンに作成されたゲームオブジェクと変更し、Inspectorの 上にある「Apply」ボタンを押すと変更した内容をProjectビューの Prefabに適用する。結果、同じPrefabから作成されたゲームオブジェク も同じように変更される • Prefabからシーンに作成されたゲームオブジェクと変更し、Inspectorの 上にある「Apply」ボタンを押すと変更を破棄します。 138

139.

収集アイテムの作成 • PlayMakerを使用しているゲームオブジェクトにおけるPrefab の注意点 • PlayMakerは基本的にPrefabから作られたGameObject(インスタン ス)を編集できません。ProjectビューにあるPrefabを編集してくださ い。 • 誤って編集しようとすると下図のようなダイアログが表示されます。 その場合は[Edit Prefab]を選択してPrefabを編集してください。 139

140.

収集アイテムの作成 • Prefabの作成 • Projectビューで「Prefabs」フォルダーを作成 • HierarchyビューのPick Upゲームオブジェクとを ProjectビューのPrefabsフォルダーにD&D 140

141.

収集アイテムの作成 • 収集アイテムを合計12個作成 • 詳細(1/2) • 収集アイテムをまとめて管理す るために空のゲームオブジェク トを作成([GameObject]-[Create Empty]。 名前:Pick Ups Position: (0, 0, 0) • Pick UpをPickUpsの子にする 141

142.

収集アイテムの作成 • 収集アイテムを合計12個作成 • 詳細(2/2) • Pick Upを選択し、複製([Ctrl]-[D](Win) / [Cmd]-[D](Mac))を11回行う 142

143.

収集アイテムの作成 • それぞれ適当に並べてくだ さい。 • 時計をイメージして並べる といいでしょう。 143

144.

収集アイテムの作成 • 白いままでは寂しいので色をつ けます。 • ProjectビューのMaterialsフォルダ ーにあるBackgroundを選択し、複 製([Ctrl]-[D](Win) / [Cmd]-[D](Mac)) して、名前をPick Upに変更 • Pick UpマテリアルのAlbedoのカラ ーピッカーを開いてR:255, G:255, B:0に変更 • Pick UpマテリアルをPick Upプレハ ブにD&D 144

145.

収集アイテムの作成 • シーンを保存してPlayボタンを押しましょう。 • すべての収集アイテムがゆっくりと回転すれば成 功です。 • もしこの時点でうまくいかなかった場合は、 Rolla-ball_Playmaker.zipに含まれているRoll-aball_Playmaker5 のプロジェクトファイルを開いて 次に備えてください(別途PlayMakerのインストー ルもお忘れなく) 。 145

146.

3. 衝突判定 146

147.

3.1. Unityにおける衝突判定 147

148.

衝突とは • Unityにおける衝突はCollider同士がぶつかった状態 を表す • 静的コライダー (各種コライダ+Rigidbodyコンポーネントなし) • 床、壁など動かない要素 • 動的コライダー (各種コライダ+ Rigidbodyコンポーネントあり) • プレイヤーのように動く要素 148

149.

衝突の発生条件 • 静的コライダー と 静的コライダー • 衝突イベントが発生しない • 静的コライダー と動的コライダー • 衝突イベントが発生する • 動的コライダー と動的コライダー • 衝突イベントが発生する 149

150.

衝突の発生条件(補足) • Rigidbodyコンポーネント のIs Kinematicオプション • Kinematicオン • スクリプトによる制御だけ で動かす。 • 衝突判定はKinematicオフの 動的コライダーのみ発生 • 主な利用用途 • スライドドア、ラグドール など 150

151.

衝突イベント • 衝突条件が成立した時に呼び出されるイベント • OnCollisionEnter • コライダーが触れた • OnCollisionStay • 衝突中 • OnCollisionExit • コライダーが離れた 151

152.

トリガーイベント • 衝突ではなく、自動ドアやト ラップのような見えないスイ ッチに触れた時に発生するイ ベントをトリガーイベントと 呼んでいます • Unityでは各コライダにある 「Is Trigger」プロパティをチ ェックすると、衝突イベント が発生せずにすり抜けてしま い、トリガーイベントが発生 します 152

153.

トリガーイベント • トリガー条件が成立した時に呼び出されるイベ ント • OnTriggerEnter • トリガーに触れた • OnTriggerStay • トリガーに触れている最中 • OnTriggerExit • トリガーから離れた 153

154.

参考: コライダーの衝突に関する詳細情報 • Unityオンラインマニュアル • https://docs.unity3d.com/ja/current/Manual/Collid ersOverview.html 衝突アクションマトリクス 154

155.

収集アイテムとの衝突判定 • 収集アイテムと触れた時、 反発しては困るので「ト リガーイベント」を使用 します。 • トリガーイベントを発生 させるためにPick Upプレ ハブのBox ColliderのIs Triggerをチェックします 155

156.

タグの設定 • Pick Upプレハブを選択し、InspectorのTagをクリックして、[Add Tag…]を実行 • Tag & Layers Setting画面のTagsの下にある「+」ボタンを押して 「Pick Up」と入力し、[Save]ボタンを押す 156

157.

3.2. Playmakerにおける衝突処理 157

158.

トリガーイベント • Playerゲームオブジェクトが非アクティブのまま なので、アクティブに戻します。 • Playerゲームオブジェクトを選択し、 PlayMakerEditorで右クリックして[状態を追加]を 実行 • 「State 1」を「Picking Up」に変更 • Picking Upステートを選択し、右クリックして[グ ローバル遷移を追加]-[System Events]-[TRIGGER ENTER]を実行 158

159.

トリガーイベント 159

160.

トリガーイベント 160

161.

参考:ステートの色を変更 • ステートを右クリック して[色の設定]の中に ある色を選ぶと、ステ ートの背景色を変更す ることができます。 161

162.

トリガーイベント後の処理 トリガーイベントが 発⽣生 トリガー元の情報が格納 された変数 void OnTriggerEnter(Collider other) { if (other.gameObject.CompareTag ("Pick Up")) { トリガー元のTagが “Pick  Up”か調べる other.gameObject.SetActive (false); } } トリガー元を⾮非アクティブにする 162

163.

トリガーイベント後の処理 • Picking UpステートにGet Trigger Infoアクションを追加 • Game Object Hitに新規に作成した「other」変数を設定 163

164.

トリガーイベント後の処理 • 続けて、Game Object Compare Tagアクションを追 加 • Game Objectにotherを設定 • TagにPick Upを設定 164

165.

トリガーイベント後の処理 • Compera関連のアクションは何かの比較を行 い、それが合っている時(True)と、合っていな い時(False)でそれぞれイベントを設定するこ とができます。 • これまで扱ってきたイベントはどれも事前に PlayMakerが用意した物でしたが、独自にイベ ントを作ることもできます。 165

166.

トリガーイベント後の処理 • [イベント]タブをクリ ック • このFSMで使用して いるイベントの一覧 が表示されます 166

167.

トリガーイベント後の処理 • [イベントを追加]に「Get Item」と入力してEnter キー(MacはReturnキー)を押すと独自イベントを追 加することができます。 167

168.

トリガーイベント後の処理 • [状態]タブに戻り、Get Object Compare TagのTrue Eventをクリックして「Get Item」を選択 • すると警告が出るので赤字 の部分をクリックすると状 態遷移が追加されます。 ここをクリック 168

169.

トリガーイベント後の処理 まだ遷移先のステートが設 定されていないので⾚赤丸!が 付いている 169

170.

トリガーイベント後の処理 • PlayMaker Editorの空いている 場所で右クリックし[状態の追 加]を実行 • ステート名を「State 1」から 「Getting Item」に変更 • Getting Itemステートを選択し てActivate Game Objectアクシ ョンを追加 • Game Objectを「Specify Game Object」に変更し、 other変数を指定する • Activateのチェックを外す 170

171.

トリガーイベント後の処理 • PlayerController FSMの全体図 171

172.

トリガーイベント後の処理 • シーンを保存してPlayボ タンを押しましょう。 • アイテムを取ると Getting Itemステートで 止まってしまいます。 • Getting Itemのアクショ ンが終了したらMoving に戻るようにしましょ う。 172

173.

トリガーイベント後の処理 • Getting Itemを選択し、右クリックで[遷移を追加][FINISHED]を実行 • 追加されたFINISHED遷移をクリックしながら MovingステートにD&D 173

174.

トリガーイベント後の処理 • シーンを保存してPlayボタンを押しましょう。 • 収集アイテムに触れるとアイテムが消えるのと、 プレイヤーの操作を続けることできるようになれ ば成功です。 • もしこの時点でうまくいかなかった場合は、 Rolla-ball_Playmaker.zipに含まれているRoll-aball_Playmaker6 のプロジェクトファイルを開いて 次に備えてください(別途PlayMakerのインストー ルもお忘れなく) 。 174

175.

4. Unity UIとの連携 175

176.

4.1. Add-Onの使い方(ecosystem) 176

177.

Add-Onパッケージとは • 収集アイテム数の表示用にuGUIを利用します。 • uGUIは正式にはUnity UIと呼ばれ、Unity4.6から追 加された機能です。 • 従来のOnGUIメソッドによるUI表示の弱点を克服 し、2Dはもちろん、3Dオブジェクトしても配置が できるなど非常に汎用性の高いUIパッケージです。 • PlayMakerは標準でuGUIに対応していないため Add-Onパッケージを使用します。 177

178.

Add-Onのダウンロード • Add-Onを使うには[PlayMaker]-[Addons][Download Addons]を実行します。 178

179.

Add-Onのダウンロード • Webブラウザが起動し ます。表示されたペー ジの一番上にある 「Ecosystem Browser」のリンクを クリックします。 179

180.

Add-Onのダウンロード • 次のページの EcosystemBrowser Packageをクリックし てダウンロードします。 180

181.

Add-Onのインポート • ダウンロードが完了し たらファイルを開き、 Unityにインポートしま す。 181

182.

Add-Onのインポート • Add-Onのインポートが完了したら、 [PlayMaker] -[Addons]-[Ecosystem]-[Ecosystem Browser]を実行してください。 182

183.

Add-Onのインポート • [Use the ecosystem!]ボタンを押す 183

184.

Unity UI連携パッケージのインストール • Ecosystem browserの 検索欄にuguiと入力し て[Search]ボタンを押 す • 「u GUI Proxy Full」に マウスを移動させると [Get]ボタンが表示され るのでそれを押す 184

185.

Unity UI連携パッケージのインストール • インストールの様子 185

186.

4.2. Add-Onで追加できる主な機能一覧 186

187.

Add-onパッケージ • Add-onのダウンロードページには様々なアド オンが紹介されています。 • Unity Action Packs • • • • • Blend Shapes Shuriken Unity UI(今回はこちらを使用) Unity Pathfinding IOS Game Controller 187

188.

Add-onパッケージ • Third Party Tools • • • • • • • 2D Toolkit A* pathfinding Final IK MegaFiers PoolManager Third Person Controller など 188

189.

Add-onパッケージ • Starter Kits • • • • 3D Infinite Runner for Playmaker Platforming Starter Kit Playmaker Essentials Pack など 189

190.

Add-onパッケージ • Extensions • • • • • • ArrayMaker Comms Tool PlayerPrefs X TimeLine for PlayMaker DataMaker など 190

191.

4.3. UIのTextを変更 191

192.

得点表示用のUI • uGUIをPlayMakerから使うときは[PlayMaker uGui] -[Prefabs]-[Playmaker UGui]プレハブをシ ーンに追加します。 192

193.

得点表示用のUI • 体力表示のTextはHierarchy Viewから[Create][UI]-[Text]で作成します。 • CanvasやEventSystemは自動的に生成される ものなので削除しないようにしてください。 193

194.

得点表示用のUI • CanvasのCanvas Scaleを以下のように修正し てください。これにより端末の解像度に依存し ないUIが作成できます。 194

195.

得点表示用のUI • Game Viewの左上の「Free Aspect」を16:9な どに変更します。 195

196.

得点表示用のUI • Canvas/Textをダブルクリックすると非常に大 きな白い枠が表示されています。この白い枠は UI専用の枠でGame Viewには表示されません。 196

197.

得点表示用のUI • TextをScoreに名前を変更。 • ScoreのRect Transformコ ンポーネントを次のように 修正 注意! 197

198.

得点表示用のUI • ScoreのTextコンポーネン トを次のように修正 198

199.

得点表示用のUI • Gameビューのイメージ 199

200.

クリアメッセージ用のUI • HierarchyのCanvasを選択し、右クリックで [UI]-[Text]を実行(Canvasの下にTextが作成され る) • TextをWinに変更 200

201.

クリアメッセージ用のUI • WinのRect Transformコ ンポーネントを次のよう に修正 201

202.

クリアメッセージ用のUI • ScoreのTextコンポーネント を次のように修正 202

203.

クリアメッセージ用のUI • Gameビューのイメージ 203

204.
[beta]
スクリプト(イメージ)
using UnityEngine;
using UnityEngine.UI;
using System.Collections;

Unity  UIのパッケージ名

public class PlayerController : MonoBehaviour {
public float speed;
public Text countText;
public Text winText;

スコアおよびクリア
メッセージ⽤用

private Rigidbody rb;
private int count;
void Start ()
{
rb = GetComponent<Rigidbody>();
count = 0;
SetCountText ();
winText.text = "";
}

アイテムを取得した数

初期化処理

<<< 続く >>>
204

205.
[beta]
スクリプト(イメージ)
<<< 続き >>>
void FixedUpdate ()
{
float moveHorizontal = Input.GetAxis ("Horizontal");
float moveVertical = Input.GetAxis ("Vertical");
Vector3 movement = new Vector3 (moveHorizontal, 0.0f, moveVertical);
rb.AddForce (movement * speed);
}
void OnTriggerEnter(Collider other)
{
if (other.gameObject.CompareTag ( "Pick Up"))
{
other.gameObject.SetActive (false);
count = count + 1;
SetCountText ();
}
}
<<< 続く >>>

アイテムを取得した数を1つ増やして、
得点を更新
205

206.
[beta]
スクリプト(イメージ)
void SetCountText ()
{
countText.text = "Count: " + count.ToString ();
if (count >= 12)
{
winText.text = "You Win!";
}
}
}

“Count:  取得数”という⽂文字列を⽂文字列を表⽰示
取得数が12以上ならクリアメッセージを表⽰示

206

207.

Unity UIのText用変数の追加 • Playerを選択し、PlayMaker Editorの[変数]タブを開く • 変数名: score、 型:GameObjectを新規作成 • インスペクタをチェック 207

208.

Unity UIのText用変数の追加 • 変数名: win、型: GameObjectを 新規作成 • インスペクタをチェック 208

209.

count変数の追加 • 変数名:count、型: intを追加 209

210.

インスペクタによる指定 • PlayerのInspectorのPlay Maker FSMのscoreの右にある◎をク リックして表示されたダイア ログのScoreを選択 • これはSceneのScoreゲームオ ブジェクトをD&Dしてもできま す。どちらの操作でも構いま せん。 • 同様にwinも設定してください。 210

211.

初期化処理(Initステート) • Initステートを選択 • アクションブラウザか らSet Int Valueを追加 • Int Variableにcountを設 定 • Int Valueは0(初期値) 211

212.

初期化処理(Initステート) • Initステートにおいてアクショ ンブラウザからU GUI Text Set Textを追加 • 図を参照して値を設定 212

213.

初期化処理(Initステート) • Initステートにおいてアクシ ョンブラウザからU GUI Text Set Textを2つ追加 • 図を参照して値を設定 • 変数winのText欄にはスペー スを一つ入力してください 213

214.

初期化処理(Initステート) • シーンを保存して Playボタンを押しま しょう。 • 左上に「Count: 0」、 Winは空欄になれば 成功です。 214

215.

アイテムの取得(Getting Item) • Getting Itemステートを 選択し、Int Addアクシ ョンを追加 • 図を参考に設定 215

216.

アイテムの取得(Getting Item) • Getting Itemステートを選 択し、Convert Int To StringとBuild Stringアクシ ョンを追加 • 図を参考に設定 “:”の後ろに空⽩白を1つ追加する 216

217.

アイテムの取得(Getting Item) • Getting Itemステートを選択し、 U GUI Text Set Textを追加 • 図を参考に設定 217

218.

アイテムの取得(Getting Item) • Getting Itemステートを選択し、 Int Compareアクションを追加 • 図を参考に設定 218

219.

クリア(Winステート) • Winステートを追加 • Getting ItemのWinイベ ントからWinステート への遷移を追加 • 図を参考に設定 219

220.

基本システム完成! • シーンを保存してPlayボタンを押しましょう。 • アイテムを取得するとCountが増えていき、全て 回収(12個)すると”You Win!”のメッセージを表示し ます。 • もしこの時点でうまくいかなかった場合は、 Rolla-ball_Playmaker.zipに含まれているRoll-aball_Playmaker7 のプロジェクトファイルを開いて 次に備えてください(別途PlayMakerのインストー ルもお忘れなく) 。 220

221.

4.4. UIのボタンに対応 221

222.

Unity UIのボタン対応 • Unity UIのボタンが押されるとOnClick()呼ばれ るイベントが発生します。 • PlayMakerではu GUI Proxy FullのAdd-onパッケ ージをインストールすると「ON CLICK」とい う名前のカスタムイベントが発生します。 222

223.

処理概要 • 実現したい内容 • 全てのアイテムを回収後に[Restart]ボタンを表示 • [Restart]ボタンが押されたらシーンを再度読み込む 223

224.

処理概要 • Unity UIボタンを追加 • • Play Maker U Gui Component Proxyを追加(FSM内でUnity UIのイベントを受信する代理スクリプ ト) Restart FSMを追加 • • • Restartステートを追加 カスタムイベント > UGUI > ON CLICKイベントを追加 RestartステートにLoad Levelアクションを追加し、Load Nameに「MiniGame」と入力 • PlayerController FSMの修正 • • restart変数(GameObject型)を追加、インスペクタに表示 Initステート • • Winステート • • [Restart]ボタンを非アクティブにする [Restart]ボタンをアクティブにする InspectorからRestartボタンへの参照を設定 • UnityのBuild SettingsにMiniGameシーンを追加 224

225.

Restartボタン • HierarchyのCanvasを選択し、右 クリックを押して[UI]-[Button]を 実行し、Buttonを作成 • Buttonを「Restart」に名前を変 更 • RestartボタンのRect Transform を右図のように調整 • Canvas/Restart/TextのTextコン ポーネントのTextプロパティを 「Button」から「Restart」に変 更 225

226.

Restartボタン • Unity UIのイベントをPlayMaker FSM内で受け取 るためにPlay Maker U Gui Component Proxyコ ンポーネントを追加(Inspectorの[Add Component]ボタンを押して検索するのが比較的 簡単) 226

227.

Restartボタン • Canvas/Restartを選択し、[PlayMaker][Components]-[Add FSM to Selected Object]を実行 • PlayMaker Editorで操作 • State 1をInitに変更。特にアクションは無し • 状態を追加。名前をRestartに変更 • Restartステートを選択し、右クリックで[グローバル遷 移を追加]-[カスタムイベント]-[UGUI]-[ON CLICK]を実行 • RestartステートにLoad Levelアクションを追加し、 Load LevelのLevel Nameに「MiniGame」と入力 227

228.

Restartボタン • ON CLICKイベントの追加画面 228

229.

Restartボタン • Restart FSM 229

230.

Restartボタン • Restartステート 230

231.

PlayerController FSMの修正 • Restart(GameObject型)変数を追加し、「イン スペクタ」プロパティをチェックする • InspectorのPlay Maker FSMコンポーネントの restartにRestartボタンをD&Dする 231

232.

PlayerController FSMの修正 • イメージ図 232

233.

PlayerController FSMの修正 • InitステートにActive Game Objectアクション を追加(今回の処理は順番に依存しないため場 所は任意) • 下図のように設定 233

234.

PlayerController FSMの修正 • WinステートにActive Game Objectアクション を追加(今回の処理は順番に依存しないため場 所は任意) • 下図のように設定 234

235.

Build Settingsの修正 • シーンをロードするにために はあらかじめBuild Settingsに 使用するシーンを登録する必 要があります。この設定は名 前の通り、ビルドするために 使用するものです。 • [File]-[Build Settings…]を実行 235

236.

Build Settingsの修正 • ProjectビューのScenes/MiniGameシーンファ イルをBuild Settingsの上の方にD&D 236

237.

完成 • シーンを保存してPlayボタンを押しましょう。 • 全てのアイテムを回収してRestartボタンを押してみましょう。シーンが 再度読み込まれました。 • もし、Restartしたあとライティングがおかしい場合は、[Window][Lighting]-[Settings]を実行して、Lightingビューの一番下にある[Auto Generate]のチェックを外して、[Generate Lighting]ボタンを押してから Buildしてみましょう。 • あとはBuild Settingsから好きなプラットフォームに切り替えてBuildして みましょう。 • 最終バージョンはRoll-a-ball_Playmaker.zipに含まれているRoll-aball_Playmaker8 のプロジェクトファイルです(別途PlayMakerのインスト ールもお忘れなく) 。 237

238.

5. FAQ 238

239.

FAQ • Q1. 実行画面(Gameビューや ビルドしたアプリなど)に表 示されるPlayMakerのステー タスを消したい • A1. PlayMaker Editorの[環境 設定]の[ゲームビューニ状態 ラベルを表示]のチェックを 外してください 239

240.

FAQ • Q2.他にどんなことができるの? • A2.公式サイトを見ましょう。このワークショ ップが終わった後なら自力で読めると思います。 • チュートリアル • http://www.hutonggames.com/tutorials_game_design_wi th_playmaker.php • リファレンスマニュアル • https://hutonggames.fogbugz.com/default.asp?W1 240

241.

FAQ • Q3. 同じようなFSMを何度も入力したくない。 • A3. テンプレート機能を使えばFSMの保存/読 み込みができますので、似たようなFSMのコ ピーができます。 241

242.

FAQ • Q4. Mecanim(Animator)制御はできるの? • A4. Add-onがあります(何故か一覧に無い) • https://hutonggames.fogbugz.com/?W1031 242

243.

FAQ • Q5. C#/UnityScriptの方が分かりやすくない? • A5. 混合も出来ますので、うまく使い分けてくだ さい(例えば敵キャラのAI部分にだけPlayMakerを 使ってみるとか)。 • その他、性能に関する情報やiOS/Androidなどの情 報は公式FAQをご覧ください。 • https://hutonggames.fogbugz.com/default.asp?W541 243