套件flash.display
類別public final class Graphics
繼承Graphics Inheritance Object

語言版本 : ActionScript 3.0
Player 版本 : Flash Player 9

Graphics 類別包含一組方法,可讓您用來建立向量形狀。 支援繪圖的顯示物件包括 Sprite 和 Shape 物件。 這些類別中,每個都包含屬於 Graphics 物件的 graphics 屬性。 下列提供一些簡單易用的助理函數:drawRect()drawRoundRect()drawCircle()drawEllipse()

您不能直接從 ActionScript 程式碼建立 Graphics 物件。 如果您呼叫 new Graphics(),就會擲出例外。

Graphics 類別是最下層的類別;它不會有子類別。

檢視範例

請參閱

使用繪圖 API 基本課程


公用 屬性
 屬性定義自
 Inheritedconstructor : Object
類別物件的參照或是特定物件實體的建構函數。
Object
 Inheritedprototype : Object
[static] 類別或函數物件之原型物件的參照。
Object
公用 方法
 方法定義自
  
beginBitmapFill(bitmap:BitmapData, matrix:Matrix = null, repeat:Boolean = true, smooth:Boolean = false):void
以點陣圖影像填滿繪圖區。
Graphics
  
beginFill(color:uint, alpha:Number = 1.0):void
指定簡單的單色填色,方便 Flash Player 對物件的其它 Graphics 方法 (例如 lineTo() 或 drawCircle()) 進行後續的呼叫。
Graphics
  
beginGradientFill(type:String, colors:Array, alphas:Array, ratios:Array, matrix:Matrix = null, spreadMethod:String = "pad", interpolationMethod:String = "rgb", focalPointRatio:Number = 0):void
指定漸層填色,方便 Flash Player 對物件的其它 Graphics 方法 (例如 lineTo() 或 drawCircle()) 進行後續的呼叫。
Graphics
  
清除繪製成此 Graphics 物件的圖像,並重新設定填色與線段樣式設定。
Graphics
  
curveTo(controlX:Number, controlY:Number, anchorX:Number, anchorY:Number):void
使用目前的線段樣式,根據 (controlX, controlY) 所指定的控制點,從目前的繪圖位置到 (anchorX, anchorY) 繪製一條曲線。
Graphics
  
繪製圓形。
Graphics
  
drawEllipse(x:Number, y:Number, width:Number, height:Number):void
繪製橢圓。
Graphics
  
drawRect(x:Number, y:Number, width:Number, height:Number):void
繪製矩形。
Graphics
  
drawRoundRect(x:Number, y:Number, width:Number, height:Number, ellipseWidth:Number, ellipseHeight:Number):void
繪製圓角矩形。
Graphics
  
將填色套用到最後一次呼叫 beginFill()、beginGradientFill() 或 beginBitmapFill() 方法之後所加入的線段和曲線上。
Graphics
 Inherited
指出物件是否有已定義的指定屬性。
Object
 Inherited
指出 Object 類別的實體是否位於指定為參數的物件原型鏈中。
Object
  
lineGradientStyle(type:String, colors:Array, alphas:Array, ratios:Array, matrix:Matrix = null, spreadMethod:String = "pad", interpolationMethod:String = "rgb", focalPointRatio:Number = 0):void
指定線段樣式的漸層,方便 Flash Player 對物件的其它 Graphics 方法 (例如 lineTo() 或 drawCircle()) 進行後續的呼叫。
Graphics
  
lineStyle(thickness:Number, color:uint = 0, alpha:Number = 1.0, pixelHinting:Boolean = false, scaleMode:String = "normal", caps:String = null, joints:String = null, miterLimit:Number = 3):void
指定線段樣式,方便 Flash 對物件的其它 Graphics 方法 (例如 lineTo() 或 drawCircle()) 進行後續的呼叫。
Graphics
  
使用目前的線段樣式,從目前的繪圖位置到 (x, y) 繪製一條線段;然後目前的繪圖位置就會設定為 (x, y)。
Graphics
  
將目前的繪圖位置移到 (x, y)。
Graphics
 Inherited
指出指定的屬性是否存在,以及是否可列舉。
Object
 Inherited
為迴圈作業設定動態屬性的可用性。
Object
 Inherited
會傳回指定之物件的字串形式。
Object
 Inherited
會傳回指定之物件的基本值。
Object
方法詳細資訊
beginBitmapFill()方法
public function beginBitmapFill(bitmap:BitmapData, matrix:Matrix = null, repeat:Boolean = true, smooth:Boolean = false):void

語言版本 : ActionScript 3.0
Player 版本 : Flash Player 9

以點陣圖影像填滿繪圖區。 點陣圖可以重複或拼貼填滿區域。 填色會一直維持有效,直到您呼叫 beginFill()beginBitmapFill()beginGradientFill() 方法為止。 呼叫 clear() 方法會清除填色。

Flash Player 不會顯示填色,除非呼叫 endFill() 方法。

參數

bitmap:BitmapData — 包含要顯示的位元之透明或不透明點陣圖影像。
 
matrix:Matrix (default = null) — 這是一個矩陣物件 (屬於 flash.geom.Matrix 類別),可以用來定義點陣圖的變形。 例如,您可以使用下列矩陣將點陣圖旋轉 45 度 (pi/4 弧度):
  matrix = new flash.geom.Matrix(); 
  matrix.rotate(Math.PI/4);
  
 
