Dictionary(GS2 UIKit for Unity) のサンプル
図鑑機能を実装します。
リポジトリ
https://github.com/gs2io/gs2-uikit-for-unity-sample/tree/main/Dictionary
GS2-Deploy テンプレート
プロジェクト内容
プロジェクトを開くと上記の通りになります。
実行すると、A〜E までの5体のキャラクターの入手状況が表示されます。 今はどのキャラクターも入手していないため、全てグレーアウトされています。
画面下部に各キャラクターを入手するボタンを配置しています。 まずは、「A」のボタンを押してみましょう。
「A」のキャラクターを入手したことで、カラー表示になり、入手時間が表示されます。 同じく「C」のボタンを押してみましょう。
「C」のキャラクターもカラー表示になります。
プロジェクトの解説
シーンのヒエラルキーに注目してください。
Canvas/DictionaryWindow
Gs2DictionaryNamespaceContext
この GameObject 以下のノードで取り扱うネームスペースを指定しています。
今回は dictionary-0001 を指定しています。
Canvas/DictionaryWindow/Dictionary/…/Content
Gs2DictionaryEntryModelListFetcher
NamespaceContext で指定されたネームスペースのエントリーモデル一覧を取得します。
Gs2DictionaryEntryModelList
Gs2DictionaryEntryModelListFetcher で取得したエントリーモデルを指定されたプレハブに割り当てて生成します。 Maximum Items にはプレハブを生成する最大数を指定します。
今回は子ノードにいる Entry をプレハブとして指定しています。 フレハブとして指定された GameObject がシーン内にある場合、その GameObject は無効化され、それ以外に Maximum Items で指定された数だけ GameObject が生成されます。
Canvas/DictionaryWindow/Dictionary/…/Content/Entry
Gs2DictionaryEntryModelContext
この GameObject 以下のノードで取り扱うエントリーを指定しています。 コンテキストの内容は Gs2DictionaryEntryModelList によって割り当てられます。
Gs2DictionaryEntryModelFetcher
Gs2DictionaryEntryModelContext で指定されたエントリーのモデルを取得します。
Gs2DictionaryOwnEntryFetcher
Gs2DictionaryEntryModelContext で指定されたエントリーモデルの自分のエントリーを取得します。
Gs2DictionaryEntryEnabler
Entry の読み込み状態によって、入手日時を表示する GameObject を有効化します。 エントリーを入手していない場合は、Loaded にならないため、入手している場合にのみ有効化されます。
Gs2DictionaryEntryModelEnabler
EntryModel の読み込み状況によって、エントリーの名前を表示する GameObject を有効化します。
Canvas/DictionaryWindow/Dictionary/…/Content/Entry/Icon
キャラクターのアイコン画像を表示します。 ただし、リスト表示するエントリーによって表示する画像の種類が変わる必要があります。
Gs2DictionaryEntryModelNameEnabler
Gs2DictionaryEntryModelFetcher で取得したエントリーモデルの名前によって GameObject を有効化・無効化します。 サンプルでは5つ配置し「A」〜「E」で該当するエントリーのノードのみ有効化するように設定されています。
Canvas/DictionaryWindow/Dictionary/…/Content/Entry/Icon/A
「A」〜「E」の GameObject が設定されていますが、原則同じ構成をとっています。
入手日時を表示する部分と同じように分岐し、入手済みの場合は Active を有効化し、未入手の場合は Disabled を有効化しています。
Canvas/DictionaryWindow/Dictionary/…/Content/Entry/Icon/A/Active
Canvas/DictionaryWindow/Dictionary/…/Content/Entry/Icon/A/Disabled
Disabled では Material に GrayScaleMaterial を指定することでシェーダーを使用してグレーアウトさせています。
Canvas/DictionaryWindow/Dictionary/…/Content/Entry/Name
エントリーモデルの名前を表示します。
Gs2DictionaryEntryModelLabel
エントリーモデルの内容を、Format で指定した形式で整形します。 整形されたテキストは OnUpdate(String) にコールバックされ、そこから Text コンポーネントに値を反映しています。
Canvas/DictionaryWindow/Dictionary/…/Content/Entry/AcquiredAt
エントリーの入手日時を表示します。
Gs2DictionaryEntryLabel
エントリーの内容を、Format で指定した形式で整形します。 整形されたテキストは OnUpdate(String) にコールバックされ、そこから Text コンポーネントに値を反映しています。
Canvas/DictionaryWindow/Input/Acquire A
Gs2ExchangeRateModelContext
エントリーを入手済みにする GS2-Exchange の交換レートを設定します。
ここでは、GS2-Exchange の exchange-0004 ネームスペースの A レートモデルを交換するよう設定しています。
Canvas/DictionaryWindow/Input/Acquire A/Gs2ExchangeExchangeExchangeAction
こちらのコンテキストメニューよりプレハブを追加できます。
Count に交換数量を指定し、プレハブを有効化することで Gs2ExchangeRateModelContext で指定した交換レートの交換を実行します。
OnExchangeComplete(String)
に交換処理が正常終了した場合のコールバックを設定でき、自分自身を無効化しています。
Process/Gs2AutoLogin
ログイン処理を実行するプレハブが設定されています。
Accountのサンプル で解説していますので、そちらを参照ください。