日々是好日~every day is a good day~

日常の中の非日常の備忘録

【Unity】カラーピッカーの設定

前回投稿したゲームの中にプレーヤーの色をカスタマイズできる機能をつけました
大変なのかと思っていたら フリーアセットにカラーピッカーがあって簡単に色の設定をすることができたので その手順を忘れないうちにメモ
1.シーンにキャンバスを追加

2.キャンバスを右クリックして画像を追加

3.Imageのソース画像に任意のスプライトをアタッチ

4.ウィンドウ/マイアセットからFlexible Color Pickerを選択してインポートをクリック パッケージをインポートする



5.まだマイアセットに追加していない場合はウィンドウ/アセットストアを開き「color picker」の価格Freeで検索してマイアセットに追加しておく


6.インポートが終わったらFlexibleColorPickerフォルダーの中のプレファブをキャンバスにアタッチする


7.プロジェクトタブ内で右クリックし作成/C#スクリプトを選択 名前をColorChangeにする

8.ColorChangeスクリプトを編集

using UnityEngine;
using UnityEngine.UI;

public class ColorChange : MonoBehaviour
{
    public FlexibleColorPicker fcp;
 
    // Update is called once per frame
    void Update()
    {
        if (fcp.isActiveAndEnabled)
        {
            GetComponent<Image>().color = fcp.color;
        }
    }
}

9.ColorChangeスクリプトをImageにアタッチ FlexibleColorPickerプレファブをスクリプトにアタッチ

これだけでソース画像の色を変更することができます
Imageにマテリアルを設定してMaterial.colorにfcp.colorを設定しても同様になります
FlexibleColorPickerプレファブは不要なものを非表示にしたりバーの向きを変えるなど これ自体をカスタマイズすることもできます

実行するとこんな感じに

この他にもフリーのカラーピッカーがあるので また機会があれば試してみたいと思います