ScriptableObjectのデータをスクリプトで変更できますか？

可能ですが、変更を保存する場合は別の方法が必要です。PlayerPrefs や JSONファイルを活用すると良いでしょう。

カードのデータをリストで管理できますか？

List<CardEntity> を使って管理できます。後ほどリストを活用したデッキ管理も紹介します。

カードデータのフォルダを間違えるとどうなりますか？

Resources.Load が失敗し、NullReferenceException が発生します。フォルダの名前を正確に設定しましょう。

【Unity 2D】シャドウバース風カードゲームの作り方！初心者向け解説パート2

Q: ScriptableObjectのデータをスクリプトで変更できますか？

可能ですが、 変更を保存する場合は別の方法が必要 です。PlayerPrefs や JSONファイル を活用すると良いでしょう。

Q: カードのデータをリストで管理できますか？

List<CardEntity> を使って管理 できます。後ほどリストを活用したデッキ管理も紹介します。

Q: カードデータのフォルダを間違えるとどうなりますか？

Resources.Load が失敗し、NullReferenceException が発生します。 フォルダの名前を正確に設定しましょう。

はじめに
1. この記事で学べること
1. カードデータの作成
2. カードデータのスクリプト
3. カードのデータを操作するスクリプト
4. カードの見た目を変更するスクリプト
まとめ
よくある質問（FAQ）
1. 関連記事:

はじめに

前回の パート1 では、シャドウバース風の 2Dカードゲームの基本的なUI を作成しました。カードのデザインや配置、フィールドの作成など、視覚的な部分を中心に解説しましたね。

しかし、現時点では カードのデータ（攻撃力・HP・コストなど）が固定 されていて、実際のカードゲームのように 動的に管理する仕組み になっていません。カードを大量に作成したり、プレイヤーが異なるカードを持つことを考えると、一つ一つ手作業で設定するのは大変ですよね。

そこで、今回の パート2 では、 ScriptableObject を活用してカードのデータを効率的に管理する方法 を解説します！

この記事で学べること

✅ ScriptableObjectを使ってカードデータを作成する方法
✅ スクリプトを使ってカードデータを読み込み、適用する方法
✅ カードPrefabにデータを反映するためのスクリプトの実装

この仕組みを作れば、簡単に新しいカードを追加できるようになりますし、今後のゲームシステム実装にも活かせます！さっそく始めましょう！ 🚀

1. カードデータの作成

カードゲームでは、カードの情報（攻撃力・HP・コスト・画像など）を管理 する仕組みが必要です。そこで、ScriptableObject を使ってカードのデータを作成し、簡単に管理できるようにします。

1-1. ScriptableObjectとは？

ScriptableObject とは、スクリプトを使ってデータを管理する仕組み です。通常のスクリプトとは異なり、オブジェクトにアタッチする必要がなく、データの保存・管理がしやすい のが特徴です。

今回のカードゲームでは、各カードの情報（名前・HP・攻撃力・コスト・画像）をScriptableObjectに保存 し、ゲーム中にデータを読み込んで使う 形にします。

1-2. ScriptableObjectを作成する

まず、カードデータを定義する C#スクリプト「CardEntity」 を作成します。

スクリプトを作成する手順

プロジェクトウィンドウを右クリック
「Create」→「C# Script」を選択
スクリプト名を 「CardEntity」 に変更

スクリプトのコード

スクリプトを開いて、以下のコードを入力してください。

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

// カードデータ本体
[CreateAssetMenu(fileName = "CardEntity", menuName = "Create CardEntity")]
public class CardEntity : ScriptableObject
{
    public new string name; // カード名
    public int hp;          // HP
    public int at;          // 攻撃力
    public int cost;        // コスト
    public Sprite icon;     // 画像（アイコン）
}

このコードでは、[CreateAssetMenu] を使って、Unityエディター上で簡単にScriptableObjectを作成できるように設定 しています。

1-3. ScriptableObjectのカードデータを作成

次に、Unityエディター上で実際のカードデータ を作成していきます。

手順

プロジェクトビューの「＋」ボタンをクリック
「Create」→「Create CardEntity」を選択
新しく作成された 「CardEntity」ファイルを選択
Inspectorでカードの情報を入力
名前を 「Card1」 に変更

1-4. カードのデータを3種類作成

ここでは、3つのカードを作成してみます。

名前	HP	攻撃力	コスト	画像
Card1	5	3	2	(画像設定)
Card2	8	5	4	(画像設定)
Card3	10	6	6	(画像設定)

カードのデータを増やしたい場合は、「CardEntity」を複製 して設定を変更すればOKです！

1-5. カードデータを管理するフォルダを作成

データを整理しやすくするために、Resourcesフォルダ を作成し、その中にCardEntityListフォルダ を作成して、作成したカードデータを格納します。

フォルダ作成手順

「Assets」フォルダ内で右クリック
「Create」→「Folder」を選択し、「Resources」と命名
Resourcesフォルダ内で右クリック
「Create」→「Folder」を選択し、「CardEntityList」と命名
作成した「Card1」「Card2」「Card3」などのデータを「CardEntityList」フォルダに移動

