Unity color palette | color palette | stepless color change function

effect

Unity adopt UGUI Realize the palette function of stepless color change , It's very simple and easy to use .

project git Address

https://github.com/zrzhang76/UnityColorBoard

Code （ This is written entirely because CSDN Don't think I have a few words , It is suggested to look directly at the project ）

Color board part

using System.Collections.Generic;
using UnityEngine;
using UnityEngine.EventSystems;
using UnityEngine.UI;

namespace CSharp.UI.ColorBoard
{
    
    public class ColorBoard : MonoBehaviour, IPointerClickHandler, IDragHandler
    {
    
        // Display color Texture
        Texture2D tex2d;
        //RawImage Components 
        RawImage ri;
        // Pixel width height 256( The default value is )
        int TexPixelLength = 256;
        int TexPixelHeight = 256;
        // Common components 
        public Slider sliderCRGB;

        public ColorHue colorHue;
        // Color array 
        UnityEngine.Color[,] arrayColor;
        // Self Transform
        RectTransform rt;
        // Circle of color focus 
        public RectTransform circleRect;

        public delegate void ColorChangeDelegate(Color color);

        public event ColorChangeDelegate OnColorChanged;

        private void Awake()
        {
    
            ri = GetComponent<RawImage>();
            rt = GetComponent<RectTransform>();
            circleRect = transform.Find("img_cursor").GetComponent<RectTransform>();

            TexPixelLength = (int)rt.sizeDelta.x;
            TexPixelHeight = (int)rt.sizeDelta.y;
            
            // Initialize the color array 
            arrayColor = new UnityEngine.Color[TexPixelLength, TexPixelHeight];
            // Create a fixed length and width Texture
            tex2d = new Texture2D(TexPixelLength, TexPixelHeight, TextureFormat.RGB24, true);
            // Component assignment picture 
            ri.texture = tex2d;
            ri.texture.wrapMode = TextureWrapMode.Clamp;
            // Initialize and set the color of the board to red 
            SetColorPanel(UnityEngine.Color.red);
            
            sliderCRGB.onValueChanged.AddListener(OnCRGBValueChanged);
        }
        
        
        // Monitoring of color changes 
        void OnCRGBValueChanged(float value)
        {
    
            UnityEngine.Color endColor=colorHue.GetColorBySliderValue(value);
            SetColorPanel(endColor);

            var color = GetColorByPosition(circleRect.anchoredPosition);
            OnColorChanged?.Invoke(color);
        }

// Set the color of the board 
        public void SetColorPanel(UnityEngine.Color endColor)
        {
    
            UnityEngine.Color[] CalcArray = CalcArrayColor(endColor);
            // Fill the color board with color , And apply 
            tex2d.SetPixels(CalcArray);
            tex2d.Apply();
        }


        // Through a final color value , Calculate the color of all pixels on the board , And return an array 
        UnityEngine.Color[] CalcArrayColor(UnityEngine.Color endColor)
        {
    
            // Calculate the average value of the difference between the final value and white in the horizontal direction , Used to calculate the color value of each horizontal pixel 
            UnityEngine.Color value = (endColor - UnityEngine.Color.white) / (TexPixelLength - 1);
            for (int i = 0; i < TexPixelLength; i++)
            {
    
                arrayColor[i, TexPixelHeight - 1] = UnityEngine.Color.white + value * i;
            }
            //  Empathy , vertical direction 
            for (int i = 0; i < TexPixelLength; i++)
            {
    
                value = (arrayColor[i, TexPixelHeight - 1] - UnityEngine.Color.black) / (TexPixelHeight - 1);
                for (int j = 0; j < TexPixelHeight; j++)
                {
    
                    arrayColor[i, j] = UnityEngine.Color.black + value * j;
                }
            }
            // Returns an array , Save all color values 
            List<UnityEngine.Color> listColor = new List<UnityEngine.Color>();
            for (int i = 0; i < TexPixelHeight; i++)
            {
    
                for (int j = 0; j < TexPixelLength; j++)
                {
    
                    listColor.Add(arrayColor[j, i]);
                }
            }

            return listColor.ToArray();
        }


        /// <summary>
        ///  Get the color by coordinate , Coordinates are Texture The two-dimensional coordinates above 
        /// </summary>
        /// <param name="pos"></param>
        /// <returns></returns>
        public UnityEngine.Color GetColorByPosition(Vector2 pos)
        {
    
            Texture2D tempTex2d = (Texture2D)ri.texture;
            UnityEngine.Color getColor = tempTex2d.GetPixel((int)pos.x, (int)pos.y);
            return getColor;
        }

