テンプレート化をして1枚のコインを複製する
テンプレート化をして1枚のコインを複製する
PlayCanvasでは
テンプレート化という機能がありますこれは、UnityでいうPrefab化と同じようなものになります。 テンプレート化をするメリットとしては同じエンティティを複数用意せずとも、1つ用意することでそれを複製して使用できます。Launchボタンからゲームを起動すると、今は１枚のコインが表示されています。この１枚のコインをテンプレート化し複数枚出現させます属性とテンプレート化の２つについてこの節では解説をしながら作っていきます。属性について
PlayCanvasには
属性(Attributes)という機能があり、コードを触らなくても、ゲーム内で使用される値を（初期値）PlayCanvas Editorから値を変更できます。1. 隠れているエンティティを表示する
- 1.ヒエラルキーから
walletというエンティティを選択する - 2.
Enabledにチェックを入れます。
walletというエンティティはあらかじめwallet.jsというスクリプトが追加されています。
このエンティティは画面がタッチされたらコインを出すというスクリプトが追加されているエンティティで、大きさやコリジョンなどは持っておりませんが起動時には存在しているエンティティとなります。1
const wallet = pc.createScript("wallet");
2
wallet.attributes.add("Coin", { type: "entity" }); //複製するコインの型と名前を指定
3
wallet.prototype.initialize = function() {
4
if (this.app.touch) {
5
//もしタッチができる端末だったら
6
this.app.touch.on(pc.EVENT_TOUCHSTART, this.create, this); //タッチされたらコインを出すcreate関数を呼ぶイベントを登録
7
} else {
8
this.app.mouse.on(pc.EVENT_MOUSEDOWN, this.create, this); // マウスが押されたらコインを出すcreate関数を呼ぶイベントを登録
9
}
10
};
11
12
wallet.prototype.create = function() {
13
const coin = this.Coin.clone(); // テンプレート化されたコインを取得する
14
coin.setName("coin_nomal");
15
coin.setLocalPosition(0, 10, 0);
16
this.app.root.addChild(coin);
17
coin.enabled = true; // 非表示になっているコインを表示する
18
};
Copied!
2. 属性にコインを追加しテンプレート化をする
実際にコインのエンティティを
テンプレート化をしてみます。- 1.
wallet.jsの下にあるPARSE ボタンをクリック - 2.
Select Entityをクリック - 3.ヒエラルキーの中から
coin_nomalを選択
これでテンプレートかができました、この
属性という機能を使えばたとえば新しいコインをエンティティとして追加した場合にはそのコインを選択することでコードを一切変更せずに表示するコインを変更できます3. 元から1枚表示されていたコインをデフォルトでは非表示にしておきます
これでゲームを起動すると、画面をタッチしたらコインが出現するようになりました。最初に表示されていたコインについては、コインドーザーとして最初に落ちてくるということは少し不気味なので非表示にしておきましょう。
coin_nomalをクリック- Enabledをクリックして非表示にします
この行為には複数の意味があり、それにつきましてはコインを削除するという章で説明をします。
複製について
wallet.jsではエンティティの複製に
clone()関数を使用しています。この関数を使用してAttributesで設定したエンティティをクローンし、新しいエンティティを生み出しています。これで起動をしてみるとプッシャーが動き、タップをするとコインの落ちるコインドーザーができているはずです。次の章では床に落ちたコインを消える処理を追加し、よりコインドーザーらしくしていきます。
Last modified 2yr ago