Unityに関連する記事です

 行き先確認のポップアップでお使いを決定した場合に、行き先ボタンの画像を変更して、お使い中であることをわかる状態にします。
 

<実装動画 ,使いを開始>
動画ファイルへのリンク


<実装動画◆,使い完了を確認(画像の変更はまだ)>
動画ファイルへのリンク


手順9 −行き先確認ポップアップでお使いを開始する処理と一定時間後にお使いを完了する処理を実装−
16.TapPointDetail スクリプトを修正し、お使い中の状態とお使いの経過時間を制御する処理を追加する
17.JobsConfirmPopUp スクリプトを修正し、お使いを開始するボタンを押したら、実際にお使いが開始されるように処理を追加する



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

 ・プロパティ
 ・DOTweenの補間機能と実装例 ーDOPunchPosition メソッド、SetLoops メソッドー
 ・Tween.Kill メソッド




16.TapPointDetail スクリプトを修正し、お使い中の状態とお使いの経過時間を制御する処理を追加する

1.設計


 行き先確認用のポップアップにお使いの情報を伝達することができるようになりました。
この関係を表すと次のようになります。

 ・TapPointDetail スクリプトの OnClickTapPoint メソッドにおいて JobConfirmPopUp ゲームオブジェクトを生成し、
  そのゲームオブジェクトにアタッチされている JobConfirmPopUp スクリプトを取得して、OpenPopUp メソッドを実行する
  このとき、OpenPopUp メソッドにある引数を通じて、TapPointDetail スクリプトの情報を JobConfirmPopUp スクリプトに対して渡して利用できる状態にしている
        ↓
 ・JobConfirmPopUp スクリプトの OpenPopUp メソッドでは、TapPointDetail スクリプトの管理している JobData クラスの情報を利用して
  ポッポアップ内の各コンポーネントに対して JobData クラスの内容を反映させることにより、行き先に応じた内容をポップアップ内に表示している

 今回実装を行いたい内容としては、行き先確認用ポップアップ側から、TapPointDetail スクリプトの方に「お使いを開始する」という情報を伝達する処理にになります。


2.TapPointDetail スクリプトを修正する


 Instantiate メソッドにて JobsConfirmPopUp ゲームオブジェクトのクローンを生成している部分を修正します。
そのままインスタンスだけしてしまうと、このスクリプトから JobsConfirmPopUpゲームオブジェクト を操作する手段がなくなってしまいます。
そのため、インスタンスと同時に、Instantiate メソッドの戻り値を代入するための変数を左辺に用意しておくことで、
その変数を通じて、JobsConfirmPopUp ゲームオブジェクトの制御を行える状態を作り出します

 今回制御を行いたいのは、JobsConfirmPopUp ゲームオブジェクト本体ではなく、このゲームオブジェクトにアタッチされている
JobsConfirmPopUp スクリプトになります。そのため、変数に代入されているゲームオブジェクトの情報を活用して
GetComponent メソッドを実行して JobsConfirmPopUp スクリプトを取得し、その上で OpenPopUp メソッドを実行します。

 注意したいのは、メソッドを実行するためには、そのメソッドがあるスクリプトの情報が必要になるということです。
ゲームオブジェクトの情報だけではメソッドを実行することは出来ないので、GetComponent メソッドを利用してスクリプトの情報を取得しています。


TapPointDetail.cs

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


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

3.<プロパティ>


 プロパティとは、クラス外部から見るとメンバー変数のように振る舞いクラス内部から見るとメソッドのように振る舞う機能です。
そのため、実装状態(private修飾子のまま)を変更することなく、外部クラスへの参照・変更を行える機能であるため、扱いを覚えておくと非常に便利です。

 この特性より、プロパティを作成する場合、多くは private 修飾子の変数の情報を扱うために作成します
今回の場合は、TapPointDetail クラスの isJobs 変数に対してのプロパティを作成します

<プロパティの作成>
    private bool isJobs;


    /// <summary>
    /// isJobs 変数のプロパティ
    /// </summary>
    public bool IsJobs
    {
        set {
            isJobs = value;
        }

        get {
            return isJobs;
        }
    }

 上記のようなプロパティを作成することで、private 修飾子で宣言している isJobs 変数を
プロパティを利用することによって、外部クラスから参照出来るようにしています。

 private 修飾子にて宣言フィールドで宣言した変数については、外部のクラスからは参照・変更を行うことが出来ません
このとき参照を行いたい場合には、変数の修飾子を public 修飾子に変更して対応するのではなく
プロパティの持つ get キーワードを利用して、戻り値を利用して private 修飾子の変数を外部クラスに参照させることで対応することが出来ます。

 こういった機能を知っているかどうかで設計部分が大きく変わります
色々な機能を知っていれば、例えば、今回はプロパティを使おうか、どうしようか、という選択肢が増えますが、知らなければ選択肢自体が生まれません。

 設計の引き出しを広げる上でも、新しい技術を覚えること、常に学習する意欲と向上心を持つことがプログラム学習のポイントです



 プロパティを利用した設計により、public ではない変数を外部クラスで利用できるようにします。