repeat:Boolean (default = true) — 若為 true,將以並排模式重複顯示點陣圖影像。 如果是 false,則不會重複顯示點\'b0\'7d圖影像,而且會使用點\'b0\'7d圖的邊緣來填滿任何超出此點\'b0\'7d圖的填色區域。

例如,以下列點陣圖 (20 x 20 像素棋盤圖樣) 為例:

repeat 設為 true 時 (如下列範例所示),會重複顯示此點陣圖,以填滿填色區域:

repeat 設為 false 時,會使用邊緣像素來填滿落在此點陣圖外的填色區域:

 
smooth:Boolean (default = false) — 若為 false,則使用最近鄰點法呈現放大後的點陣圖影像,影像會呈現像素化。 若為 true,則使用雙線性插補法呈現放大後的點陣圖影像。 使用最近鄰點法顯示影像通常較為快速。

請參閱


範例

下列範例使用一個影像 (image1.jpg),旋轉並一再重複以填滿矩形空間。
  1. 使用 LoaderURLRequest 物件載入影像檔 (image1.jpg)。 在這裡,該檔案與 SWF 檔在相同目錄中。 編譯 SWF 檔時,必須將「本機播放安全性」設定為「只存取本機檔案」。
  2. 載入影像之後 (Event 已完成),會呼叫 drawImage() 方法。 如果影像未正確載入,ioErrorHandler() 方法會寫入轉換註解。
  3. drawImage() 方法會實體化 BitmapData 物件,並將其寬度和高度設定為影像 (image1.jpg)。 然後在 BitmapData 物件中繪製來源影像。 接著,在 mySprite Sprite 物件中繪製矩形,並使用 BitmapData 物件填滿該矩形。 beginBitmapFill() 方法會使用 Matrix 物件將影像旋轉 45 度,然後用該影像填滿矩形,直到完成為止。
package {
    import flash.display.Sprite;
    import flash.display.BitmapData;
    import flash.display.Loader;
    import flash.net.URLRequest;
    import flash.events.Event;
    import flash.events.IOErrorEvent;
    import flash.geom.Matrix;

    public class Graphics_beginBitmapFillExample extends Sprite {
 
        private var url:String = "image1.jpg";
        private var loader:Loader = new Loader();

        public function Graphics_beginBitmapFillExample() {

            var request:URLRequest = new URLRequest(url);
            
            loader.load(request);
            loader.contentLoaderInfo.addEventListener(Event.COMPLETE, drawImage);
            loader.contentLoaderInfo.addEventListener(IOErrorEvent.IO_ERROR, ioErrorHandler);
        }

        private function drawImage(event:Event):void {

            var mySprite:Sprite = new Sprite();
            var myBitmap:BitmapData = new BitmapData(loader.width, loader.height, false);
  
            myBitmap.draw(loader, new Matrix());
            
            var matrix:Matrix = new Matrix();
            matrix.rotate(Math.PI/4);
            
            mySprite.graphics.beginBitmapFill(myBitmap, matrix, true);
            mySprite.graphics.drawRect(100, 50, 200, 90);
            mySprite.graphics.endFill();
            
            addChild(mySprite);
        }
 
         private function ioErrorHandler(event:IOErrorEvent):void {
            trace("Unable to load image: " + url);
        }
    }   
}
beginFill()方法 
public function beginFill(color:uint, alpha:Number = 1.0):void

語言版本 : ActionScript 3.0
Player 版本 : Flash Player 9

指定簡單的單色填色,方便 Flash Player 對物件的其它 Graphics 方法 (例如 lineTo()drawCircle()) 進行後續的呼叫。 填色會一直維持有效,直到您呼叫 beginFill()beginBitmapFill()beginGradientFill() 方法為止。 呼叫 clear() 方法會清除填色。

Flash Player 不會顯示填色,除非呼叫 endFill() 方法。

參數

color:uint — 填色顏色 (0xRRGGBB)。
 
alpha:Number (default = 1.0) — 填色的 Alpha 值 (0.0 to 1.0)。

請參閱


範例
如何使用範例
如需有關如何使用這個方法的說明,請參閱這個類別結束處的範例
beginGradientFill()方法 
public function beginGradientFill(type:String, colors:Array, alphas:Array, ratios:Array, matrix:Matrix = null, spreadMethod:String = "pad", interpolationMethod:String = "rgb", focalPointRatio:Number = 0):void

語言版本 : ActionScript 3.0
Player 版本 : Flash Player 9

指定漸層填色,方便 Flash Player 對物件的其它 Graphics 方法 (例如 lineTo()drawCircle()) 進行後續的呼叫。 填色會一直維持有效,直到您呼叫 beginFill()beginBitmapFill()beginGradientFill() 方法為止。 呼叫 clear() 方法會清除填色。

Flash Player 不會顯示填色,除非呼叫 endFill() 方法。

參數

type:String — 來自 GradientType 類別的數值可用來指定要用哪個漸層模式:GradientType.LINEARGradientType.RADIAL
 
colors:Array — 用在漸層中的 RGB 十六進位顏色值陣列 (例如,紅色是 0xFF0000、藍色是 0x0000FF,以此類推)。 您可以指定多達 15 種顏色。 針對每種顏色,您必須在 Alpha 與比例參數中指定相對應的值。
 