1-6. Prefabフォルダも整理

Prefabもまとめて管理しやすくするため、Prefabsフォルダ もResourcesフォルダに移動 しておきましょう。

手順

「Assets」フォルダで「Prefabs」フォルダを探す
Prefabsフォルダをドラッグ＆ドロップで「Resources」フォルダ内へ移動

これで、ゲーム中にスクリプトからカードデータを簡単に読み込める準備 が整いました！

まとめ

ScriptableObjectを使ってカードデータを作成
Inspectorでカード情報（HP, 攻撃力, コスト, 画像）を設定
Resourcesフォルダにデータを整理
PrefabもResources内に移動して管理しやすくする

次のステップでは、このデータをスクリプトで読み込み、カードに反映する方法 を解説していきます！

2. カードデータのスクリプト

シャドウバース風カードゲームの作成を進めるために、カードのデータを管理するスクリプト を作成していきます。
ここでは 「CardModel」スクリプト を作り、ScriptableObjectからカードの情報を取得する方法 を解説します。

2-1. カードのデータを管理する「CardModel」の作成

カードの情報をスクリプトで扱うために、新しく 「CardModel」スクリプト を作成します。
プロジェクトウィンドウで 右クリック →「Create」→「C# Script」 を選び、「CardModel」と名前を付けます。

では、スクリプトを開いて以下のコードを入力してください。

using UnityEngine;

// カードのデータを管理するクラス
public class CardModel
{
    public string name;   // カード名
    public int hp;        // HP（体力）
    public int at;        // AT（攻撃力）
    public int cost;      // コスト
    public Sprite icon;   // 画像（アイコン）

    // コンストラクタ（カードIDを引数にしてデータを読み込む）
    public CardModel(int cardID) 
    {
        // Resourcesフォルダからカードデータを取得
        CardEntity cardEntity = Resources.Load<CardEntity>("CardEntityList/Card" + cardID);
        
        // 取得したデータをCardModelに反映
        name = cardEntity.name;
        hp = cardEntity.hp;
        at = cardEntity.at;
        cost = cardEntity.cost;
        icon = cardEntity.icon;
    }
}

2-2. スクリプトの解説

このスクリプトのポイントは、Resourcesフォルダにあるカードデータを取得し、モデルクラスに格納する ことです。

① 変数の定義

public string name;   
public int hp;        
public int at;        
public int cost;      
public Sprite icon;

カード名 (name)：カードの名前
HP (hp)：カードの体力（例：モンスターカードなら耐久力）
攻撃力 (at)：攻撃ダメージの値
コスト (cost)：カードをプレイするためのコスト
画像 (icon)：カードに表示されるアイコン画像

② コンストラクタでデータを取得

public CardModel(int cardID) 
{
    // Resourcesフォルダからカードデータを取得
    CardEntity cardEntity = Resources.Load<CardEntity>("CardEntityList/Card" + cardID);

    // 取得したデータをCardModelに反映
    name = cardEntity.name;
    hp = cardEntity.hp;
    at = cardEntity.at;
    cost = cardEntity.cost;
    icon = cardEntity.icon;
}

Resources.Load<CardEntity>("CardEntityList/Card" + cardID);
- Resourcesフォルダの「CardEntityList」内にある「CardX（XはカードID）」を取得
- CardEntity のデータを取得し、各プロパティ（name, hp, at, cost, icon）に反映

⚠️ 注意点
Resources.Load は Resourcesフォルダ内 しか取得できないので、フォルダの配置を間違えないようにしましょう。
CardEntityList のフォルダ名が間違っていると エラー (NullReferenceException) が発生します。

2-3. どのように使われるのか？

この CardModel クラスは、カードがゲーム内でどのように振る舞うかを定義するものです。
例えば、カードの攻撃力を取得したり、HPを変更したり する際に利用します。

また、後ほど作成する 「CardController」スクリプト でこの CardModel を使い、カードのデータを取得・適用します。

2-4. 動作確認のためのチェックポイント

「Resources/CardEntityList」フォルダの中にカードデータが入っているか？
CardEntity のデータが適切に設定されているか？
スクリプトのフォルダ名やクラス名が間違っていないか？

まとめ

CardModel は カードのデータを管理するクラス
Resources.Load を使って CardEntity を取得
取得したデータをスクリプト内で扱えるようにする

次のステップでは、「CardController」スクリプトを作成し、カードのデータを適用する処理」 を実装していきます！

3. カードのデータを操作するスクリプト

カードデータを作成しただけでは、ゲーム内でカードを正しく表示したり、管理したりすることはできません。そこで、カードのデータを取得し、適用するスクリプト を作成します。今回は 「CardController」 というスクリプトを作成し、カードデータをスクリプトから管理できるようにします。

3-1. CardControllerの作成

まず、カードのデータを適用するための 「CardController」 スクリプトを作成します。

スクリプトの作成手順

プロジェクトウィンドウを右クリック
「Create」→「C# Script」 を選択
スクリプトの名前を「CardController」に変更

次に、スクリプトを開いて以下のコードを入力します。

using UnityEngine;

public class CardController : MonoBehaviour
{
    // カードデータを表示する
    CardView view;
    // カードデータを管理する
    CardModel model;

