Scriptable Itemで音を鳴らそう！【コピペで使えるサンプルコード付き】

JavaScriptでギミックの制御等をおこなうことができるScriptable Itemで、スクリプトから音声を鳴らすことができるようになりました！
この機能を使えば、ワールドクラフトでも音を扱うことができます。
新機能を詳しく説明していきます。

スクリプトから音声を鳴らすために必要なコンポーネント

スクリプトから音声を鳴らすためには、Scriptable Itemに加え「Item Audio Set List」コンポーネントを使って音声ファイルを登録する必要があります。

実際に使ってみましょう。

Scriptable ItemのついたオブジェクトのInspectorで、Add ComponentからItem Audio Set Listコンポーネントを追加します。
追加できたらItem Audio Set Listコンポーネント内の+ボタンを押し、追加された項目内の「Audio Clip」で、◎ボタンから選択するかドラッグ＆ドロップで音声ファイルを設定します。
「Id」には分かりやすい名前をつけておきましょう。ここでは「Audio1」としておきます。
- スクリプト内からはIdに設定した名前で音声を呼び出します。
  - 音声をループ再生したい場合はLoopにチェックを入れてください。

追加された項目で「Element 0」またはIdに設定した名前の部分だけが表示されている場合はクリックで展開することができます。

ワールドクラフトで利用する場合、ひとつの音声ファイルの長さは5秒以内、数は5個までに制限されています。Unityでワールドをつくる場合は制限はありません。

音声データが設定できたら、次は実際にスクリプトで音を鳴らしてみましょう。

クリックしたときに音を鳴らす

まずはクリックした時に音を鳴らすようにしてみます。

アイテムに見た目とコライダーを追加したうえで、Scriptable Itemに次のコードを入力してください。

アイテムをクリックできるようにするためには、アイテム自身かその子にコライダーが必要です。

const se = $.audio("Audio1");


$.onInteract(() => {
    se.play();
});

1行目の$.audio(“Audio1”);で、IDを「Audio1」としてItem Audio Set Listに登録した音声を読み込んでいます。

$.onInteractの中に、アイテムをクリックしたときの動作を書きます。

ここでは読み込んだ音声データに対してplay()関数を実行することで、音声を再生します。

アップロードして確かめてみましょう。
アイテムをクリックすると音が鳴るようになりました。

クリックするたびに鳴らしたり止めたりする

スクリプトで扱う音声は、再生だけでなく停止もできます。
クリックするたびに鳴ったり止まったりするようにしてみましょう。

先ほどのコードを次のように書き換えてください。

const se = $.audio("Audio1");


$.onInteract(() => {
    let playing = $.state.playing;
    if(playing == null) playing = false;
 
    if(playing) se.stop();
    else se.play();
    playing = !playing;
   
    $.state.playing = playing;
});

$.onInteractの中を書き換えています。
最初に$.state.playingを読み込んでいますが、ここには現在再生中かどうかのフラグを保存してあります。再生中ならtrue、再生していないならfalseです。
初期化されていない場合はその次の行でfalseとして初期化します。

続いて現在の状態に合わせて音声を再生または停止します。
再生が止まっているときはplay()で音声を再生し、再生されているときはstop()を呼び出して再生中の音声を停止します。
その後、更新された再生状態に合わせてフラグを変更します。
!playingと書くと、playingの現在の値がtrueならfalseを、falseならtrueを返します。

最後に、変更した再生状態のフラグを$.state.playingに保存します。
変数の値は$.stateに書き込まないと保存されません。

スクリプトを書き換えたら、アップロードして確かめてみましょう。
クリックするたびに音声が再生・停止します。

音量を変える

音声の再生音量をスクリプトで変更することもできます。
先ほどのスクリプトを以下のように書き換えてみてください。

const se = $.audio("Audio1");


$.onInteract(() => {
    let playing = $.state.playing;
    if(playing == null) playing = false;
 
    playing = !playing;
    if(playing) {
        se.volume = Math.random() * 2.5;
        se.play();
    }
    else se.stop();


    $.state.playing = playing;
});

play()の前に少し書き足しています。
読み込んだ音声に対してvolumeの値を変更することで再生音量を変えることができます。
volumeの値は0.0～2.5の範囲で設定できます。

Math.random()は0.0～1.0の範囲の乱数（ランダムな値）を返します。これに2.5をかけて0.0～2.5の範囲に変換してからvolumeの値に設定すると、再生するたびに音量がランダムに変わります。

アップロードして確認してみましょう。
先ほどと同様にクリックするたびに再生・停止しますが、再生するごとに音量がランダムに変化します。

音源の位置を変える

先ほどまではアイテムの位置から音が鳴るようになっていましたが、音の位置は任意の子オブジェクトの位置に変更することができます。

まず、再生位置となる子オブジェクトを用意します。アイテムの子に空のオブジェクトを追加し、名前を「AudioPosition」としたうえで、任意の位置に移動してください。

子オブジェクトを追加できたら、スクリプトを以下のように書き換えます。

const se = $.audio("Audio1");
const audioPosition = $.subNode("AudioPosition");


$.onInteract(() => {
    let playing = $.state.playing;
    if(playing == null) playing = false;
 
    playing = !playing;
    if(playing) {
        se.attach(audioPosition);
        se.play();
    }
    else se.stop();


    $.state.playing = playing;
});

まず、2行目に追加された$.subNode("AudioPosition")で先ほど追加したAudioPositionオブジェクトを取得しています。
読み込んだ音声に対してattach()でオブジェクトを渡すと、音源の位置がそのオブジェクトの位置に変更されます。

アップロードして確認すると、アイテム本体の位置からではなくAudioPositionを設置した位置から音が聞こえてきます。

スクリプトで音声を扱えるようになったことで、Cluster Creator Kitでのワールド制作の幅が広がっただけでなく、クラフトアイテムでも効果音の鳴るアイテムがつくれるようになりました。

クリックしたときだけでなく、手で持ったり使ったりしたときや、工夫次第では特定の時刻になると音が鳴るアイテムなどもつくることができます。
音声を上手く使って様々な表現を試してみましょう！