flash解构涂料中的应用VI：渐变的矩形工具
时间:2012-12-18 14:12来源:卓想动画http://www.zxgzs.com 作者:QQ：610929375 点击: 次
在接下来的组中的工具，让我们来看看在渐变的矩形工具。 就像所有的人，我们需要做的第一件事就是设置
按钮改变_root.isactive（变量代表我们的主动工具）的梯度矩形：
on (release) { _root.isactive = “gradientrec”; }
就像用矩形工具，渐变矩形的轮廓跟踪形成的矩形的尺寸，只要按下鼠标按钮，光标的运动。
实际上，你可以使用相同的跟踪矩形工具 ，只要确保修改语句检查活动的工具，包括的| | _root.isactive
==“gradientrec”（| |代表或符号，使跟踪器，如果矩形工具处于活动状态或渐变工具是 - 在if语句的条
件感到满意，只要它是一个或另一个，不都需要）。
在我们继续之前的行为时，释放鼠标按钮，绘制渐变的矩形，我们首先需要确定使用onClipEvent（负载）的
某些变量设置默认值时，电影最初加载，然后检查并更新值，这些输入文本框的onClipEvent（enterFrame事
件）的变量：
onClipEvent(load){ _root.layer.gradientcolor1=0xFF0000; _root.layer.gradientcolor2=0x0000FF;
_root.layer.gradientalpha1=100; _root.layer.gradientalpha2=50; _root.base.gc1="FF0000";
_root.base.gc2="0000FF"; _root.base.ga1="100"; _root.base.ga2="75"; } onClipEvent(enterFrame) {
testcolor1="0x"+_root.base.gc1; testcolor2="0x"+_root.base.gc2; //make the color boxes display
each individual gradient color gradcol1=new Color(_root.base.gdcolor1); gradcol1.setRGB
(testcolor1); _root.base.gdcolor1._alpha=_root.base.ga1; gradcol2=new Color
(_root.base.gdcolor2); gradcol2.setRGB(testcolor2); _root.base.gdcolor2._alpha=_root.base.ga2; }
要打破这种下降简介：使用适当的为0xFF0000格式的十六进制值设置渐变颜色，也填补了目前的渐变颜色的标
准的FF0000格式值的输入框。 它还设置不透明度每个渐变色，在100和75。
每次帧重新加载，在输入文本框的值被读出，然后再连接以0x为0x000000的格式（表示变量testcolor1和
testcolor2），然后把它放在setRGB是用来改变颜色表示当前的渐变颜色样本相匹配。
我们还没有完成，onClipEvent事件（enterFrame事件），虽然。 我们必须做一些工作，我们已经建立的梯度
输入文本框的字符串，将其转换为特定类型的数值。 这是严格的渐变填充，只因为我们把变量的实际值的地
方使用，而不会是必要的，否则，你会看到在接下来的步骤：
//convert the strings from the gradient input boxes into numeric values tscolor1=Number
(testcolor1); color1=parseInt(tscolor1,10); tscolor2=Number(testcolor2); color2=parseInt
(tscolor2,10); tsalpha1=Number(_root.base.ga1); tsalpha2=Number(_root.base.ga2);
采用了两种新功能： 数（）和parseInt（）。 数函数有很多用途，但在这种情况下，分析的testcolor的字
符串，并将其转换为十进制值，不相同的α值（其中，因为他们从输入文本框，最初作为字符串读取）。
alpha值返回的值是工作得很好，但返回的数字渐变的颜色会让有点乱，所以我们使用parseInt将其转换为整
数为基数10（十进制）。 parseInt函数的表达，将其转换为一个基数/数字的基地，如八进制[parseInt函数
（表达式，8）]或十六进制[parseInt函数（表达式，16）]中的值。
现在，我们已经得到了我们所有的变量设置在渐变中使用的填充，让我们来看看实际的代码执行时，释放鼠标
按钮：
if (_root.isactive=="gradientrec"){ _root.layer.lineStyle(0,_root.currentcolor,0);
diffx=_root.linex-_root._xmouse; diffy=_root.liney-_root._ymouse; if(diffx<0){ _root.xwidth=-
diffx; } else{ _root.xwidth=diffx; } if(diffy<0){ _root.yheight=-diffy; } else {
_root.yheight=diffy; } _root.radius=(_root.base.gcangle/180)*Math.PI; _root.layer.colors =
[color1,color2]; _root.layer.alphas = [tsalpha1,tsalpha2]; _root.layer.ratios = [25,225];
_root.layer.matrix =
{matrixType:"box",x:_root.linex,y:_root.liney,w:_root.xwidth,h:_root.yheight,r:_root.radius};
_root.layer.moveTo(_root.linex,_root.liney); _root.layer.beginGradientFill("linear",
_root.layer.colors, _root.layer.alphas, _root.layer.ratios,_root.layer.matrix);
_root.layer.lineTo(_root.linex,_root._ymouse); _root.layer.lineTo(_root.linex,_root.liney);
_root.layer.lineTo(_root._xmouse,_root.liney); _root.layer.lineTo(_root._xmouse,_root._ymouse);
_root.layer.lineTo(_root.linex,_root._ymouse); _root.layer.endFill(); _root.rectracker.clear();
}
害怕了吗？ 不要。 我们要打破这三个简单的部分。
首先，让我们来看看在绘制渐变的矩形，最重要的是使用beginGradientFill（）函数，那么我们就可以看打
破的部分融入。
if (_root.isactive=="gradientrec"){ _root.layer.lineStyle(0,_root.currentcolor,0);
_root.layer.moveTo(_root.linex,_root.liney); _root.layer.beginGradientFill("linear",
_root.layer.colors, _root.layer.alphas, _root.layer.ratios,_root.layer.matrix);
_root.layer.lineTo(_root.linex,_root._ymouse); _root.layer.lineTo(_root.linex,_root.liney);
_root.layer.lineTo(_root._xmouse,_root.liney); _root.layer.lineTo(_root._xmouse,_root._ymouse);
_root.layer.lineTo(_root.linex,_root._ymouse); _root.layer.endFill(); _root.rectracker.clear();
}
这样，它看起来几乎完全一样的代码绘制实心矩形
-改为只使用beginFill，它使用beginGradientFill和许多更多的参数。
beginGradientFill采用以下格式：
myMovieClip.beginGradientFill（fillType，颜色，透明度，比率矩阵）
fillType只能有一个2：直链，或径向。 颜色，Alpha和比率是所有的阵列，其中包含渐变的颜色（通常以十
六进制格式），为混浊的值（通常是数字），和的比率（定义的颜色分布的值的值，其中每个颜色是在100 ％
，通常是数字）。 你会发现每一个附录说：“通常”。 在我们自己，我们使用变量，究其原因，我们必须分
析我们的字符串转换成数字值在前面的步骤。
的最后部分，矩阵，是一个转换矩阵，定义绘制的矩形的属性。
让我们分析一下，我们使用的阵列：
_root.layer.colors = [color1,color2]; _root.layer.alphas = [tsalpha1,tsalpha2];
_root.layer.ratios = [25,225];
这部分其实很简单，如果你的词汇定义的数组是什么 ：只是一个列表的值。 我们已经创建的变量存放数值的
两个渐变的颜色和alpha值创建数组这种格式的只是让那些值列表的容器。 我的阵列命名的颜色，alphas和比
率，并使用beginGradientFill（）函数中使用在以前的步骤中所示。 这仅仅是一个简单的方法来给这个函数
的值需要被绘制渐变的矩形，以正确的顺序和格式。
最后，让我们来看看在矩阵本身，最后一个参数所要求的beginGradienFill：
_root.layer.matrix =
{matrixType:"box",x:_root.linex,y:_root.liney,w:_root.xwidth,h:_root.yheight,r:_root.rad};
对于单一的文本行，这可能看起来非常混乱。 为了澄清几件事情：_root.linex和_root.liney我一直在使用
通过整个应用程序捕获的开始首先按下鼠标按钮时，x和y坐标是通用的变量。 _root.xwidth和
_root.yheight是我创建的变量，在主代码样本，以确定的起点和终点的x和y坐标的鼠标，当鼠标按钮被释放
，并检查之间的像素数看，如果计算出的值是正还是负。 如果是负的，它把积极的，所以我们不会有负面的
宽度或高度。 _root.rad是我创建另一个变量捕捉到渐变的角度（度），由用户输入一个输入文本框，然后
将其转换为旋转弧度。
现在，我的个别变量的解释，让我们来看看在实际的基本矩阵格式。 有两种不同的方法来做到这一点 - 无论
是作为一个基本的矩阵，或者作为一个matrixType。 我喜欢matrixType的，因为它更容易“破发”的代码：
matrix = {matrixType, x:###, y:###, w:###, h:###, r:### };
matrixType是一个字符串，定义其属性被列出在基质中，在这种情况下，一个“盒子”类型的形状。 x和y
是附图开始阶段的坐标平面上的起点; w和h是正在绘制的框的宽度和高度，且r为以弧度为单位的渐变的角度
。 这些值可以是数字或变量。
这几乎涵盖了这一个。
(责任编辑：卓想动画http://www.zxgzs.com)
上一篇：flash动画的语言特征
下一篇：解释先进的3D Flash中
