Unityに関連する記事です

 ユーザーが獲得している褒賞のデータをセーブ・ロードすることが出来ましたので、
ゲームを実行したときに、以前までに獲得している褒賞のデータを引き継いだ状態でゲームを再開できるようになりました。

 獲得した褒賞のデータは「データとしては保持」されていますが、それを「ゲーム画面で保持している」ことはまだ確認できません。
つまり、ユーザーは「どの褒賞を持っているのか」確認できない状態であるということになります。

 この手順では、アルバムの機能を実装し、今までにユーザーが獲得してきた褒賞を「ゲーム内のデータ」としてだけではなく
ゲームの画面にも反映させることによって「遊んでいる実績・成果として保持している」ことを客観的に伝えられるようにします。

 この手順も複数の機能の実装が重なって実装されていますので、1つずつ順番に機能を組み込んでいって完成させるようにします。
以下の動画は完成時のものです。このイメージを持っていただいて実装を進めましょう。

 またアルバムでは褒賞を1つずつ確認できますが、今回の実装ではあえて画像の差し替え機能のみ実装しています。
今までの学習を元に、他のデータを画面に表示させる方法を考えて、自分でアルバム機能をブラッシュアップしていきましょう。


<アルバム機能 完成動画>
動画ファイルへのリンク


<褒賞の種類数が増えても対応できるようにスクロール機能を付ける>
動画ファイルへのリンク


 今までのポップアップと異なり、最初から画面の真ん中に表示するのではなく、ボタンの位置からポップアップが開くような演出を実装しています。
閉じる際も同じように、画面の真ん中に向かって閉じるのではなく、ボタンの位置に向かってポップアップが閉じるようになっています。
この演出は DOTween の機能を利用して実装しています。


<アルバムポップアップが開くときと閉じるときのアニメ演出。ボタンから開いて、ボタンに閉じる>
動画ファイルへのリンク


 これを1つの完成形として実装を行っていきましょう。


手順24 −アルバム機能のポップアップとスクリプトの作成−
42.AlbumPopUp ゲームオブジェクトと AlbumPopUp スクリプトを作成する
43.アルバム用ボタンを作成する。GameManager スクリプトを修正して、アルバムボタンを押すとアルバムポップアップを生成する処理を追加する



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

 ・DOTweenの補間機能と実装例ぁ Sequence処理、DOScaleメソッド、DOLocalMoveメソッド、DOMove メソッドー



42.AlbumPopUp ゲームオブジェクトと AlbumPopUp スクリプトを作成する

1.設計


 アルバム用のボタンを新しく画面内に設置し、それをタップすると、獲得している褒賞をアルバムとして一覧表示する機能と、それを表示するポップアップを設計して実装します。
 
 この実装には複数の手順が必要になります。

<アルバム機能の実装>
 ◆獲得した褒賞の情報を表示してプレイヤーに伝えるためのアルバムのポップアップ・ゲームオブジェクトと、そのゲームオブジェクトを制御するスクリプト
 ・アルバム用のボタンの作成。このボタンをタップした際に、アルバムのポップアップ・ゲームオブジェクトを生成する処理
 ・獲得している褒賞に合わせて、その褒賞の情報を管理して、アルバムのポップアップ内に表示するためのサムネイル用のゲームオブジェクトと、そのゲームオブジェクトを制御するスクリプト(褒賞1種類につき1つ生成)
 ・アルバムのポップアップを制御するスクリプトを修正し、サムネイル用のゲームオブジェクトの生成処理と、サムネイル用のゲームオブジェクトをタップしたら、そのサムネイルの褒賞のデータをポップアップに反映する処理を追加

 まずは最初に◆部分を設計・実装していきますので、獲得している褒賞を一覧表示するためのアルバムのポップアップ・ゲームオブジェクトを作成します。
行き先確認用のポップアップのゲームオブジェクトと同じように、Canvas の子オブジェクトとして生成することにより、ゲーム画面の前面に表示します。