alphas:Array — Alpha 值的陣列,會對應到 colors 陣列中的顏色,有效值從 0 到 1。 如果值小於 0,則預設為 0。 如果值大於 1,則預設為 1。
 
ratios:Array — 顏色分佈比例的陣列。有效值為 0 到 255。 此值會定義寬度 (其中顏色是以 100% 的比例進行取樣) 的百分比。 數值 0 代表位於漸層方塊的左手位置,而數值 255 代表漸層方塊的右手位置。

注意:此值代表漸層方塊中的位置,而不是最後漸層的座標空間,因為後者會比漸層方塊寬一點或小一點。 請針對 colors 參數中的每一個值指定其對應的值。

例如,如果是含有兩種顏色 (藍色和綠色) 的線性漸層,下圖示範了依據 ratios 陣列中不同的值,這兩種顏色在漸層中的置放方式:

ratios漸層
[0, 127]
[0, 255]
[127, 255]

\'b0\'7d列中的值必須依序增加;例如 [0, 63, 127, 190, 255]

 
matrix:Matrix (default = null) — flash.geom.Matrix 類別所定義的變形矩陣。 flash.geom.Matrix 類別包含 createGradientBox() 方法,可以讓您輕易地設定矩陣,以便與 beginGradientFill() 方法搭配使用。
 
spreadMethod:String (default = "pad") — 來自 SpreadMethod 類別的數值可用來指定要使用哪個散佈方法:SpreadMethod.PADSpreadMethod.REFLECTSpreadMethod.REPEAT

例如,假設一個簡單的兩色線性漸層:

  import flash.geom.*
  import flash.display.*
  var fillType:String = GradientType.LINEAR;
  var colors:Array = [0xFF0000, 0x0000FF];
  var alphas:Array = [1, 1];
  var ratios:Array = [0x00, 0xFF];
  var matr:Matrix = new Matrix();
  matr.createGradientBox(20, 20, 0, 0, 0);
  var spreadMethod:String = SpreadMethod.PAD;
  this.graphics.beginGradientFill(fillType, colors, alphas, ratios, matr, spreadMethod);  
  this.graphics.drawRect(0,0,100,100);
  

本範例使用 SpreadMethod.PAD 散佈方法,所以漸層填色看起來會像下面這樣:

如果是使用 SpreadMethod.REFLECT 散佈方法,漸層填色看起來會像下面這樣:

如果是使用 SpreadMethod.REPEAT 散佈方法,漸層填色看起來會像下面這樣:

 
interpolationMethod:String (default = "rgb") — 來自 InterpolationMethod 類別的數值,可指定要用哪個數值:InterpolationMethod.linearRGBInterpolationMethod.RGB

例如,假設有一個簡單的兩色線性漸層 (spreadMethod 參數設為 SpreadMethod.REFLECT)。 不同的內插補點方法將會產生不同的外觀,如下所示:

InterpolationMethod.LINEAR_RGBInterpolationMethod.RGB
 
focalPointRatio:Number (default = 0) — 這是一個數字,用來控制漸層的焦點位置。 0 表示焦點位於正中央。 1 表示焦點位於漸層圓圈的其中一個邊界。 -1 表示焦點位於漸層圓圈的另一個邊界。 小於 -1 或大於 1 的值會化為整數 -1 或 1。 例如,下列範例會顯示將 focalPointRatio 設為 0.75:


擲回值
ArgumentError — 如果 type 參數無效。

請參閱

clear()方法 
public function clear():void

語言版本 : ActionScript 3.0
Player 版本 : Flash Player 9

清除繪製成此 Graphics 物件的圖像,並重新設定填色與線段樣式設定。

curveTo()方法 
public function curveTo(controlX:Number, controlY:Number, anchorX:Number, anchorY:Number):void

語言版本 : ActionScript 3.0
Player 版本 : Flash Player 9

使用目前的線段樣式,根據 (controlX , controlY) 所指定的控制點,從目前的繪圖位置到 (anchorX, anchorY) 繪製一條曲線。 然後將目前的繪圖位置設定為 (anchorX, anchorY)。 如果您正在繪圖的影片片段中包含用 Flash 繪圖工具所建立的內容,呼叫 curveTo() 方法會在這個內容的下面進行繪製。 如果您在呼叫 moveTo() 方法之前,先呼叫 curveTo() 方法,目前繪圖位置的預設值即為 (0, 0)。 如果遺失任何參數,這個方法就會失敗,而且不會更改目前的繪圖位置。

繪製的曲線是一條二次方貝茲曲線。 二次方貝茲曲線是由二個錨點與一個控制點組成。 曲線會插補上這二個錨點,使曲線朝向控制點。

參數

controlX:Number — 數字,用來指定相對於上層影片物件之註冊點的控制點水平位置。
 
controlY:Number — 數字,用來指定相對於上層影片物件之註冊點的控制點垂直位置。
 
anchorX:Number — 數字,用來指定相對於上層影片物件之註冊點的下一個錨點水平位置。
 
anchorY:Number — 數字,用來指定相對於上層影片物件之註冊點的下一個錨點垂直位置。


範例

下列範例會繪製綠色的圓形物件,寬度和高度為 100 像素,而且與 Sprite 顯示物件的註冊點 (0, 0) 右邊相距 250 個像素。

