均匀渐变
一下是从cl1到cl2渐变：
            int R, G, B;
            Color cl1 = Color.Red;
            Color cl2 = Color.Blue;
            for (int i = 0; i < jishu; i++)
            {
                R = cl1.R + (cl2.R - cl1.R) * i / jishu;
                G = cl1.G + (cl2.G - cl1.G) * i / jishu;
                B = cl1.B + (cl2.B - cl1.B) * i / jishu;
                Color cl = Color.FromArgb(R, G, B);
                SolidBrush sb = new SolidBrush(cl);
                gr.FillRectangle(sb, 0, i * (panel1.Height / 8), panel1.Width, panel1.Height / 8);         
            }
渐变(Gradient)是美学中一条重要的形式美法则，与其相对应的是突变。形状、大小、位置、方向、彩等视觉因素都可以进行渐变。在彩中，相、明度、纯度也都可以产生渐变效果，并会表现出具有丰富层次的美感。本文主要讲述两种颜RGB数值的渐变算法。
已知：A=50，B=200，A、B之间平均分成3份（Step=3），求每份的数值（StepN）分别是多少。
公式：Gradient = A + (B-A) / Step * N
渐变颜代码大全[注]编程时为了提高效率避免浮点运算，往往把除法放在最后面，这样公式就成了：Gradient = A + (B-A) * N / Step
Step=3时，根据公式可以求出Step1=A+(A-B)/3*1=50+(200-50)/3=100，Step2=A+(A-B)/3*2=50+(200-50)/3*2=150。这就是均匀渐变的算法原理了，很简单，小学知识。
两种颜的渐变就是对两种颜的RGB通道分别进行这样的计算，例如两种颜分别是RGB(200,50,0)和RGB(50,200,0)，用上述公式进行计算就是：
RStep1=RA=RA+(BA-RA)/Step*N=200+(50-200)/3*1=200-50=150
GStep1=GA=GA+(GA-GA)/Step*N=50+(200-50)/3*1=50+50=100
BStep1=BA=BA+(BA-BA)/Step*N=0
因此RGBStep1=(150,100,0)，同样的方法可以求出RGBStep2=(100,150,0)。
网页中的渐变文字特效就是这么做出来的。例如你的网页HTML中有这么一句代码：<span id=myText>你就是我天空里最美丽的彩虹</span>，在后面加入如下的代码就可以实现渐变文字。（生成渐变的两种颜：#c597ff和#73e7a9）
<SCRIPT language="JavaScript">
var ColorA = "#c597ff";
var ColorB = "#73e7a9";
// 颜#FF00FF格式转为Array(255,0,255)
function color2rgb(color)
{
var r = parseInt(color.substr(1, 2), 16);
var g = parseInt(color.substr(3, 2), 16);
var b = parseInt(color.substr(5, 2), 16);
return new Array(r, g, b);
}
// 颜Array(255,0,255)格式转为#FF00FF
function rgb2color(rgb)
{
var s = "#";
for (var i = 0; i < 3; i++)
{
  var c = und(rgb[i]).toString(16);
  if (c.length == 1)
  c = '0' + c;
  s += c;
}
UpperCase();
}
// 生成渐变
function gradient()
{
var str = myText.innerText;
var result = "";
var Step = str.length - 1;
var Gradient = new Array(3);
var A = color2rgb(ColorA);
var B = color2rgb(ColorB);
for (var N = 0; N <= Step; N++)
{
  for (var c = 0; c < 3; c++) // RGB通道分别进行计算
  {
  Gradient[c] = A[c] + (B[c]-A[c]) / Step * N;
  }
  result += "<font color=" + rgb2color(Gradient) +
  ">" + str.charAt(N) + "</font>";
}
myText.innerHTML = result;
}
gradient(); // 运行程序
</SCRIPT>

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。