色管理を考える

カラーパレット

Unityで色をどう定義するか悩みの種です。
UIの色などを一括で管理して、色を変更したら参照しているUIはすべて自動的に変わってほしいです。

答えが見つからないので、私はカラー定義用のScriptableObjectを作成して、カラーパレットのようなものを作って、使っています。

カラーパレット

色追加するのにコードいじってenum追加しないといけないですが、参照するときenumで参照したいし、一度定義したら新規に色追加することもないので、これでいきます。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
//ColorDefine.cs

public enum ColorIds {
None = 0,
Transparent = 5,
Text = 10,
HoverText = 20,
DisableText = 30,
HoverButton = 40,
DisableButton = 50,
Main = 60,
DialogButtonNormal = 70,
DialogButtonHover = 80,
Error = 100
}

[Serializable]
public class ColorDefine {
public ColorIds id;
public Color color;
}

ScriptableObjectの定義は以下。作ったら、ScriptableObjectをエディタ上で生成すれば使えます。
生成したら、Resourcesフォルダ配下にColorScriptableObjectという名前で配置して、起動時にプログラムから読み込みます。

1
2
3
4
5
//ColorScriptableObject.cs

public class ColorScriptableObject : ScriptableObject {
public ColorDefine[] colors;
}

staticで色管理用のclassを作って、上記ScriptableObjectを読み込んで使えるようにします。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
//ColorPallet.cs

public static class ColorPallet {
static Dictionary<ColorIds, Color> colors;

static ColorPallet() {
//色定義を読み込んで、Dictionaryに保存しておく
colors = new Dictionary<ColorIds, Color>();
var tmp = Resources.Load<ColorScriptableObject>("ColorScriptableObject");
foreach (var s in tmp.colors) {
colors[s.id] = s.color;
}
}

public static Color Get(ColorIds id) {
if (!colors.ContainsKey(id)) return Color.white; //定義されてないのでエラーでも良い
return colors[id];
}

}

UIで使うときはこういう感じになります。

1
GetComponent<Graphic>().color = ColorPallet.Get(ColorIds.HoverButton);

終わりに

もっと良いやり方あるような気もしますが、一旦プロジェクトはこれでまわっているので良しとします。
あとは、エディタ上でUIいじるときに色が反映されないのでエディタ拡張で色を適用するようにしたら良いと思います。

Unityカテゴリの記事
Kris' Favorite Assets が便利
キー操作でUIのナビゲーションをループさせる
TextMeshProのSprite Assetを更新する
UnityPhysicsDebugDraw2D が便利
Open Recent Scene が便利
細かいTips
ビルドスクリプトを書く
AnimatorのCulling Modeでハマった話
Vectrosityを使ってUGUI上で線や円のアニメーションをする
スプレッドシートからjsonデータを読み込む
ビジュアルノベルアセットFungusにコマンドを追加してカスタマイズする
Skinned Mesh Renderer の Boundsについて
シーンごとにビルド結果の容量を出す
シーンビューにクオリティ設定のスライダーを出すエディタ拡張
ビルド結果のFile headersが大きい理由
フリーのビジュアルノベルアセットFungusを使ってRPGのイベントを作る
Move To View を改良する
フリーのビジュアルノベルアセットのFungusが便利
Visual Studio で保存時にフォーマットする
スプレッドシートからデータを読み込む
Easy Save2 で シリアライズされたクラスを保存する
ShaderでSpriteの色相をシフトする
Sprite、Texture の 色相をシフトする
uGUIのButtonをクリック時にハイライトのままになる
uGUIのCanvas Groupを使って透過処理をしたり、操作を制限する
自作のコンフィグ画面に必要なもの
uGUIでトグルなボタンを作る
uGUI で動的にボタンを作る
Easy Save2 を使ってみる
csv読み込んで ローカライズ
LoadLevelAdditive で共通シーンを加算
画面全体に色をかける
Any State でどこからでも遷移できるようにする
iTween のStop ではまる
sprite の multiple で 境界がおかしくなる
2D画面に線を引く Line Renderer
Renderer の Materials を スクリプトから設定する
背景をスクロールさせる