はじめに
今回はJavaScriptを使ったカード作りについての記事になります！
GameBuilderではスライムや木などのアクター*1に振る舞いを持たせているのがロジックツールに表示されているカードです。
例を使うと、アクターであるスライムは基本じっとしているのですが、カードにより振る舞いを持たせることで、そこらへんを歩き出すということになります。
つまりGameBuilderではアクターに様々なカードを付けることで振る舞いを決める、カードプログラミングが重要な考え方といってもいいかもしれません。
このカードについて少し掘り下げていきましょう。
カードとは
GameBuilderでとても重要な要素であるカードはJavaScriptによって構成されています。
先程の画像は、スライムをクリエイトツールから作成すると自動で付けられているカード・パネルたちです。
そこのWander AroundカードのJavaScriptのコードを実際にみてましょう。
Wander Aroundカードのコード
やや見にくいかもしれませんが、Wander Aroundカードの右側にある歯車マークを押して、詳細を開いてください。
上にあるREPLACE WITH COPY AND EDIT JAVASCRIPTをクリック。
するとこのような画面が出てくるはずです。
これがWander Aroundカードを構成しているコードになります。たくさんコードが書いてあってややビックリかもしれませんが、とりあえずこの方法でコードが見れることが分かれば大丈夫です。
また今回ははじめてのカード作りということで、こんな複雑なコードは書かないのでご安心を。
実際に自分のカードを作ってみる
あらかじめ用意されているカードとは別に、自分でいちから作成するカードをカスタムカードといいます。
これの練習をするためにまずは今回使わないカードを削除しちゃいましょう。
パネルの右上にあるXボタンを押すことで、パネルとその中に含まれる全てのカードを削除することができます。
次にAdd Custom Cardをクリック。
続けてNEW CARDをクリックします。
するとNEW CARDが新しく作成されています。これではじめてのカードの作成をすることができました！
簡単なコードを打ち込んでみる
NEW CARDのJavaScriptのコードを前回の要領でひらいてみてください。
するとあらかじめサンプルとして書き込んであるのですが、今回は真っ白な状態からプログラミングしたいので全て削除してOKです。
まずはGameBuilderでのはじめてのプログラミングとして、以下のコードに書き換えてみてください。
export function onTick(){ spin(2); }
ちなみにカードの名前と概要も自分で書き換えてみました。
ここでのonTickは、UnityでいうUpdateメソッドとほぼ同じ意味、つまり毎フレーム呼ばれる処理を書きます。
またspinメソッドはGame Builder APIのことで、アクターを2rad/sec（1秒間に2ラジアン）で回転させます。
簡単にいうと、毎フレーム回転させる処理を書いたということです。
ちゃんとコードをセーブした後、実際にスライムにカードを付けてみましょう。
さいごに
とりあえず自分で自作カードを作ることに成功できました。
JavaScriptによるプログラミングでより表現の幅が広がり、より面白いことができるはずです。
またもっとロジック系やGameBuilderでのJavaScriptの書き方についても書いてみたいと思っているので、よければお付き合いください！
*1:GameBuilderでは全てのオブジェクトをアクターとテラインに分けることができます 【GameBuilder】初心者がロジックを扱うときにまず覚えるべきterrainとactorの違い - はなちるのマイノート