        public Vector2 GetClampPosition(Vector2 touchPos)
        {
    
            Vector2 vector2 = new Vector2(touchPos.x, touchPos.y);
            vector2.x = Mathf.Clamp(vector2.x, 0.001f, rt.sizeDelta.x);
            vector2.y = Mathf.Clamp(vector2.y, 0.001f, rt.sizeDelta.y);
            return vector2;
        }
        // Click event 
        public void OnPointerClick(PointerEventData eventData)
        {
    
            Vector3 wordPos;
            // take UGUI The coordinates of are transformed into world coordinates  
            if (RectTransformUtility.ScreenPointToWorldPointInRectangle(rt, eventData.position, eventData.pressEventCamera, out wordPos))
                circleRect.position = wordPos;
            circleRect.anchoredPosition = GetClampPosition(circleRect.anchoredPosition);
            var color = GetColorByPosition(circleRect.anchoredPosition);
            OnColorChanged?.Invoke(color);
        }

        // Drag events 
        public void OnDrag(PointerEventData eventData)
        {
    
            Vector3 wordPos;
            // take UGUI The coordinates of are transformed into world coordinates  
            if (RectTransformUtility.ScreenPointToWorldPointInRectangle(rt, eventData.position, eventData.pressEventCamera, out wordPos))
                circleRect.position = wordPos;
            circleRect.anchoredPosition = GetClampPosition(circleRect.anchoredPosition);

            var color = GetColorByPosition(circleRect.anchoredPosition);
            OnColorChanged?.Invoke(color);
        }
    }
}

Hue bar section

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

public class ColorHue : MonoBehaviour
{
    
    // Paint color Texture
    Texture2D tex2d;
    // Picture display components 
    RawImage ri;
    // Length and width 
    int TexPixelWdith = 952;
    int TexPixelHeight = 16;
    // An array of colors 
    UnityEngine.Color[,] arrayColor;

    private void Awake()
    {
    
        ri = gameObject.GetComponent<RawImage>();
        
        // Initialize colors and Texture
        arrayColor = new UnityEngine.Color[TexPixelWdith, TexPixelHeight];
        tex2d = new Texture2D(TexPixelWdith, TexPixelHeight, TextureFormat.RGB24,true);
            
        // Calculate color 
        UnityEngine.Color[] calcArray = CalcArrayColor();
        // display 
        tex2d.SetPixels(calcArray);
        tex2d.Apply();

        ri.texture = tex2d;
        ri.texture.wrapMode = TextureWrapMode.Clamp;
    }
    
    
    // Calculate the color array to be displayed on the hue bar 
    UnityEngine.Color[] CalcArrayColor()
    {
    
        // Calculate the equal increment of horizontal pixels 
        int addValue = (TexPixelWdith - 1) / 3;
        //
        for (int i = 0; i < TexPixelHeight; i++)
        {
    
            arrayColor[0, i] = UnityEngine.Color.red;
            arrayColor[addValue, i] = UnityEngine.Color.green;
            arrayColor[addValue+addValue, i] = UnityEngine.Color.blue;
            arrayColor[TexPixelHeight - 1, i] = UnityEngine.Color.red;
        }
        UnityEngine.Color value = (UnityEngine.Color.green - UnityEngine.Color.red)/addValue;
        for (int i = 0; i < TexPixelHeight; i++)
        {
    
            for (int j = 0; j < addValue; j++)
            {
    
                arrayColor[j, i] = UnityEngine.Color.red + value * j;
            }
        }

        value = (UnityEngine.Color.blue - UnityEngine.Color.green)/ addValue;
        for (int i = 0; i < TexPixelHeight; i++)
        {
    
            for (int j = addValue; j < addValue*2; j++)
            {
    
                arrayColor[j, i] = UnityEngine.Color.green + value * (j-addValue);
            }
        }

        value = (UnityEngine.Color.red - UnityEngine.Color.blue) / ((TexPixelWdith - 1)-addValue-addValue);
        for (int i = 0; i < TexPixelHeight; i++)
        {
    
            for (int j = addValue*2; j < TexPixelWdith - 1; j++)
            {
    
                arrayColor[j, i] = UnityEngine.Color.blue + value * (j- addValue * 2);
            }
        }

        List<UnityEngine.Color> listColor = new List<UnityEngine.Color>();
        for (int i = 0; i < TexPixelHeight; i++)
        {
    
            for (int j = 0; j < TexPixelWdith; j++)
            {
    
                listColor.Add(arrayColor[j, i]);
            }
        }

        return listColor.ToArray();
    }
    
    /// <summary>
    ///  Get the color   According to height 
    /// </summary>
    /// <param name="value"></param>
    /// <returns></returns>
    public Color GetColorBySliderValue(float value)
    {
    
        float clampValue = Mathf.Clamp(value, 0.001f, 0.999f);
        Color getColor=tex2d.GetPixel((int)((TexPixelWdith-1)*clampValue),0);
        return getColor;
    }
    
}

---

It's not easy to make , Give me a compliment ~~