2.AlbumPopUp ゲームオブジェクトを作成する


 AlbumPopUp ゲームオブジェクトを作成して、獲得している褒賞の情報を一覧表示するようにします。
このゲームオブジェクトは一覧表示を行い、ポップアップを閉じる機能を持つものになりますので、
実際に獲得している褒賞は、別のゲームオブジェクトを生成するようになります。

 アルバムボタンをタップ
     ↓
 アルバムポップアップが生成される。この時点で、アルバム一覧は空の状態
     ↓
 獲得している褒賞の種類に合わせて、獲得している褒賞のみをアルバム一覧内にゲームオブジェクトとして1つずつ生成して一覧化

 このような処理の流れになります。
そのため、AlbumPopUp ゲームオブジェクトは、アルバムのフレーム部分と、選択した褒賞を表示する画像部分、獲得している褒賞のサムネイルが一覧で並んでいる部分の設計になります。

 いままで作成してきたポップアップ・ゲームオブジェクトを参考に、自分でゲームオブジェクトを作成してみましょう。

 ここでは必要な手順だけを抜粋します。また、ゲームオブジェクトの構成も任意ですが、以下の情報は表示・制御できるようにしてください。

<褒賞内容の表示制御に必要な情報>
 ・選択した褒賞の画像を表示・設定するための、Image コンポーネントがアタッチされているゲームオブジェクト

 これ以外の情報はそのままでは表示されませんので、完成後にブラッシュアップして、褒賞のより詳細なデータを表示できるようにしてください。


 上記の他に、以下のようなものを用意します。
 ・固定背景用の、Image コンポーネントがアタッチされているゲームオブジェクト
 ・ポップアップを閉じるための Button コンポーネントがアタッチされているゲームオブジェクト


ヒエラルキー画像(例)



Sceneビュー 完成画像(例)



Gameビュー 完成画像





 Canvas ゲームオブジェクトの上で右クリックをしてメニューを開き、Create Empty を選択します。
新しいゲームオブジェクトが作成されますので、名前を AlbumPopUp に変更します。
このゲームオブジェクトは親オブジェクトであり、ポップアップの本体としてのフォルダの役割を持ちます。

 CanvasGroup コンポーネントについては任意ですが、子オブジェクトをまとめて制御したい場合には追加しておいてください。


インスペクター画像



Sceneビュー画像



 続いて、各子ゲームオブジェクトの参考画像を列挙しておきます。


3.AlbumPopUp ゲームオブジェクトに各子オブジェクト群を作成する


 先ほどの必要な情報を元にして、以前作成してあるポップアップのゲームオブジェクトなどを参考にしながら作成してみてください。
なお、これがすべてではありませんので、自分で自由にデザインして作ってみることが大切です。

 Text コンポーネントについてはプレファブを1つ作成しておいて、そちらをすべてに利用しています
これはすべてに同じフォントを利用したいためです。よってプレファブを変更すれば、すべての Text コンポーネントのフォントが変更になります。

 スクリプトだけでなくゲームオブジェクトを作成する際にも、自分なりの設計を考えて作ってみてください。



<imgFilter ゲームオブジェクト>

 ポップアップ全体の背景画像の設定を行うためのゲームオブジェクトです。
画像については、ここでは初期設定のままです。


インスペクター画像