    private void Awake()
    {
        // CardViewを取得
        view = GetComponent<CardView>();
    }

    public void Init(int cardID) 
    {
        // CardModelを作成し、データを適用
        model = new CardModel(cardID);
        view.Show(model);
    }
}

3-2. CardControllerの解説

このスクリプトでは、カードのデータを取得し、UIに適用する処理を行っています。

① CardViewを取得

private void Awake()
{
    view = GetComponent<CardView>();
}

CardView はカードの見た目を変更するスクリプトです。
GetComponent<CardView>() を使って、同じオブジェクトにアタッチされている CardView を取得します。

② カードデータの適用

public void Init(int cardID) 
{
    model = new CardModel(cardID);
    view.Show(model);
}

Init(int cardID) は カードのIDを引数に取り、対応するカードデータを取得するメソッド です。
model = new CardModel(cardID);
- CardModel を作成し、カードデータを取得します。
- CardModel は ScriptableObjectに保存されたデータを読み込むスクリプト です。
view.Show(model);
- 取得したデータをCardViewに渡し、UIに適用 します。

3-3. CardControllerの適用

作成した CardController を カードのプレハブ（Prefab）に適用 します。

適用手順

プロジェクトウィンドウから「Card」Prefabを開く
「Card」オブジェクトに「CardController」スクリプトをアタッチ
- ヒエラルキーで「Card」オブジェクトを選択
- Inspectorで「Add Component」をクリック
- 「CardController」を検索して追加
スクリプトが適用されていることを確認

これで、カードデータをスクリプトから適用できるようになりました！

3-4. CardControllerの動作確認

実際に CardController が正しく動作するか確認してみましょう。

テスト手順

ゲームシーンに「Card」Prefabを配置
CardController.Init(1); を呼び出して、カードデータを適用
- スクリプトの Start() 内で Init(1); を試してみる
ゲームを再生
カードの見た目が正しく変更されることを確認

3-5. まとめ

CardController は カードデータを取得し、UIに適用するスクリプト
Init(int cardID) を使って、カードのIDごとにデータを適用
CardModel からデータを取得し、CardView に反映
カードPrefabにCardControllerをアタッチして動作

これで、ゲーム内のカードが データに基づいて動的に表示される仕組み が完成しました！

4. カードの見た目を変更するスクリプト

カードのデータを作成し、スクリプトでデータを適用できるようになりました。
次は、カードの 見た目（UI） を変更し、データを正しく反映させるスクリプトを作成します。

4-1. カードのUIにデータを適用する「CardView」の作成

まず、カードのUIを管理するスクリプト「CardView」 を作成します。

① CardViewスクリプトの作成

プロジェクトウィンドウを右クリック
「Create」→「C# Script」 を選択
名前を「CardView」に変更

作成した CardView.cs を開いて、以下のコードを入力してください。

using UnityEngine;
using UnityEngine.UI;

public class CardView : MonoBehaviour
{
    [SerializeField] Text nameText;
    [SerializeField] Text hpText;
    [SerializeField] Text atText;
    [SerializeField] Text cosText;
    [SerializeField] Image iconImage;

    public void Show(CardModel cardModel)
    {
        nameText.text = cardModel.name;
        hpText.text = cardModel.hp.ToString();
        atText.text = cardModel.at.ToString();
        cosText.text = cardModel.cost.ToString();
        iconImage.sprite = cardModel.icon;
    }
}

② スクリプトの解説

[SerializeField] を使ってUI要素を指定
- nameText → カード名
- hpText → HP
- atText → 攻撃力
- cosText → コスト
- iconImage → 画像
Show() メソッドを作成し、カードの情報をUIに表示
- cardModel.name を nameText.text に代入 してカード名を表示
- HPや攻撃力、コストは ToString() を使って文字列に変換
- カードの画像 (iconImage) には Sprite を適用

4-2. CardViewをカードPrefabにアタッチ

作成した CardView をカードPrefabに適用します。

① CardViewをPrefabにアタッチ

プロジェクトウィンドウで「Card」Prefabを開く
「Card」オブジェクトを選択
「Add Component」ボタンをクリック
「CardView」スクリプトを追加

② UI要素とスクリプトを紐づける

次に、Inspector で CardView の各変数に正しいUI要素を紐づけます。

nameText に「カード名のText」オブジェクトをドラッグ＆ドロップ
hpText に「HPのText」オブジェクトをドラッグ＆ドロップ
atText に「攻撃力のText」オブジェクトをドラッグ＆ドロップ
cosText に「コストのText」オブジェクトをドラッグ＆ドロップ
iconImage に「CharaImage」のImageコンポーネントをドラッグ＆ドロップ

これで、スクリプトとUIが連携できました！

4-3. 動作確認

最後に、カードが正しく表示されるか確認しましょう。

ゲームを再生
カードPrefabをシーン内に配置
CardControllerのInit() メソッドを呼び出して、適当なカードIDを渡す
CardController card = FindObjectOfType<CardController>(); card.Init(1); // 例: Card1のデータを適用
カードのテキストや画像が正しく表示されるかチェック