繪製 4 條曲線以產生一個圓形,並填滿綠色。

請注意,由於二次方貝茲曲線方程式的限制使然,這並不是正圓形。 繪製圓形最好的方法是使用 Graphics 類別的 drawCircle() 方法。

package {
    import flash.display.Sprite;
    import flash.display.Shape;
    
    public class Graphics_curveToExample1 extends Sprite
    {
        public function Graphics_curveToExample1():void
        {
            var roundObject:Shape = new Shape();

            roundObject.graphics.beginFill(0x00FF00);
            roundObject.graphics.moveTo(250, 0);
            roundObject.graphics.curveTo(300, 0, 300, 50);
            roundObject.graphics.curveTo(300, 100, 250, 100);
            roundObject.graphics.curveTo(200, 100, 200, 50);
            roundObject.graphics.curveTo(200, 0, 250, 0);
            roundObject.graphics.endFill();
            
            this.addChild(roundObject);
        }
    }
}

下列範例使用 curveTo() 方法繪製一個新月形。

繪製兩條 1 個像素的曲線,中間填滿白色。 使用 moveTo() 方法將目前繪圖位置放到座標軸 (100, 100)。 第一條曲線將繪圖位置移到目標點 (100, 200)。 第二條曲線將繪圖位置移到目標點,也就是移回起點 (100, 100)。 水平控制點會決定不同的曲線大小。

package {
    import flash.display.Sprite;
    import flash.display.Shape;

    public class Graphics_curveToExample2 extends Sprite
    {
        public function Graphics_curveToExample2() {
            var newMoon:Shape = new Shape();
            
            newMoon.graphics.lineStyle(1, 0);
            newMoon.graphics.beginFill(0xFFFFFF);
            newMoon.graphics.moveTo(100, 100); 
            newMoon.graphics.curveTo(30, 150, 100, 200);    
            newMoon.graphics.curveTo(50, 150, 100, 100);
            graphics.endFill();
            
            this.addChild(newMoon);
        }
    }
}
drawCircle()方法 
public function drawCircle(x:Number, y:Number, radius:Number):void

語言版本 : ActionScript 3.0
Player 版本 : Flash Player 9

繪製圓形。 您必須在呼叫 drawCircle() 方法,藉由呼叫 linestyle()lineGradientStyle()beginFill()beginGradientFill()beginBitmapFill() 方法,來設定線段樣式、填色或兩者。

參數

x:Number — 相對於上層顯示物件 (以像素為單位) 之註冊點的圓形中心 x 位置。
 
y:Number — 相對於上層顯示物件 (以像素為單位) 之註冊點的圓形中心 y 位置。
 
radius:Number — 圓形的半徑,以像素為單位。

請參閱


範例
如何使用範例
如需有關如何使用這個方法的說明,請參閱這個類別結束處的範例
drawEllipse()方法 
public function drawEllipse(x:Number, y:Number, width:Number, height:Number):void

語言版本 : ActionScript 3.0
Player 版本 : Flash Player 9

繪製橢圓。 您必須在呼叫 drawEllipse() 方法,藉由呼叫 linestyle()lineGradientStyle()beginFill()beginGradientFill()beginBitmapFill() 方法,來設定線段樣式、填色或兩者。

參數

x:Number — 橢圓中心的 x 位置,相對於父顯示物件的註冊點 (以像素為單位)。
 
y:Number — 橢圓中心的 y 位置,相對於父顯示物件的註冊點 (以像素為單位)。
 
width:Number — 橢圓的寬度,以像素為單位。
 
height:Number — 橢圓的高度,以像素為單位。

請參閱


範例

下列範例使用 drawEgg() 函數,根據 eggSize 參數繪製三個不同大小的蛋形 (三種大小的橢圓形)。
  1. 建構函式會呼叫 drawEgg() 函數,並傳遞蛋形繪製位置的水平和垂直參數,以及蛋形的類型 (eggSize) (蛋形 (橢圓形) 的高度和寬度可用來決定顯示位置)。
  2. drawEgg() 函數會繪製不同大小的橢圓形,並使用 beginFill() 方法將橢圓形填滿白色。 這個函數沒有進階的錯誤處理功能。
package {
    import flash.display.Sprite;
    import flash.display.Shape;

    public class Graphics_drawEllipseExample extends Sprite
    {
        public static const SMALL:uint = 0;
        public static const MEDIUM:uint = 1;
        public static const LARGE:uint = 2;

        public function Graphics_drawEllipseExample()
        {
            drawEgg(SMALL, 0, 100);
            drawEgg(MEDIUM, 100, 60);
            drawEgg(LARGE, 250, 35);    
        }

        public function drawEgg(eggSize:uint, x:Number, y:Number):void  {
            
            var myEgg:Shape = new Shape();
            
            myEgg.graphics.beginFill(0xFFFFFF);
            myEgg.graphics.lineStyle(1);

            switch(eggSize) {
                case SMALL:
                    myEgg.graphics.drawEllipse(x, y, 60, 70);
                    break;
                case MEDIUM:
                    myEgg.graphics.drawEllipse(x, y, 120, 150);    
                    break;
                case LARGE:
                    myEgg.graphics.drawEllipse(x, y, 150, 200);
                    break;
                default:
                    trace ("Wrong size! There is no egg.");
                break;            
            }
            
            myEgg.graphics.endFill();
    
            this.addChild(myEgg);
        }
    }
}
drawRect()方法 
public function drawRect(x:Number, y:Number, width:Number, height:Number):void

