unity 调色板之shader绘制

最近闲来无事，给自己找点麻烦，用shader做一个调色板，分享给大家

微信号：ITComputerGraph

更多精彩内容，关注公众号《IT木子李》

 

绘制：

中心思想是通过UV坐标，计算出每个象素的颜色值

左侧方志颜色计算公式：

i.uv.y * _Color.r + i.uv.y * (1 - i.uv.x) * (1 - _Color.r)
i.uv.y * _Color.g + i.uv.y * (1 - i.uv.x) * (1 - _Color.g)
i.uv.y * _Color.b + i.uv.y * (1 - i.uv.x) * (1 - _Color.b)

右侧彩虹条计算公式：

三源色分别为：红、绿、蓝，由些还会插值产生另外三源色：黄、青、洋红，所以彩虹条要分为 6 段去画

if (y <= 1)
{
	return lerp(float4(1, 0, 0, 1), float4(1, 1, 0, 1), y - 0);
}
else if (y <= 2)
{
	return lerp(float4(1, 1, 0, 1), float4(0, 1, 0, 1), y - 1);
}
else if (y <= 3)
{
	return lerp(float4(0, 1, 0, 1), float4(0, 1, 1, 1), y - 2);
}
else if (y <= 4)
{
	return lerp(float4(0, 1, 1, 1), float4(0, 0, 1, 1), y - 3);
}
else if (y <= 5)
{
	return lerp(float4(0, 0, 1, 1), float4(1, 0, 1, 1), y - 4);
}
else
{
	return lerp(float4(1, 0, 1, 1), float4(1, 0, 0, 1), y - 5);
}

由以上两个公式，可以分别绘制并拾取到具体每一个象素的颜色值。

拾取颜色值：

先计算出当前鼠标点中UI的位置，然后规一化到 0 - 1 之间，最后计算出当前点中的颜色。

void SetColor()
{
    Vector2 pos = Vector2.one;
    RectTransformUtility.ScreenPointToLocalPointInRectangle(transform as RectTransform,     Input.mousePosition, Camera.main, out pos);

    pos += _size;
    pos /= _size.x * 2.0f;

    _targetColor.r = pos.y * _sourceColor.r + pos.y * (1 - pos.x) * (1 - _sourceColor.r);
    _targetColor.g = pos.y * _sourceColor.g + pos.y * (1 - pos.x) * (1 - _sourceColor.g);
    _targetColor.b = pos.y * _sourceColor.b + pos.y * (1 - pos.x) * (1 - _sourceColor.b);
    _targetColor.a = _sourceColor.a;

    _targetImage.color = _targetColor;
}