Unityに関連する記事です

 以下の内容で順番に実装を進めていきます。

26.リザルト表示を制御するResultPopUpスクリプトを作成する(点数などの表示)
27.GameManagerスクリプトを修正する─.螢競襯肇櫂奪廛▲奪彳發縫好灰△覆匹良充┐鮃圓



 新しい学習内容は、以下の通りです。

・DOTweenの機能と実装例◆淵掘璽吋鵐后



26.リザルト表示を制御するResultPopUpスクリプトを作成する(点数などの表示)


 GamaManagerスクリプトを修正したので、ResultPopUpゲームオブジェクトはゲーム画面内に移動するようになりました。
次はResultPopUpゲームオブジェクトに用意した各Textコンポーネントに、スコアの値と消した干支の数を表示できるようにします。

 そのためにはResultPopUpゲームオブジェクトに、新しくスクリプトを1つ作成してアタッチします。
このスクリプトを介して、スコアなどの値のやりとりを行うようにしていきます。

 Project内のScriptsフォルダ内で右クリックして、Create => C# Script を選択し、名前を ResultPopUp に変更します。
ResultPopUpを開いて、スクリプトを記述していきしょう。


ResuluPopUp.cs

 <= クリックすると開きます。




 ResultPopUpスクリプトを作成したら、CanvasにあるResultPopUpゲームオブジェクトにアタッチします。
ResultPopUpゲームオブジェクトを選択し、インスペクターを確認して、ResultPopUpスクリプトがアタッチされているか確認します。

 ResultPopUpスクリプトに宣言した3つの変数がインスペクターに表示されていますので、それぞれ対象のゲームオブジェクトをドラッグアンドドロップしてアサインします。
各変数名はアサインするゲームオブジェクトの名前と同じにしています。
これはわかりやすくするだけではなく、万が一、異なる名前のゲームオブジェクトがアサインされていたらすぐに気づけるようにするためです。

 制作する際にはこういった細部にも気を配るようにしましょう。自分だけではなく第三者の方が見てもわかりやすい作りを心掛けてください。

ResultPopUpゲームオブジェクトのインスペクター画像



 次は、このResultPopUpスクリプトに用意したDiaplayResultメソッドをGamanManagerスクリプトから呼び出すことで、スコアと消した干支の数を受け取って
それをTextコンポーネントを通じてゲーム画面の表示を更新します。このとき、スコアと消した干支の数はアニメ表示させます。

 テクニックとしまして、CanvasGruopを利用してbtnClosePopUpとその子要素を一時的に透明にしておきます。
そしてスコアなどの表示が終了してから、画面のタップを促すメッセージを徐々に表示させるようにしています。
ユーザーの目線の導線として、スコア、消した干支の数が順番に表示され、その後、目線の先にくる部分にこの画面タップの表示を表示させることで次のプレイを促します。


<DOTweenの機能と実装例◆淵掘璽吋鵐后法


 Sequence(シーケンス)を使用することでDOTweenの制御を順番に、あるいは同時に行うことができます。
上記の処理の 銑イ蓮∩阿Sequenceの処理が終了するまで次の処理は待機します。つまり、記述した順番通りに処理を行わせることが可能になります。

 Sequenceには様々なメソッドがありますので一部のみ紹介します。


 Append() 
   アペンドと読みます。引数に指定した処理を行います。次にあるメソッドがSequenceのAppendメソッドである場合、この処理が終了するまで次のAppendメソッドは動きません。


 AppendInterval() 
   アペンド・インターバルと読みます。次にあるメソッドがSequenceのAppendメソッドである場合、引数でした時間だけ次のAppendメソッドに移らずに待機します。


 Join() 
   ジョインと読みます。今回は使用していませんが、Appendメソッドと一緒に用いられます。Appendメソッドの次のメソッドがJoinメソッドである場合
  このJoinメソッドの引数にしている処理はAppendメソッドと同時に処理されます。複数のJoinを続けて書いた場合、最初のAppendメソッドと同時に処理されます。



 多くの方がわかりやすい記事を書かれていますので参考にしてください。
@kagigi様
DOTweenをふわっとまとめてみた
https://qiita.com/kagigi/items/bdf4d42835add07b007...
アマガミナブログ様
DOTweenの使い方 Tweenアニメーション入門【Unity】
https://amagamina.jp/how-to-DOTween/
Zenn オオバ様
DOTween の教科書〜スクリプトでアニメーションを操るバイブル〜
https://zenn.dev/ohbashunsuke/books/20200924-dotwe...


27.GameManagerスクリプトを修正する─.螢競襯肇櫂奪廛▲奪彳發縫好灰△覆匹良充┐鮃圓


 GamanManagerスクリプトを修正して、ResultPopUpゲームオブジェクトに用意してあるTextコンポーネントにスコアと消した干支の数を表示させます。
表示させる処理はResultPopUpスクリプトに用意しましたので、GamanManagerスクリプトではそれを呼び出す処理を追加していきます。