語言版本 : ActionScript 3.0
Player 版本 : Flash Player 9

繪製矩形。 您必須在呼叫 drawRect() 方法,藉由呼叫 linestyle()lineGradientStyle()beginFill()beginGradientFill()beginBitmapFill() 方法,來設定線段樣式、填色或兩者。

參數

x:Number — 指出相對於上層顯示物件 (以像素為單位) 之註冊點的水平位置數字。
 
y:Number — 指出相對於上層顯示物件 (以像素為單位) 之註冊點的垂直位置數字。
 
width:Number — 矩形的寬度,以像素為單位。
 
height:Number — 矩形的高度,以像素為單位。


擲回值
ArgumentError — 如果 widthheight 參數不是數字 (Number.NaN)。

請參閱


範例
如何使用範例
如需有關如何使用這個方法的說明,請參閱這個類別結束處的範例
drawRoundRect()方法 
public function drawRoundRect(x:Number, y:Number, width:Number, height:Number, ellipseWidth:Number, ellipseHeight:Number):void

語言版本 : ActionScript 3.0
Player 版本 : Flash Player 9

繪製圓角矩形。 您必須在呼叫 drawRoundRect() 方法,藉由呼叫 linestyle()lineGradientStyle()beginFill()beginGradientFill()beginBitmapFill() 方法,來設定線段樣式、填色或兩者。

參數

x:Number — 指出相對於上層顯示物件 (以像素為單位) 之註冊點的水平位置數字。
 
y:Number — 指出相對於上層顯示物件 (以像素為單位) 之註冊點的垂直位置數字。
 
width:Number — 圓角矩形的寬度,以像素為單位。
 
height:Number — 圓角矩形的高度,以像素為單位。
 
ellipseWidth:Number — 用來繪製圓角 (以像素為單位) 的橢圓寬度。
 
ellipseHeight:Number — 用來繪製圓角 (以像素為單位) 的橢圓高度。 選擇性用法;如果未指定數值,則預設值會符合所提供的 ellipseWidth 參數值:


擲回值
ArgumentError — 如果 widthheightellipseWidthellipseHeight 參數不是數字 (Number.NaN)。

請參閱


範例
如何使用範例
如需有關如何使用這個方法的說明,請參閱這個類別結束處的範例
endFill()方法 
public function endFill():void

語言版本 : ActionScript 3.0
Player 版本 : Flash Player 9

將填色套用到最後一次呼叫 beginFill()beginGradientFill()beginBitmapFill() 方法之後所加入的線段和曲線上。 Flash 會使用前一次呼叫 beginFill()beginGradientFill()beginBitmapFill() 方法 時所指定的填色。 如果目前的繪圖位置不等於 moveTo() 方法中所指定的上一個位置,而且已定義填色,就會用線條封閉該路徑,然後填滿顏色。

請參閱

lineGradientStyle()方法 
public function lineGradientStyle(type:String, colors:Array, alphas:Array, ratios:Array, matrix:Matrix = null, spreadMethod:String = "pad", interpolationMethod:String = "rgb", focalPointRatio:Number = 0):void

語言版本 : ActionScript 3.0
Player 版本 : Flash Player 9

指定線段樣式的漸層,方便 Flash Player 對物件的其它 Graphics 方法 (例如 lineTo()drawCircle()) 進行後續的呼叫。 線段樣式會一直維持有效,直到您使用不同參數呼叫 lineStyle() 方法或 lineGradientStyle() 方法為止。 您可以在路徑繪製到一半時呼叫 lineGradientStyle() 方法,為路徑中不同的線段指定不同的樣式。

在呼叫 lineGradientStyle() 以啟用筆畫之前,請先呼叫 lineStyle(),否則,線段樣式的值仍會保持 undefined

呼叫 clear() 會將線段樣式設回 undefined

參數

type:String — 來自 GradientType 類別的數值可用來指定要用哪個漸層模式,不是 GradientType.LINEAR 就是 GradientType.RADIAL。
 
colors:Array — 用在漸層中的 RGB 十六進位顏色值陣列 (例如,紅色是 0xFF0000,藍色是 0x0000FF 等等)。
 
alphas:Array — Alpha 值的陣列,會對應到 colors 陣列中的顏色,有效值從 0 到 100。 如果值小於 0,Flash Player 便會使用 0。 如果值大於 100,Flash Player 便會使用 100。
 
ratios:Array — 顏色分佈比例的陣列。有效值從 0 到 255。 此值會定義寬度 (其中顏色是以 100% 的比例進行取樣) 的百分比。 數值 0 代表位於漸層方塊的左手位置,而數值 255 代表漸層方塊的右手位置。 此值代表漸層方塊中的位置,而不是最後漸層的座標空間,因為後者會比漸層方塊寬一點或小一點。 請針對 colors 參數中的每一個值指定其對應的值。

例如,如果是含有兩種顏色 (藍色和綠色) 的線性漸層,下圖會示範依據 ratios 陣列中不同的值,這兩種顏色在漸層中的置放方式:

ratios漸層
[0, 127]
[0, 255]
[127, 255]