Sceneビューとヒエラルキー画像
&ref(https://image01.seesaawiki.jp/i/o/i-school-memo/R6IKg9TRcJ.pngg, 75%)




<imgReward ゲームオブジェクト>

 褒賞の画像を設定するためのゲームオブジェクトです。
この画像が、一覧表示されている褒賞を1つ選択することで動的に変更されるようになります。


インスペクター画像



Sceneビューとヒエラルキー画像





<Scroll View ゲームオブジェクト>

 獲得している褒賞の一覧を管理するためのフォルダ役のゲームオブジェクトです。
Scroll View コンポーネント自体の機能については割愛しますので、自分で調べて機能を確認しておきましょう。

 背景画像を設定するとフレームの画像を設定できます。ここでは初期設定ですが、任意の画像に変えて、どの部分がどのように変化するか確認しておくといいでしょう。

 Scroll Rect コンポーネントがスクロールの機能を管理しています。
Hozizontal と Vertical というスイッチが両方ともオンになっています。
このスイッチの方向にスクロール機能が有効になりますので、今回は Hozizontal のスイッチをオフにしてあります。
こうすることで縦方向のみにスクロール機能を有効にできます。
そのほかは初期設定のままですが、操作して、どの機能がどのような働きを持つか確認しておいてください。


インスペクター画像



Sceneビューとヒエラルキー画像





<Viewport ゲームオブジェクト>

 Scroll View ゲームオブジェクトを作成すると自動的に追加されるゲームオブジェクトです。
設定の変更はしていません。


インスペクター画像



Sceneビューとヒエラルキー画像





<Content ゲームオブジェクト>

 Scroll View ゲームオブジェクトを作成すると自動的に追加されるゲームオブジェクトです。
初期設定では、このゲームオブジェクトが Scroll Rect コンポーネントの管理化に置かれます。
そのため、このゲームオブジェクトの子オブジェクトとして配置されたゲームオブジェクトについては、
ScrollView ゲームオブジェクトの表示範囲外になった場合でも、スクロールして表示させることができるようになります。

 子オブジェクトについては褒賞のサムネイル画像のゲームオブジェクトを生成して管理します。
この子オブジェクトについては次の手順で作成しますので、ここにアルバム一覧用のゲームオブジェクトが存在するようにしますので覚えておいてください。
 
 作成された子ゲームオブジェクトは同じサイズで、かつ一定の距離に自動的に並べて表示したいので、Grid Layout Group コンポーネントをアタッチして管理を行うようにしています。


インスペクター画像



Sceneビューとヒエラルキー画像





<Scrollbar Horizontal / Scrollbar Vertical ゲームオブジェクト>

 これらも Scroll View ゲームオブジェクトを作成すると自動的に追加されるゲームオブジェクトです。
変更はありませんので割愛します。



<btnClose ゲームオブジェクト>

 ポップアップを閉じるための確認ボタン用のゲームオブジェクトです。
ボタンの画像の設定も行います。


インスペクター画像



Sceneビューとヒエラルキー画像





<txtClose ゲームオブジェクト>

 ボタン上に文字列を表示するためのゲームオブジェクトです。
例えば、ボタン自体に確認のロゴ画像を利用している場合には不要になります。


インスペクター画像



Sceneビューとヒエラルキー画像



 以上で完成です。


4.AlbumPopUp スクリプトを作成する


 作成した AlbumPopUp ゲームオブジェクトを制御するためのスクリプトを作成します。

 このスクリプトに必要な処理は、褒賞の画像サムネイル用のゲームオブジェクトを一覧表示させる、つまり、複数生成して一覧表示する機能と、
それらのサムネイル用のゲームオブジェクトをタップした際に、そのゲームオブジェクトの画像や情報をポップアップにピックアップして表示する機能です。
また、ポップアップを閉じるボタン機能も必要です。

 以上のことからもわかるように、このスクリプトは「外部のスクリプトから呼び出し命令を受けて、ポップアップ内に表示する褒賞のデータを受け取って」
それを各コンポーネントに対して制御を行い、その都度、受け取った褒賞のデータを反映していく必要があります。これは、褒賞表示用ポップアップと同じ制御の方法になります。

 現在はまだサムネイル用のゲームオブジェクトを作成していませんので、今回はポップアップを閉じるボタンを動作出来るようにします。
ただし、どのような処理をさせるのかは決定していますので、先のことを考えてスクリプト内に TODO を記述しておくことにより、処理の実装のイメージをつかんでおくようにします。

 またこのゲームオブジェクトが生成されたときに、最初の動画で解説しているように、ポップアップをアニメ演出をさせながら
アルバムボタンの位置から飛び出て表示する処理を実装しています。閉じる際にも、同じくアニメ演出をさせています。

 どちらも DOTween の機能を利用していますので、どうやったら実装できるのかを、イメージしながら処理を考えて記述してみてください。
この処理には演出を行うための情報として、ボタンの位置、Canvas の位置の両方が必要になります。

 アルバムポップアップはボタンの位置で生成されて、Canvas の位置(画面の中央)に移動する処理によって、ゲーム画面では「ボタンから飛び出ている」ように見えています。
また、閉じる際には今度は逆に画面の中央からボタンの位置に移動する処理によって、ゲーム画面では「ボタンの位置に戻る」ように見えています。

 画面での挙動をイメージしながら、処理を構築していく必要があるとともに、このゲームオブジェクト内で管理していない情報については
メソッドの引数を通じて外部のスクリプトから情報を取得する必要があります。

 今回であれば、Canvas の位置の情報と、ボタンの位置の情報は AlbumPopUp スクリプトには管理できていない情報です。
そのため、このポップアップを生成するスクリプトから、これらの情報をメソッドの引数を通じて取得するような設計を考えてみてください。


AlbumPopUp.cs

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


 スクリプトを作成したらセーブします。

 処理の内容を理解してから進めていくようにしてください。


5.<DOTweenの補間機能と実装例ぁ Sequence処理、DOScaleメソッド、DOLocalMoveメソッド、DOMove メソッドー>


 今回利用しているメソッドについて説明します。
1.Sequence(シーケンス)処理

 DOTween による補間処理を Sequence を利用して実装しています。
Sequence を利用することで、DOTween の処理を自分の組み立てた順番通り、あるいは同時に実行することができます。
 
 Sequence を利用するためには、宣言をして初期化する必要があります。

  // DOTween の Sequence を宣言して利用できるようにする
  Sequence sequence = DOTween.Sequence();

 Sequence には様々なメソッドがありますが、今回利用しているメソッドを説明します。


 Append() 

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

 そのため、この DOTween の処理が終わってから、次の DOTween の処理に移る、という、自分で考えた順番通りに DOTween の処理を組み立てて実装することが出来ます。

  // ポップアップをボタンの位置から画面の中央(Canvas ゲームオブジェクトの位置)に移動させつつ
  sequence.Append(transform.DOLocalMove(centerPos, 0.3f).SetEase(Ease.Linear));


 Join() 

 ジョインと読みます。Append メソッドと一緒に用いられ、単体では利用されません。
Append メソッドの次のメソッドが Join メソッドである場合、この Join メソッドの引数にしている DOTween の処理は、Append メソッドと同時に処理されます

 複数の Join メソッドを続けて書いた場合、最初の Append メソッドと同時に処理されます。

  // ポップアップをボタンの位置から画面の中央(Canvas ゲームオブジェクトの位置)に移動させつつ
  sequence.Append(transform.DOLocalMove(centerPos, 0.3f).SetEase(Ease.Linear));

 // ポップアップを徐々に大きくしながら表示。指定したサイズになったら、元のポップアップの大きさに戻す  <= この処理は、上の Append メソッドと同じタイミングで同時に処理される
  sequence.Join(transform.DOScale(Vector2.one * 1.2f, 0.5f).SetEase(Ease.InBack)).OnComplete(() => { transform.DOScale(Vector2.one, 0.2f); });

 今回のケースでは、Append メソッドと Join メソッドが1つずつ処理されていますので、
Append メソッドの移動処理と、Join メソッドのサイズを変更する処理が同時に処理されています



 多くの方がわかりやすい記事を書かれていますので参考にしてください。
@kagigi様
DOTweenをふわっとまとめてみた
https://qiita.com/kagigi/items/bdf4d42835add07b007...
アマガミナブログ様
DOTweenの使い方 Tweenアニメーション入門【Unity】
https://amagamina.jp/how-to-dotween/


2.DOScale(Vector3 endValue, float duration)

 DOScale メソッドは、ゲームオブジェクトの Scale(大きさ)を、指定した大きさに変更する処理です。
大きさを変更する時に補間処理を行うことで、アニメーションしているように見せてくれます

 このメソッドは処理を行いたいゲームオブジェクトの、transfromに対して実行します。
ここではこのスクリプトがアタッチされている、アルバムポップアップのゲームオブジェクトの大きさを変更させたいので
このゲームオブジェクトのTransform コンポーネントが代入されている transform 変数に対して処理を行うようにしています。

 // ポップアップを徐々に大きくしながら表示。指定したサイズになったら、元のポップアップの大きさに戻す
  sequence.Join(transform.DOScale(Vector2.one * 1.2f, 0.5f).SetEase(Ease.InBack)).OnComplete(() => { transform.DOScale(Vector2.one, 0.2f); });

 transform.DOScale()の第1引数はVector3型で、最終的に設定したい Scale、大きさを指定します。
Vector2.one ですので (x = 1, y = 1) を指定しています。そこに 1.2f を乗算しているため、処理結果の 1.2f の値を指定していることになります。

 Vector2.one * 1.2f とは、 new Vector2(1.2f, 1.2f) を記述するのと同じですが、色々な処理の書き方を学習する目的で、このような記述を行っています。
なお、Scale が 0 になったゲームオブジェクトは非表示と同じ状態になります。

 第2引数はfloat型で、大きさを変更するまでにかかる時間を指定します。今回は 0.5f と実数(変数指定も可能)を指定しているので
0.5 秒かけてこのスクリプトがアタッチされているゲームオブジェクトの大きさを(0, 0) => (1.2f, 1.2f)に変更する、という命令になります。

 その後、OnComplete メソッドが実行されて、DOScale メソッドによって、ポップアップの大きさを (1.0f, 1.0f) と本来のゲームオブジェクトのサイズに戻しています。
このような処理を行うことにより、一時的にサイズを大きくしてから、元のサイズに戻すというアニメ演出を実装しています。

 SetEase メソッドにしている Ease.InBack という指定も、「指定している処理よりも少し行き過ぎてから戻す」という演出を実装します。
今回であれば、1.2f よりも少し大きなサイズまで「行き過ぎてから」1.2f のサイズになり、それが 1.0f のサイズに戻ります。

 この Ease タイプはサイズだけに限ったものではありません。
たとえば、移動する処理に Ease.InBack を利用すれば、目的地を少し通り過ぎてから、ちゃんとした目的地に戻る処理が実装出来ます。

 実際に自分で色々なものを試して、自分の演出に合ったものを見つけてみましょう。そういったトライをすることが処理を理解する上での近道になります。


3.DOLocalMove(Vector3 endValue, float duration)

 DOLocalMove メソッドは、ゲームオブジェクトの位置を指定して移動させる処理です。
移動時に補間処理を行うことでアニメーションしているように見せてくれます

 このメソッドは処理を行いたいゲームオブジェクトの、transfromに対して実行します。
ここではこのスクリプトがアタッチされているゲームオブジェクトを移動させる命令を行いたいので
このゲームオブジェクトのTransform コンポーネントが代入されている transform 変数に対して処理を行うようにしています。

  // ポップアップをボタンの位置から画面の中央(Canvas ゲームオブジェクトの位置)に移動させつつ
  sequence.Append(transform.DOLocalMove(centerPos, 0.3f).SetEase(Ease.Linear));

 transform.DOLocalMove()の第1引数は Vector3 型で、移動させる位置を指定します。
この処理では、Canvas の位置にアルバムポップアップを移動させたいので centerPos を指定しています。
この変数には Canvas ゲームオブジェクトの位置情報が代入されています。

 第2引数はfloat型で、移動する際にかかる時間を指定します。今回は 0.3f と実数(変数指定も可能)を指定しているので
0.3 秒かけてこのスクリプトがアタッチされているゲームオブジェクトのローカル座標の位置を centerPos の位置まで移動をさせる = 画面の中央にポップアップを移動させるという命令になります。


4.DOMove(Vector3 endValue, float duration)

 DOMove メソッドは、ゲームオブジェクトの位置を指定して移動させる処理です。
移動時に補間処理を行うことでアニメーションしているように見せてくれます

 DOLocalMove メソッドがローカル座標を利用して移動しているのに対し、こちらはワールド座標での移動を行います。
それ以外はまったく同じです。

 このメソッドは処理を行いたいゲームオブジェクトの、transfromに対して実行します。
ここではこのスクリプトがアタッチされているゲームオブジェクトを移動させる命令を行いたいので
このゲームオブジェクトのTransform コンポーネントが代入されている transform 変数に対して処理を行うようにしています。

 // それに合わせてポップアップをアルバムボタンの位置に移動させる。移動後にポップアップを破棄
  sequence.Join(transform.DOMove(closePos, 0.3f).SetEase(Ease.Linear)).OnComplete(() => { Destroy(gameObject); });

 これら複数の DOTween の処理を組み立てていくことで、今回はポップアップを表示する際と、ポップアップを閉じる際にアニメ演出を実装しています。


6.AlbumPopUp ゲームオブジェクトに AlbumPopUp スクリプトをアタッチして設定を行い、プレファブにする


 ヒエラルキーにある AlbumPopUp ゲームオブジェクトに、作成した AlbumPopUp スクリプトをドラッグアンドドロップしてアタッチしてください。

 AlbumPopUp ゲームオブジェクトのインスペクターを確認し、SerializeField 属性にて宣言している変数が1つ表示されていますので、
こちらに、AlbumPopUp ゲームオブジェクト内から、必要な情報を持つゲームオブジェクトをアサインしてください。


インスペクター画像



 アサインが終了したらプレファブにしてください
プレファブ後はヒエラルキーより AlbumPopUp ゲームオブジェクトを削除してください。

 以上で AlbumPopUp ゲームオブジェクトの完成です。


43.アルバム用ボタンを作成する。GameManager スクリプトを修正して、アルバムボタンを押すとアルバムポップアップを生成する処理を追加する

1.設計


<アルバム機能の実装>
 〇獲得した褒賞の情報を表示してプレイヤーに伝えるためのアルバムのポップアップ・ゲームオブジェクトと、そのゲームオブジェクトを制御するスクリプト
 ◆アルバム用のボタンの作成。このボタンをタップした際に、アルバムのポップアップ・ゲームオブジェクトを生成する処理
 ・獲得している褒賞に合わせて、その褒賞の情報を管理して、アルバムのポップアップ内に表示するためのサムネイル用のゲームオブジェクトと、そのゲームオブジェクトを制御するスクリプト(褒賞1種類につき1つ生成)
 ・アルバムのポップアップを制御するスクリプトを修正し、サムネイル用のゲームオブジェクトの生成処理と、サムネイル用のゲームオブジェクトをタップしたら、そのサムネイルの褒賞のデータをポップアップに反映する処理を追加

 最初に提示した設計の手順に基づいて、ここでは◆の部分の設計と実装を行います。
ゲーム画面にアルバム用のボタンを設置し、そのアルバムボタンをタップした際に、先ほど作成してプレファブになっているアルバムのポップアップ・ゲームオブジェクトを生成する処理を実装します。

 現在作成してあるどのスクリプトに生成処理を実装するかも合わせて考えてみてください。


2.アルバム用のボタンを作成する


 Canvas ゲームオブジェクト内にアルバム用のボタンを新しく作成します。
作成の手順は任意です。ボタンの画像なども、自分のイメージに合わせて設定を行いましょう。

 ここでは参考例を提示します。
ボタン用にフォルダ役のゲームオブジェクトを作成し、その中にボタンのゲームオブジェクトを管理している設計です。


完成時のヒエラルキー画像



完成時の Sceneビュー画像



完成時のゲーム画面




<BottonUISet ゲームオブジェクト>

 ゲーム画面の下部にボタン類を設定することを想定し、そのためのフォルダとなるゲームオブジェクトを Create Empty で用意します。
今回は未設定ですが、画面下部に対しての Anchor (Bottom / Center など)を設定しておいた方がいいでしょう。


ヒエラルキー画像



インスペクター画像





<btnAlbum ゲームオブジェクト>

 Button コンポーネントがアタッチされているゲームオブジェクトを作成します。
またボタンの背景画像も設定しています。背景画像ではなく、ボタン用の画像を登録して利用する場合には、下にある imgAlbum ゲームオブジェクトは不要になります。


ヒエラルキー画像



インスペクター画像





<txtAlbum ゲームオブジェクト>

 Button ゲームオブジェクトを作成すると一緒に作成される Text コンポーネントがアタッチされているゲームオブジェクトです。
文字列としてボタンの内容を表示したい場合には Text プロパティ欄を利用します。画像のみでボタンを表現したい場合には不要です。


ヒエラルキー画像



インスペクター画像





<imgAlbum ゲームオブジェクト>

 Image コンポーネントがアタッチされているゲームオブジェクトです。
ボタンのメインとなる画像を設定するために利用します。背景用の画像を利用していない場合には不要です。


ヒエラルキー画像



インスペクター画像


 
 以上でボタン用のゲームオブジェクトは完成です。このボタンに機能を与えるために、スクリプトを修正していきます。


3.GameManager スクリプトを修正する


 ポップアップの生成を行うための OnClickAlbum メソッドを新しく1つ作成します。このメソッドは先ほど作成したボタンに紐づけるため、
Start メソッド内でボタンにメソッドを登録しておき、実行できるように準備を行います。

 また、アルバムポップアップ用のプレファブを登録するための変数の宣言も追加します。
Canvas ゲームオブジェクト内にて作成したものですので、生成位置についても Canvas ゲームオブジェクトの子オブジェクトとして生成を行います。
これまでのポップアップと同じ位置になりますので、こちらの情報はすでにあることになります。

 また、GameManager スクリプトで管理している RewardDataSO スクリプタブル・オブジェクトの情報を外部から利用できるようにするために、
褒賞の番号を指定することにより、対象となる RewardData クラスの褒賞の番号と照合して、RewardData クラスを取得できるゲッターメソッドを用意しておきます。

 以上のことをふまえた上で、どのような変数を用意すればいいか、どのような生成の制御処理をすればいいのかを考えて実装に挑戦してみてください。


GameManager.cs

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


 スクリプトを修正したらセーブします。


4.GameManager ゲームオブジェクトの設定を行う


 GameManager ゲームオブジェクトの インスペクターより、GameManager スクリプトを確認します。

 新しく SerializeField 属性にて宣言した変数が表示されています。
プレファブについては、Prefabs フォルダ内にある、プレファブになっている AlbumPopUp ゲームオブジェクトをドラッグアンドドロップしてアサインしてください。
ボタンについては、制御したいボタンのコンポーネントがアタッチされているゲームオブジェクトをヒエラルキーよりドラッグアンドドロップしてアサインしてください。


インスペクター画像



 以上で設定は完了です。


5.ゲームを実行して動作を確認する


 アルバム用のボタンを押して、アルバムポップアップが生成させるか確認を行います。
生成されて画面に表示される際に、アニメ演出を行うかどうか、ポップアップが画面の真ん中に表示されるかどうかを確認してください。

 問題なければ、ポップアップ内の閉じるボタンを押して、ポップアップを閉じた際に、再度、アニメ演出を行うかどうかを確認してください。


<実装動画>
動画ファイルへのリンク


 スクリプトのどの部分によって制御処理が動いているかを、しっかり把握しておいてください。
自分でスクリプトを書く際に、処理を読み解けていないと実装できないままになってしまいます。



 以上でこの手順は終了です。
 
 次は 手順25 −アルバム機能のポップアップの生成に合わせて獲得している褒賞をサムネイル表示する機能の実装− です。

コメントをかく


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

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

Menu



プログラムの基礎学習

コード練習

技術/知識(実装例)

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

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

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

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

レースゲーム(抜粋)

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

3D脱出ゲーム(抜粋)

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

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

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

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

3Dトップビューアクション(白猫風)

VideoPlayer イベント連動の実装例

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

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

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

private



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

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