<?xml version="1.0" encoding="utf-8"?> <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/halo"minWidth="1024" minHeight="768" xmlns:mx1="library://ns.adobe.com/flex/mx"><fx:Script><![CDATA[import flash.geom.Matrix;/*畫圖形之前必要調用的函數（其中之一即可）：linestyle()、beginFill()、lineGradientStyle()、beginGradientFill()、beginBitmapFill()方法來設置線條樣式和/或填充。 *///畫矩形private function rect(rectX:Number, rectY:Number, rectWidth:Number, rectHeight:Number):void{rectBoxID.graphics.clear();if(radioLineID.selected){ //線性rectBoxID.graphics.lineStyle(20, 0xFF0000, 1.0, false, LineScaleMode.VERTICAL, CapsStyle.NONE, JointStyle.MITER, 100);}else if(radioGradientID.selected){ //漸變var matr:Matrix = new Matrix();matr.createGradientBox(20, 20, 0, 0, 0);//the last parameter can selete three type: SpreadMethod.PAD or SpreadMethod.REFLECT or SpreadMethod.REPEAT.rectBoxID.graphics.beginGradientFill(GradientType.LINEAR, [0xFF0000, 0x00FF00], [1, 1], [0x00, 0xFF], matr, SpreadMethod.REPEAT);}else if(radioFullID.selected){ //填充rectBoxID.graphics.beginFill(0xFF0000, 1.0);}rectBoxID.graphics.drawRect(rectX, rectY, rectWidth, rectHeight);// }//畫圓角矩形private function circleRect(cRectX:Number, cRectY:Number, cRectWidth:Number, cRectHeight:Number, cRectDU:Number):void{cRectBoxID.graphics.clear();if(radioLineID.selected){ //線性cRectBoxID.graphics.lineStyle(20, 0xFF0000, 1.0, false, LineScaleMode.VERTICAL, CapsStyle.NONE, JointStyle.MITER, 100);}else if(radioGradientID.selected){ //漸變//the last parameter can selete three type: SpreadMethod.PAD or SpreadMethod.REFLECT or SpreadMethod.REPEAT.cRectBoxID.graphics.beginGradientFill(GradientType.LINEAR, [0xFF0000, 0x0000FF], [1, 0.1], [0, 255], new Matrix(), SpreadMethod.PAD);rectBoxID.graphics.endFill();}else if(radioFullID.selected){ //填充cRectBoxID.graphics.beginFill(0xFF0000, 1.0);}cRectBoxID.graphics.drawRoundRect(cRectX, cRectY, cRectWidth, cRectHeight, cRectDU);}//畫直線private function line(lineX:Number, lineY:Number):void{ //兩個參數都表示從起始的位置坐標x、y相加這兩個參數后值就是結束的x、y值lineBoxID.graphics.clear();if(radioLineID.selected){ //線性lineBoxID.graphics.lineStyle(20, 0xFF0000, 1.0, false, LineScaleMode.VERTICAL, CapsStyle.NONE, JointStyle.MITER, 100);}else if(radioGradientID.selected){ //漸變lineBoxID.graphics.lineStyle(20, 0xFF0000, 1.0, false, LineScaleMode.VERTICAL, CapsStyle.NONE, JointStyle.MITER, 100);lineBoxID.graphics.lineGradientStyle(GradientType.LINEAR, [0xFF0000, 0x0000FF], [1, 0.5], [0, 255], new Matrix(), SpreadMethod.PAD);}else if(radioFullID.selected){ //（填充）直線不存在填充的，呵呵lineBoxID.graphics.lineStyle(20, 0xFF0000, 1.0, false, LineScaleMode.VERTICAL, CapsStyle.NONE, JointStyle.MITER, 100);}lineBoxID.graphics.lineTo(lineX, lineY);}//畫曲線private function cLine(endX:Number, endY:Number):void{cLineBoxID.graphics.clear();if(radioLineID.selected){ //線性cLineBoxID.graphics.lineStyle(20, 0xFF0000, 1.0, false, LineScaleMode.VERTICAL, CapsStyle.NONE, JointStyle.MITER, 100);}else if(radioGradientID.selected){ //漸變var matr:Matrix = new Matrix();matr.createGradientBox(20, 20, 0, 0, 0);cLineBoxID.graphics.beginGradientFill(GradientType.LINEAR, [0xFF0000, 0x00FF00, 0xFF0000], [0.2, 1, 1], [0, 128, 255], matr, SpreadMethod.REFLECT);}else if(radioFullID.selected){ //填充cLineBoxID.graphics.beginFill(0xFF0000);}cLineBoxID.graphics.curveTo(100, 80, endX, endY); //前兩個參數表示弧度的偏移量，后兩個參數表示結束點的x、y坐標}//畫圓private function circle(oX:Number, oY:Number, radius:Number):void{circleBoxID.graphics.clear();if(radioLineID.selected){ //線性circleBoxID.graphics.lineStyle(20, 0xFF0000, 1.0, false, LineScaleMode.VERTICAL, CapsStyle.NONE, JointStyle.MITER, 100);}else if(radioGradientID.selected){ //漸變var matr:Matrix = new Matrix();matr.createGradientBox(20, 20, 0, 0, 0);circleBoxID.graphics.beginGradientFill(GradientType.LINEAR, [0xFF0000, 0x00FF00, 0xFF0000], [0.2, 1, 1], [0, 128, 255], matr, SpreadMethod.REFLECT, "rgb", 0.7);}else if(radioFullID.selected){ //填充circleBoxID.graphics.beginFill(0xFF0000);}circleBoxID.graphics.drawCircle(oX, oY, radius);}//畫橢圓private function tCircle(x:Number, y:Number, tWidth:Number, tHeight:Number):void{tCircleBoxID.graphics.clear();if(radioLineID.selected){ //線性tCircleBoxID.graphics.lineStyle(20, 0xFF0000, 1.0, false, LineScaleMode.VERTICAL, CapsStyle.NONE, JointStyle.MITER, 100);}else if(radioGradientID.selected){ //漸變var matr:Matrix = new Matrix();matr.createGradientBox(20, 20, 0, 0, 0);//the last parameter can selete three type: SpreadMethod.PAD or SpreadMethod.REFLECT or SpreadMethod.REPEAT.tCircleBoxID.graphics.beginGradientFill(GradientType.LINEAR, [0xFF0000, 0x00FF00], [1.0, 1.0], [0x00, 0xFF], matr, SpreadMethod.REPEAT);}else if(radioFullID.selected){ //填充tCircleBoxID.graphics.beginFill(0xFF0000);}tCircleBoxID.graphics.drawEllipse(x, y, tWidth, tHeight);}]]></fx:Script><!--畫矩形--><mx1:Button id="rectButID" x="500" y="50" label="畫矩形" click="rect(100, 20, 250, 50);"/><mx1:Box id="rectBoxID"/><!--畫圓角矩形--><mx1:Button id="cRectButID" x="500" y="120" label="畫圓角矩形" click="circleRect(100, 100, 300, 80, 50);"/><mx1:Box id="cRectBoxID"/><!--畫直線--><mx1:Button id="lineButID" x="500" y="250" label="畫直線" click="line(350, 0);"/><mx1:Box id="lineBoxID" x="50" y="250"/><!--畫曲線--><mx1:Button id="cLineButID" x="500" y="350" label="畫曲線" click="cLine(300, 0);"/><mx1:Box id="cLineBoxID" x="100" y="300"/><!--畫圓--><mx1:Button id="circleButID" x="500" y="450" label="畫圓" click="circle(250, 450, 50);"/><mx1:Box id="circleBoxID"/><!--畫橢圓--><mx1:Button id="tCircleButID" x="500" y="550" label="畫橢圓" click="tCircle(120, 520, 150, 50);"/><mx1:Box id="tCircleBoxID"/><mx1:RadioButton id="radioLineID" x="600" y="50" label="線性"/><mx1:RadioButton id="radioGradientID" x="750" y="50" label="漸變" selected="true"/><mx1:RadioButton id="radioFullID" x="900" y="50" label="填充"/></s:Application>

?

總結

以上是生活随笔為你收集整理的Flex Graphics的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。