\'b0\'7d列中的值必須依序增加;例如 [0, 63, 127, 190, 255]

 
matrix:Matrix (default = null) — flash.geom.Matrix 類別所定義的變形矩陣。 flash.geom.Matrix 類別包含 createGradientBox() 方法,可以讓您輕易地設定矩陣,以便與 lineGradientStyle() 方法搭配使用。
 
spreadMethod:String (default = "pad") — 來自 SpreadMethod 類別的數值可用來指定要用哪個散佈方法:

SpreadMethod.PADSpreadMethod.REFLECTSpreadMethod.REPEAT

 
interpolationMethod:String (default = "rgb") — 來自 InterpolationMethod 類別的數值,可指定要用哪個數值。 例如,假設有一個簡單的兩色線性漸層 (spreadMethod 參數設為 SpreadMethod.REFLECT)。 不同的內插補點方法將會產生不同的外觀,如下所示:

InterpolationMethod.LINEAR_RGBInterpolationMethod.RGB

 
focalPointRatio:Number (default = 0) — 這是一個數字,用來控制漸層的焦點位置。 0 這個值表示焦點位於正中央。 1 這個值表示焦點位於漸層圓圈的其中一個邊界。 -1 這個值表示焦點位於漸層圓圈的另一個邊界。 小於 -1 或大於 1 的值會化為整數 -1 或 1。 下列影像顯示 focalPointRatio 為 -0.75 的漸層:

請參閱


範例

下列範例會繪製矩形和圓形,使用從紅色到綠色再到藍色的漸層填色。

使用 Matrix 類別的 createGradientBox() 方法,定義寬度 200、高度 40 的漸層方塊。 線條的粗細設定為 5 個像素。 您必須為 lineGradientStyle() 方法設定筆畫的粗細。 漸層設定為線性。 漸層的色彩設定為紅色、綠色和藍色。 色彩的透明度 (Alpha 值) 設定為 1 (不透明)。 漸層採均勻分佈,色彩於 0 (漸層方塊左邊)、128 (方塊中央) 和 255 (方塊右邊) 三個位置 100% 取樣。 矩形的寬度包含漸層的所有頻譜,圓形則包含頻譜中央的 50%。

package {
    import flash.display.Sprite;
    import flash.display.Shape;
    import flash.geom.Matrix; 
    import flash.display.GradientType;
    
    public class Graphics_lineGradientStyleExample extends Sprite
    {
        public function Graphics_lineGradientStyleExample()
        {
            var myShape:Shape = new Shape();
            var gradientBoxMatrix:Matrix = new Matrix();
  
            gradientBoxMatrix.createGradientBox(200, 40, 0, 0, 0);  
            
            myShape.graphics.lineStyle(5);
  
            myShape.graphics.lineGradientStyle(GradientType.LINEAR, [0xFF0000,
            0x00FF00, 0x0000FF], [1, 1, 1], [0, 128, 255], gradientBoxMatrix);
            
            myShape.graphics.drawRect(0, 0, 200, 40);
            myShape.graphics.drawCircle(100, 120, 50);  
             
            this.addChild(myShape);
    
        }
    }
}
lineStyle()方法 
public function lineStyle(thickness:Number, color:uint = 0, alpha:Number = 1.0, pixelHinting:Boolean = false, scaleMode:String = "normal", caps:String = null, joints:String = null, miterLimit:Number = 3):void

語言版本 : ActionScript 3.0
Player 版本 : Flash Player 9

指定線段樣式,方便 Flash 對物件的其它 Graphics 方法 (例如 lineTo()drawCircle()) 進行後續的呼叫。 線段樣式會一直維持有效,直到您使用不同參數呼叫 lineGradientStyle() 方法或 lineStyle() 方法為止。 您可以在路徑繪製到一半時呼叫 lineStyle(),為路徑中不同的線段指定不同的樣式。

注意:呼叫 clear() 方法會將線段樣式的值設回 undefined

參數

thickness:Number — 以點數為單位的整數,指出線條的粗細,有效值從 0 到 255。 如果沒有指定數字,或是未定義參數,則不會繪製線條。 如果傳遞的值小於 0,則預設為 0。 0 這個值表示為極細線,而最大值為 255。 如果傳遞的值大於 255,則預設為 255。
 
color:uint (default = 0) — 線段的十六進位顏色值 (例如,紅色是 0xFF0000、藍色是 0x0000FF,以此類推)。 如果沒有指出數值,則會預設為 0x000000 (黑色)。 這是選擇性的。
 
alpha:Number (default = 1.0) — 表示線條顏色之 Alpha 值的數字,有效值從 0 到 1。 如果沒有指定數值,則會預設為 1 (純色)。 如果值小於 0,則預設為 0。 如果值大於 1,則預設為 1。
 
pixelHinting:Boolean (default = false) — Boolean 值,指定是否要提示筆畫使用完整的像素。 這個值會影響曲線錨點的位置以及它本身的線段筆畫大小。 當您將 pixelHinting 設為 true,Flash Player 會提示線條寬度使用完整像素寬度。 當您將 pixelHinting 設為 false,曲線與直線當中會出現斷裂現象。 例如,下列圖例說明 Flash Player 如何呈現兩個完全相同的圓角矩形 (除了 lineStyle() 方法中使用的 pixelHinting 參數不同之外,影像也將以 200% 的比例縮放來強調差異):