GameManager.cs

 <= クリックすると開きます。




 GamanManagerスクリプトの修正が終了したら、GamanManagerゲームオブジェクトのインスペクターを確認します。
型を変更したので、 ResultPopUp 変数のアサイン情報がNoneになっているはずです。ResultPopUpゲームオブジェクトをドラッグアンドドロップしてアサインしてください。
ResultPopUp 型に修正してアサインをし直していないと、TODOを修正して新しく追加したメソッドの呼び出しでエラーがでます。

GamanManagerゲームオブジェクトのインスペクター画像



ゲームを実行して確認する


 アサインなどが漏れなく終了したら、ゲームを実行して確認します。

残り時間が 0 になってResultPopUpゲームオブジェクトがゲーム画面内に移動したのち、まずスコアがドラムアニメで表示されます。
表示される場所と、表示された値がGameDataのScoreの値になっているか確認します。

つぎに、消した干支の数がドラムアニメで表示されます。こちらも表示される値がGameDataのEraseEtoCountの値と同じかどうか確認します。

最後にそれらの処理が終了してから、画面タップを促すメッセージとボタンの背景画像が徐々に表示されるか確認します。
これらが順番に処理されていれば、ResultPopUpスクリプトのシーケンス処理が正常に動作しています。


検証動画 ”充┐気譴訃貊蠅斑佑正常か確認
https://gyazo.com/d50ff7fe0404ff5b09bb67fc6e0a5857


検証動画◆.好灰△抜鎧戮凌瑤表示されてから画面タップを促すメッセージが表示されるか確認
https://gyazo.com/233d47c16ba07778f2efe06bc6bbf4f8


 もしもうまく動作しない部分がある場合には、Debug.Logを入れて、問題点の切り分けを行いましょう。
処理が正常に動いてる部分を順番に特定していけば、問題となる部分が見えてきます。


応用<DOTween の処理をリファクタリングする>


 ResultPopup スクリプトにおいて、ポップアップ内に表示する数字をアニメーションさせている処理が2か所あります。

 現在の DOTween では、Text 内に表示する数字の値をアニメーションさせるメソッドが追加されています(なお同機能は TextMeshPro については有料です。)


<参考記事>
Zenn オオバ様
DOTween の教科書 チャプター17 uGUI - Image・Textのトゥイーン
https://zenn.dev/ohbashunsuke/books/20200924-dotwe...



 DOTween.To メソッドは汎用的な利用が可能ですが、専用のメソッドを利用して処理のリファクタリングに挑戦してみましょう。


<ResultPopUp.DisplayResult メソッド>
 // シーケンスを利用して、DOTweenの処理を制御したい順番で記述する。まずは.好灰△凌字をアニメして表示
  sequence.Append(DOTween.To(
      () => initValue,
      (num) => {
                   initValue = num;
                   txtScore.text = num.ToString();
      },
      score,
      1.0f)
      .OnComplete(() => { initValue = 0; })
      .SetEase(Ease.InCirc));   // 次の処理のためにOnCompleteを使ってinitValueを初期化

 ↓

 // シーケンスを利用して、DOTweenの処理を制御したい順番で記述する。まずは.好灰△凌字をアニメして表示
  sequence.Append(txtScore.DOCounter(0, score, 1.0f).SetEase(Ease.InCirc));

 Text クラス専用の DOCounter メソッドを txtScore 変数(Text 型)に対して利用できるようになっています。
こちらの処理を利用することで、数字のアニメーションについて非常にすっきりとした処理の記述にリファクタリング出来ます。

 ResultPopup スクリプト内にはもう1つ、数字のアニメーションの処理がありますので、そちらについては自分で考えてチャレンジしてみてください。



 両方の数字のアニメーションの処理がリファクタリングできれば、

  // 計算用の初期値を設定
  int initValue = 0;

 DisplayResult メソッド内にて宣言しているこちらの変数も不要になります。



 以上でこの手順は終了です。

 次は 手順15 です。

コメントをかく


「http://」を含む投稿は禁止されています。

利用規約をご確認のうえご記入下さい

Menu



技術/知識(実装例)

2Dおはじきゲーム(発展編)

2D強制横スクロールアクション(発展編)

3Dダイビングアクション(発展編)

2Dタップシューティング(拡張編)

レースゲーム(抜粋)

2D放置ゲーム(発展編)

3Dレールガンシューティング(応用編)

3D脱出ゲーム(抜粋)

2Dリアルタイムストラテジー

2Dトップビューアドベンチャー(宴アセット使用)

3Dタップアクション(NavMeshAgent 使用)

2Dトップビューアクション(カエルの為に〜、ボコスカウォーズ風)

VideoPlayer イベント連動の実装例

VideoPlayer リスト内からムービー再生の実装例(発展)

AR 画像付きオブジェクト生成の実装例

AR リスト内から生成の実装例(発展)

private



このサイト内の作品はユニティちゃんライセンス条項の元に提供されています。

管理人/副管理人のみ編集できます