プッシャーを動かす
プッシャーを動かす
スクリプトコンポーネントに スクリプトを追加してコインドーザーのプッシャーを動かしていきましょう。1. SCRIPTコンポーネントを追加する
2. ADD SCRIPTをクリック
ADD SCRIPTをクリックすると現在プロジェクト内に入っているスクリプト中からスクリプトを追加できます。
3. Pusher.jsスクリプトを追加
SCRIPTの検索欄から
pusher選択します。今回追加した
pusher.jsのソースコードこちらになります。1
const Pusher = pc.createScript("pusher");
2
Pusher.attributes.add("Speed", { type: "number", default: 0.01 });
3
Pusher.attributes.add("Base", { type: "number", default: 120 });
4
5
Pusher.prototype.initialize = function() {
6
this.count = 0;
7
this.mode = "push";
8
this.base = this.Base;
9
this.reverse = this.base * 2;
10
};
11
12
Pusher.prototype.update = function() {
13
if (this.count < this.base && this.mode === "push") {
14
this.entity.translate(0, 0, this.Speed);
15
} else if (this.count < this.reverse && this.mode === "pull") {
16
this.entity.translate(0, 0, -this.Speed);
17
} else if (this.count > this.base && this.mode === "push") {
18
this.mode = "pull";
19
} else if (this.count > this.reverse && this.mode === "pull") {
20
this.mode = "push";
21
this.count = 0;
22
}
23
this.count++;
24
};
25
26
Pusher.prototype.swap = function(old) {};
Copied!
4. 起動をしてみよう
▶ のボタンで作成したプログラムの起動(Launch)できます。後述しますがこの起動した際に表示されるURLは
ログインしているユーザーしかアクセスできません。
プログラムの中身を見る
1. アセットからpusher.jsをダブルクリックする
今回追加した
pusher.jsについては下のアセットタブから確認できます。 pusher.jsをダブルクリックすることでコードエディタが開かれるのでソースコードを確認できます。translate関数
今回使用した関数としては、
this.entity.translateという関数を使用しました。このthis.entityというのはスクリプトを追加したエンティティ自身のこととなります。その中のtranslate関数を使用することでエンティティを移動させることができます。1
//translate関数のサンプル
2
3
//使い方
4
//this.entity.translate(xの移動量, zの移動量, yの移動量);
5
6
// 例 z方向に1移動する
7
this.entity.translate(0, 0, 1);
Copied!
PlayCanvasのライフサイクル
PlayCanvasでは指定した関数が一定ライフサイクルで呼び出される関数があり、
pusher.jsではinitializeとupdate関数を使用されています。 swapはコードエディタプログラムの更新を取ることができるので、開発中にSwapに対して変更をされたらページを更新するなどのコードを入れておくと、画面の更新することなどということもできます。プロパティ
タイミング
initialize
起動時
update
フレーム毎
swap
コードエディタなどによるプログラム更新時
postInitialize
すべてのオブジェクトの読み込みが終わった際に一度
postUpdate
すべてのスクリプトが更新された際に呼び出される
参考リンク
- 1.PlayCanvas pc.Entity#translate
Last modified 2yr ago