外部からプロパティを呼び出して戻り値を参照する処理のことをゲッター(getter)と呼びます。

  get {
      return isJobs;
  }



 同様に、private 修飾子の値を外部クラスより変更したい場合には、プロパティを仲介する手法を使って書き換える処理を実装出来ます。
こちらの処理は set キーワードを利用して処理を記述します。そのため、この処理をセッター(setter)と呼びます。

 set キーワード内には呼び出し元から value の値で情報が届いていますので、value の値を利用することで private 修飾子の変数に代入処理を行うことが出来ます。

  set {
      isJobs = value;
  }

 この処理を外部のクラスから実行する場合には、参照する場合と同じで「クラスの変数.プロパティ名」と記述することで値の書き換えが可能です。

 get、set キーワードはどちらか片方だけでも記述できます
またプロパティ内部に条件式を用意して、その結果に合わせて処理を変更する記述も出来ます


参考サイト
未確認飛行 C 様
プロパティ
https://ufcpp.net/study/csharp/oo_property.html

FEnetインフラ様 テックブログ
C#のプロパティを使いこなそう!さまざまな実装方法を紹介
https://www.fenet.jp/infla/column/technology/c%E3%...


4.<DOTweenの補間機能と実装例 ーDOPunchPosition メソッド、SetLoops メソッドー>


 新しいDOTweenの処理を実装していますので、各メソッドの説明をします。


  // DOTweenの処理を代入できる
 tween = transform.DOPunchPosition(new Vector3(10.0f, 0, 0), 3.0f, 10, 3)
            .SetEase(Ease.Linear)       
            .SetLoops(-1, LoopType.Restart);

 今回の処理は、複数のメソッドをつなげて1行で記述している処理になります。
ピリオドの位置までが1つの処理になっており、合計で3つの DOTween のメソッドが実行されています

 このようにピリオドを利用して、前のメソッドの処理に続けて次のメソッドの処理を書くと、前のメソッドの処理を受けて次のメソッドの処理が実行されます。
この記述方法をメソッド・チェーンといいます。

 今回の場合、transform に対して DOLocalMoveX メソッドが最初に実行されて、その処理結果を利用して、次の SetLoops メソッドが実行されます。
さらに ピリオドで次のメソッドが続いていますので、その2つの処理結果を受けて、最後に SetEase メソッドが実行されるようになっています。

 プログラムは上から下に実行されていきますが、1行に書かれた処理の場合は、手前(左側)より、ピリオド単位で区切って実行されることになります。
これは他の処理と同様です。しっかりと処理の順番を追えるように、読み解いてみましょう。


1.DOPunchPosition (Vector3 punch, float duration, [int vibrato = 10], float elasticity = 1], [bool snapping = false] )

 まずは最初は DOPunchPosition メソッドです。
この処理は直線状に神藤しながら移動する処理を行うことができます。

  transform.DOPunchPosition(new Vector3(10.0f, 0, 0), 3.0f, 10, 3)

 第1引数には振動しながら移動する最大距離を Vector3 型で指定します。第2引数には振動する時間を float 型で指定します。
この2つが必須項目ですが、残る3つの引数には初期値が設定されているため、今回のように指定していなくても初期値を利用して実行してくれます。
是非自分で調べてみてください。
 
 この処理により、画像が左右に振動しながら移動を行う処理を実装しています。


2.SetLoops(int loops, LoopType loopType)

 SetLoopsメソッドは、他のDO〜メソッドの後に実行できるメソッドです。この命令単体で実行することはできません

 tween = transform.DOPunchPosition(new Vector3(10.0f, 0, 0), 3.0f, 10, 3)
            .SetEase(Ease.Linear)       
            .SetLoops(-1, LoopType.Restart);

 一緒に命令をしているメソッドに対してループ処理を付与することが出来ます。
今回の処理では、transform.DOPunchPosition メソッドに対して、ループ処理を行っています。(SetEaseメソッドもSetLoopsメソッドと同じで単体では動かないメソッドです)

 第1引数はループ処理を行う回数です。int型で設定します。今回のように -1 を指定すると、それは無限ループになります。(ループが終了しません)
このような場合は明示的に処理を停止させないと無限にループを繰り返します。

 第2引数ではループさせるタイプをLoopTypeというenum型から選択します。LoopType.Yoyo の場合は、A => B , B => Aという形式で、目標値から再度、スタート地点に対して戻る形でループを繰り返します。
他にもLoopTypeがありますので調べてみてください。この処理によって、左右方向に行ったり来たりして、それを無限にループします。


5.<Tween.Kill メソッド>


 DOTween に関連する処理になります。
Tween 型の変数を宣言することで、DOTweenの処理内容を変数に代入することが出来ます。

 DOTweenの処理は変数に代入せずとも実行できます。本来はそれだけで問題はないのですが、
