Zenn
✨

#cluster ボタンを押したら表示、非表示されるオブジェクトをつくる

2021/08/26に公開
Unity
cluster
tech

公式の記事 ボタンを押したら一時的に表示されるオブジェクトをつくる が古いSDKつかってたり、画像小さかったりアニメーションつかってたりで複雑なのでシンプルに表示、非表示するだけの記事を書いてみました。

https://youtu.be/BY2WfLM_yOw

こんなのが作れます。

https://youtu.be/zE0_xFHbNK4
応用するとクリックしたら花火が表示されるのも作れます。

使うギミック

Interact Item Trigger
掴めないアイテムに「使う」機能を追加し、使われたことを通知するトリガー

Set Game Object Active Gimmick
GameObjectのアクティブ状態を切り替えるギミック

作り方

ボタンの見た目を作る

まずはボタンに使うCubeをつくってみましょう

  1. Hierarchyで右クリック CreateEmpty して GameObject をつくる
  2. 名前を ButtonContainer にする
  3. ButtonContainer　以下に Cube を追加する
  4. Cube の Scale を 0.2,0.2,0.2 にする

表示するボタンを作る

CreateKit Componentを追加して押した時にトリガーを送信できるようにする。

  1. Hierarchy の ButtonContainer を選択する
  2. Inspector で Add Component で Interact Item Trigger を追加する
  3. Triggersの＋ボタンを押す
  4. Target Global　GlobalFireworkActive
    　 Value Bool チェクを入れる (true)

これで クリックすると Global(全体)に GlobalFireworkActive Bool true を送るボタンができました。

非表示にするボタンを作る

表示ボタンを複製して 少し設定変更して　非表示にするボタンも作りましょう

  1. Hierarchyの ButtonContainer を選択する
  2. 右クリック -> Duplicate　で複製する
  3. 複製した ButtonContainer (1) を選択する
  4. Inspector の　Interact Item Trigger　の　Value Bool チェクを外す (false)
  5. 位置が重なっているので横にずらしておく
    Transform X -0.5　に設定する

これで クリックすると Global(全体)に GlobalFireworkActive Bool false を送るボタンができました。

ボタンが押されたら表示,非表示されるアイテムを作る

ここでは 最初 非表示で、ボタンが押されると表示されるアイテムをつくります。

  1. Hierarchyで右クリック CreateEmpty して GameObject をつくる
  2. 名前を FireworkContainer にする
  3. FireworkContainer　以下に Sphere を追加する
  4. Hierarchy の FireworkContainer を選択する
  5. Inspector で Add Component で Set Game Object Active Gimmick を追加する
  6. Target Global　GlobalFireworkActive にする
  7. Inspector FireworkContainer　名前の横のチェクを外して非表示する。

ココまでの作業で最初、非表示のアイテムを作ることができたはずです。
Unityの再生ボタンを押して実行してみましょう。

https://youtu.be/BY2WfLM_yOw

ボタン押したら花火があがるようにしてみる

FireworkContainer の Sphere を差し替えて花火があがるようにしてみましょう。

花火に使うアセット一覧

スタンダードアセット（無料）
Unity Particle Pack 5.x（無料）
ポストプロセッシングスタック（Post Processing)（無料）
2021年 花火

必要アセットをプロジェクトに追加する

  1. Standard Assets (for Unity 2018.4)を追加する
    Unity Asset Storeで検索してインストールする
  2. Unity Particle Pack 5.xを追加する
    Unity -> Window -> Package Manager を開いて Unity Particle Pack 5.x を検索してインストールする
  3. ポストプロセッシングスタックを追加する
    Unity -> Window -> Package Manager を開いて Post Processing を検索してインストールする
  4. 2021年 花火 をダウンロード 展開して TwoMillionFireWork_Particle.unitypackage をダブルクリックしてプロジェクトに追加

FireworkContainer を編集する

Sphereを削除して、IKA 3DCG art studio -> TwoMillion のPrefabを適当に追加する

https://youtu.be/zLKxOtP88-M

パーティクルがピンクの四角になるのを治す

Unity5.5.0f3でパーティクルがピンク色になる

花火Prefabの子オブジェクト等すべてに Default-Particle に設定するとピンク四角は治るかも

https://youtu.be/zE0_xFHbNK4

おわり。

Discussion