如果沒有提供值,線段就不會使用像素提示功能。

 
scaleMode:String (default = "normal") — 來自 LineScaleMode 類別的數值可用來指定要使用哪個縮放模式:
  • LineScaleMode.NORMAL -- 當縮放物件時 (預設值),永遠可以調整線段粗細。
  • LineScaleMode.NONE -- 一律不調整線段粗細。
  • LineScaleMode.VERTICAL -- 如果物件垂直縮放,就不縮放線段粗細。 以下面的圓形為例,這些圓形的線段都是以 1 像素來繪製,每一條線段的 scaleMode 參數都設為 LineScaleMode.VERTICAL。 左邊的圓形只會垂直縮放,而右邊的圓形則可以同時水平與垂直縮放。

  • LineScaleMode.HORIZONTAL -- 如果物件水平縮放,就不縮放線段粗細。 以下面的圓形為例,這些圓形的線段都是以 1 像素來繪製,每一條線段的 scaleMode 參數都設為 LineScaleMode.HORIZONTAL。 左邊的圓形只會水平縮放,而右邊的圓形則可以同時水平與垂直縮放:

 
caps:String (default = null) — 來自 CapsStyle 類別的數值,可指定線段終點的端點類型。 有效值為:CapsStyle.NONECapsStyle.ROUND,以及 CapsStyle.SQUARE。 如果沒有指定值,Flash 會使用圓形端點。

例如,下列圖例會示範不同的 capsStyle 設定。 針對每一個設定,圖例都會示範一條粗細為 30 的藍色線條 (對它套用 capsStyle),以及一條粗細為 1 並且疊在上面的黑色線條 (沒有套用 capsStyle):

 
joints:String (default = null) — 來自 JointStyle 類別的數值,可指定用在角度上的接合外觀類型。 有效值為:JointStyle.BEVELJointStyle.MITER,以及JointStyle.ROUND。 如果沒有指定值,Flash 會使用圓角連接。

例如,下列圖例會示範不同的 joints 設定。 針對每一個設定,圖例都會示範一條粗細為 30 的折角藍色線條 (對它套用 jointStyle),以及一條粗細為 1 並且疊在上面的折角黑色線條 (沒有套用 jointStyle):

注意: 若要將 joints 設為 JointStyle.MITER,您可以使用 miterLimit 參數來限制尖角長度。

 
miterLimit:Number (default = 3) — 用來指出尖角遭到切斷的上限數字。 有效值介於 1 到 255 之間 (超出此範圍的值會捨入至 1 或 255)。 只有當 jointStyle 是設為 "miter" 時才會使用這個值。 miterLimit 值代表尖角可以超出線段交會點的長度。 這個值可表示線條 thickness 的某個倍數。 例如,如果 miterLimit 倍數是 2.5,而 thickness 是 10 像素,則會在 25 像素的地方切割尖角。

再者,請看下列折角線條,每一條都是以 thickness 為 20 所繪製,但 miterLimit 則分別設為 1、2 和 4。 疊在上方的黑色參考線會顯示轉角處的交會點:

請注意,如果指定了 miterLimit 值,則切割尖角時會有一個特定的最大角度。 下表列出一些範例:

miterLimit 值:若小於這個角度,就會加以切斷
1.41490 度
260 度
430 度
815 度

請參閱


範例
如何使用範例
如需有關如何使用 getStyle() 方法的說明,請參閱 lineTo()moveTo() 方法的範例。
lineTo()方法 
public function lineTo(x:Number, y:Number):void

語言版本 : ActionScript 3.0
Player 版本 : Flash Player 9

使用目前的線段樣式,從目前的繪圖位置到 (x, y) 繪製一條線段;然後目前的繪圖位置就會設定為 (x, y)。 如果您正在繪圖的顯示物件中包含用 Flash 繪圖工具所建立的內容,呼叫 lineTo() 方法會在這個內容的下面進行繪製。 如果您先呼叫 lineTo(),再呼叫任何 moveTo() 方法,目前繪圖的預設位置將為 (0, 0)。 如果遺失任何參數,這個方法就會失敗,而且不會更改目前的繪圖位置。

參數

x:Number — 指出相對於上層顯示物件 (以像素為單位) 之註冊點的水平位置數字。
 
y:Number — 指出相對於上層顯示物件 (以像素為單位) 之註冊點的垂直位置數字。


範例

下列範例使用 lineTo() 方法,從像素 (100, 100) 開始繪製一個梯形。

線條粗細設定為 10 個像素,色彩是不透明的金色,線條末端的端點設定為無 (因為所有線條接在一起),線條之間的接合方式設定為 MITER 且尖角限制設定為 10,使角落形成尖角。

package {
    import flash.display.Sprite;
    import flash.display.LineScaleMode;
    import flash.display.CapsStyle;
    import flash.display.JointStyle;
    import flash.display.Shape;


    public class Graphics_lineToExample extends Sprite {

        public function Graphics_lineToExample() {

            var trapezoid:Shape = new Shape();    

            trapezoid.graphics.lineStyle(10, 0xFFD700, 1, false, LineScaleMode.VERTICAL,
                               CapsStyle.NONE, JointStyle.MITER, 10);

            trapezoid.graphics.moveTo(100, 100);
 
            trapezoid.graphics.lineTo(120, 50);
            trapezoid.graphics.lineTo(200, 50);
            trapezoid.graphics.lineTo(220, 100);
            trapezoid.graphics.lineTo(100, 100); 

            this.addChild(trapezoid);
        }
    }
}
moveTo()方法 
public function moveTo(x:Number, y:Number):void