Tweener 型の変数にDOTweenの処理を代入していることで、DOTweenの処理を一時停止させたり、終了させることが出来るようになります。

 どのような場面で使用するかというと、今回のようにSetLoops メソッドによって無制限のループ処理を行っている場合がその1つになります。
変数にDOTweenの処理を代入していない場合、ループ処理として動いているDOTweenの処理を一時停止したり、終了させる処理ができません

 DOTweenの処理を中断するには、Killメソッドを実行します。この処理を実行することで、SetLoops メソッドによる無制限のループ処理を終了させることが出来ます。

 private Tween tween;  // Tween 型の変数

  // DOTweenの処理を代入できる
 tween = transform.DOPunchPosition(new Vector3(10.0f, 0, 0), 3.0f, 10, 3)
            .SetEase(Ease.Linear)        
            .SetLoops(-1, LoopType.Restart);

 // ループアニメを破棄する
  tween.Kill();


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


 新しく SerializeField 属性で宣言している変数が3つインスペクターに追加されていますので、
そちらに情報をアサインして登録を行います。

 Image コンポーネントの変数については TapPointDetail ゲームオブジェクトの Image コンポーネントをアサインします。

 2種類の Sprite コンポーネントについては、お使い中の画像と、最初から表示されている行き先の画像の2つをそれぞれドラッグアンドドロップしてアサインして登録しておきます。
お使い中の画像については任意の画像を設定してください。今回は「お使い中」というメッセージを表示するようにしています。
これはお使い完了時にキャラが生成されるので、最初からキャラがいる状態ではなくて、お使いが終わって初めてキャラが出る、という新鮮さ、驚きの部分を表現するためです。


インスペクター画像



 以上で設定は完了です。


17.JobsConfirmPopUp スクリプトを修正し、お使いを開始するボタンを押したら、実際にお使いが開始されるように処理を追加する

1.設計


 行き先確認ポップアップにはお使いを始めるためのボタンを用意してあり、そのボタンを押すと該当するメソッドの処理が実行される部分までは確認が済んでいます。
そのメソッド内において、行き先確認ポップアップから行き先側に命令を出し直して、行き先の情報をお使いが開始された状態へと制御を行うようにします。

<行き先→行き先確認ポップアップ>
 ・行き先のゲームオブジェクトをタップすると、TapPointDetail スクリプトにあるメソッドが実行されて、行き先確認ポップアップが生成される

<行き先確認ポップアップ→行き先>
 ・行き先確認ポップアップのお使いを始めるボタンを押すと、JobsConfirmPopUp スクリプトにあるメソッドが実行されて、
  その処理の中でさらに TapPointDetail スクリプトにあるメソッドが実行されて、行き先のゲームオブジェクトがお使い中の状態になるように制御を行う
 
 スクリプト同士がどういう関係性で結びついているのか、そのイメージと流れをしっかりと把握することが大切です。
スクリプト同士のつながりをイメージする際には、クラス図を書いて、どのスクリプトからどのスクリプトのメソッドを実行している、ということをまとめて置くようにしましょう。

 自分のイメージをしっかりと書き起こすことが出来れば、処理の流れを把握できていることになります。


2.JobsComfirmPopUp スクリプトを修正する


 TODO 機能でコメントしてある部分に処理を実装し、お使いを開始させるようにします。
どのような処理を実装すればよいか、先ほど修正してある TapPointDetail スクリプトを見ながら考えてみてください。

 自分の考えた処理を実装してから教材を見るようにすることで、理解が各段に深まります。
教材通りにかけば動くから、では覚えていくことができません。

 常に「自分で考える」ことを止めないようにしてください。


JobsComfirmPopUp.cs

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


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

 コメントを自分で書いて補記しておきましょう。
もしもコメントが書けない場合には、処理の内容をしっかりと把握できるように復習を行ってください。


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


 処理の流れを把握してから、ゲームを実行して、想定している処理によってゲームが制御されるようになるか確認を行います。

 行き先確認用ポップアップのお使い開始ボタンを押すと、行き先の画像がお使いをしている状態の画像に切り替われば制御成功です。


<実装動画 ,使いを開始>
動画ファイルへのリンク



 また、一定時間経過後に、Debug.Log メソッドの内容が Console ビューに表示されれば、こちらも制御成功です。


<実装動画◆,使い完了を確認(画像の変更はまだ)>
動画ファイルへのリンク




 以上でこの手順は終了です。
 
 次は 手順10 −お使い完了時の処理を実装し、ゲームの基本サイクルを作成する− です。

コメントをかく


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

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

Menu



プログラムの基礎学習

コード練習

技術/知識(実装例)

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

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

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

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

レースゲーム(抜粋)

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

3D脱出ゲーム(抜粋)

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

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

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

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

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

VideoPlayer イベント連動の実装例

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

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

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

private



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

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