使用圖形資料類別Flash Player 10 以及更新的版本,Adobe AIR 1.5 以及更新的版本 增強的繪圖 API 在 flash.display 套件中新增了一組類別,其類型為 IGraphicsData (每個類別實作的介面)。實作 IGraphicsData 介面之類別的作用,就是做為繪圖 API 之方法的資料容器。 下列類別會實作 IGraphicsData 介面:
使用上述類別,即可將完整的繪圖儲存在 IGraphicsData 類型的向量物件陣列 (Vector.<IGraphicsData>) 中,這個陣列可以做為其它形狀實體的資料來源重複使用,或者可以儲存繪圖資訊供稍後使用。 請注意,每個填色樣式都有多個填色類別可供使用,但是您只能使用一個筆畫類別。ActionScript 只有一個筆畫 IGraphicsData 類別,因為這個筆畫類別可以使用多個填色類別定義其樣式。所以,每個筆畫實際上就是這個筆畫類別和某一填色類別。另外,這些圖形資料類別的 API 會反映其在 flash.display.Graphics 類別中的表示方法:
此外,GraphicsPath 類別有自己的 GraphicsPath.moveTo()、GraphicsPath.lineTo()、GraphicsPath.curveTo()、GraphicsPath.wideLineTo() 以及 GraphicsPath.wideMoveTo() 公用程式方法,可用來輕易地為 GraphicsPath 實體定義這些命令。直接定義或更新命令和資料值時,利用這些公用程式方法可以讓您更加輕鬆。 當您擁有一組 IGraphicsData 實體之後,可以使用 Graphics.drawGraphicsData() 方法呈現這些圖形。Graphics.drawGraphicsData() 方法會透過繪圖 API,依序執行 IGraphicsData 實體的向量: // stroke object var stroke:GraphicsStroke = new GraphicsStroke(3); stroke.joints = JointStyle.MITER; stroke.fill = new GraphicsSolidFill(0x102020);// solid stroke // fill object var fill:GraphicsGradientFill = new GraphicsGradientFill(); fill.colors = [0x0000FF, 0xEEFFEE]; fill.matrix = new Matrix(); fill.matrix.createGradientBox(70,70, Math.PI/2); // path object var path:GraphicsPath = new GraphicsPath(new Vector.<int>(), new Vector.<Number>()); path.commands.push(1,2,2); path.data.push(125,0, 50,100, 175,0); // combine objects for complete drawing var drawing:Vector.<IGraphicsData> = new Vector.<IGraphicsData>(); drawing.push(stroke, fill, path); // draw the drawing graphics.drawGraphicsData(drawing); 藉由修改上述範例中繪圖所使用之路徑內的其中一個值,即可針對更複雜的影像多次重繪圖形: // draw the drawing multiple times // change one value to modify each variation graphics.drawGraphicsData(drawing); path.data[2] += 200; graphics.drawGraphicsData(drawing); path.data[2] -= 150; graphics.drawGraphicsData(drawing); path.data[2] += 100; graphics.drawGraphicsData(drawing); path.data[2] -= 50;graphicsS.drawGraphicsData(drawing); 透過 IGraphicsData 物件即可定義填色和筆畫樣式,但是您不一定要使用這些填色和筆畫樣式。換句話說,Graphics 類別方法可用於設定樣式,而 IGraphicsData 物件則可用於繪製已儲存的一組路徑,反之亦然。 備註: 除非您是要在原始繪圖上新增內容 (如上述範例中所示),否則,在開始新的繪圖之前,請使用 Graphics.clear() 方法清除舊的繪圖。當您變更某一路徑或一組 IGraphicsData 物件的單一部分時,請重繪整個繪圖以查看變更內容。
使用圖形資料類別時,只要繪製三個以上的點就會呈現填色,這是因為形狀在本質上會在該點結束的緣故。即使填色結束了,但筆畫仍未結束,因此這項行為指令與使用 Graphics.lineTo() 或 Graphics.moveTo() 命令時不同。 |
|