語言版本 : ActionScript 3.0
Player 版本 : Flash Player 9

將目前的繪圖位置移到 (x, y)。 如果遺失任何參數,這個方法就會失敗,而且不會更改目前的繪圖位置。

參數

x:Number — 指出相對於上層顯示物件 (以像素為單位) 之註冊點的水平位置數字。
 
y:Number — 指出相對於上層顯示物件 (以像素為單位) 之註冊點的垂直位置數字。


範例

下列範例使用 moveTo()lineTo() 方法,繪製一條粗細為 3 個像素的虛線。

使用 lineStyle() 方法將線條粗細設定為 3 個像素。 它也設定為不可縮放。 色彩設定為紅色,25% 不透明。 CapsStyle 屬性設定為方形 (預設為圓形)。

由於 Graphics_moveToExampleSprite 類別的實體,因此可以存取所有 Graphics 類別的方法。 Graphics 類別方法可直接用在 Graphic_moveToExample Sprite 物件上繪圖。 但是如果未在 Shape 中放置向量繪圖物件,則會限制它們的管理、移動或變更方式。

package {
    import flash.display.Sprite;
    import flash.display.CapsStyle;
    import flash.display.LineScaleMode;

    public class Graphics_moveToExample extends Sprite
    {
        public function Graphics_moveToExample() {
            
            graphics.lineStyle(3, 0x990000, 0.25, false, 
                            LineScaleMode.NONE, CapsStyle.SQUARE);

            graphics.moveTo(10, 20);
            graphics.lineTo(20, 20);
            graphics.moveTo(30, 20);
            graphics.lineTo(50, 20);
            graphics.moveTo(60, 20);
            graphics.lineTo(80, 20);
            graphics.moveTo(90, 20);
            graphics.lineTo(110, 20);            
            graphics.moveTo(120, 20);
            graphics.lineTo(130, 20);           
        }
    }
}
範例 如何使用範例
GraphicsExample.as

下列範例會使用 GraphicsExample 類別繪製圓形、圓角矩形與正方形。 您可以執行下列步驟來完成這項工作:
  1. 宣告 size 屬性,以便稍後用來決定每個形狀的大小。
  2. 宣告屬性,將背景顏色設定為橘色、邊框顏色設定為深灰色、邊寬粗細設定為 0 個像素、圓角半徑設定為 9 個像素,以及將舞台邊緣和其它物件之間的距離設定為 5 個像素。
  3. 使用上述步驟中宣告的屬性以及 Graphics 類別的內建方法,在座標 x = 0, y = 0 處繪製圓形、圓角矩形以及正方形。
  4. 沿著舞台上方重新繪製每個形狀,從 x = 5, y = 5 開始繪製,並且每個形狀之間的距離都是 5 個像素。

package {
    import flash.display.DisplayObject;
    import flash.display.Graphics;
    import flash.display.Shape;
    import flash.display.Sprite;

    public class GraphicsExample extends Sprite {
        private var size:uint         = 80;
        private var bgColor:uint      = 0xFFCC00;
        private var borderColor:uint  = 0x666666;
        private var borderSize:uint   = 0;
        private var cornerRadius:uint = 9;
        private var gutter:uint       = 5;

        public function GraphicsExample() {
            doDrawCircle();
            doDrawRoundRect();
            doDrawRect();
            refreshLayout();
        }

        private function refreshLayout():void {
            var ln:uint = numChildren;
            var child:DisplayObject;
            var lastChild:DisplayObject = getChildAt(0);
            lastChild.x = gutter;
            lastChild.y = gutter;
            for (var i:uint = 1; i < ln; i++) {
                child = getChildAt(i);
                child.x = gutter + lastChild.x + lastChild.width;
                child.y = gutter;
                lastChild = child;
            }
        }

        private function doDrawCircle():void {
            var child:Shape = new Shape();
            var halfSize:uint = Math.round(size / 2);
            child.graphics.beginFill(bgColor);
            child.graphics.lineStyle(borderSize, borderColor);
            child.graphics.drawCircle(halfSize, halfSize, halfSize);
            child.graphics.endFill();
            addChild(child);
        }

        private function doDrawRoundRect():void {
            var child:Shape = new Shape();
            child.graphics.beginFill(bgColor);
            child.graphics.lineStyle(borderSize, borderColor);
            child.graphics.drawRoundRect(0, 0, size, size, cornerRadius);
            child.graphics.endFill();
            addChild(child);
        }

        private function doDrawRect():void {
            var child:Shape = new Shape();
            child.graphics.beginFill(bgColor);
            child.graphics.lineStyle(borderSize, borderColor);
            child.graphics.drawRect(0, 0, size, size);
            child.graphics.endFill();
            addChild(child);
        }
    }
}




 

有新的意見加入至這個頁面時,傳送電子郵件給我 | 意見報告

目前頁面: http://livedocs.adobe.com/flash/9.0_tw/ActionScriptLangRefV3/flash/display/Graphics.html