Unityで色を徐々に変える - Unityの使い方



Unity -> スクリプト -> Unityで色を徐々に変える

Unityで色を徐々に変える


指定した2色の間を、スライダーを使って徐々に変えてみます。

シーン上のCubeにスクリプトを付けます。

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

public class ChangeColor : MonoBehaviour
{
    public GameObject cube;
    public Color startColor;
    public Color endColor;

    [Range(0f, 1f)]
    public float t;

    MeshRenderer cubeMeshRenderer;

    // Start is called before the first frame update
    void Start()
    {
        cubeMeshRenderer = cube.GetComponent<MeshRenderer>();
    }

    // Update is called once per frame
    void Update()
    {
        cubeMeshRenderer.material.SetColor("_BaseColor", Color.Lerp(startColor, endColor, t));
    }
}
Color型の変数をpublicで宣言すると、インスペクタでカラーピッカーから色を指定できます。
その2つの色の間を、0~1の間のfloat値で補完した色を、マテリアルにセットしています。

2つの色の間の色を取得するためのメソッドが用意されているので簡単です。
https://docs.unity3d.com/ja/current/ScriptReference/Color.Lerp.html

インスペクタにスライダーを表示する

Range属性をfloatかintの変数の宣言の時につけると、()の中の値の範囲のスライダーをインスペクタに表示できます。

[Range(0f, 1f)]
public float t;

アニメーションカーブを使う

アニメーションカーブを使って変化に抑揚を付けることもできます。

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

public class ChangeColor : MonoBehaviour
{
    public GameObject cube;
    public Color startColor;
    public Color endColor;

    [Range(0f, 1f)]
    public float t;
    public AnimationCurve curve;

    MeshRenderer cubeMeshRenderer;

    // Start is called before the first frame update
    void Start()
    {
        cubeMeshRenderer = cube.GetComponent<MeshRenderer>();
    }

    // Update is called once per frame
    void Update()
    {
        cubeMeshRenderer.material.SetColor("_BaseColor", Color.Lerp(startColor,endColor,curve.Evaluate(t)));
    }
}
AnimationCurveの変数をpublicで宣言すると、インスペクタでアニメーションカーブを設定できます。


プリセットもありますし、ダブルクリックで点を増やして自由にカーブを設定できます。

アニメーションカーブの使い方はこちら

アニメーションカーブのEvaluateメソッドの引数に横軸の値を入れると、縦軸の値が返ってきます。

Color.Lerpメソッドの中で、t の代わりにEvaluate(t) を使います。
Color.Lerp(startColor,endColor,curve.Evaluate(t))

すると、色の変化の仕方が変わりました。

トップページへ


tags: , Lerp, アニメーションカーブ, 徐々に