패키지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 사용의 기초


Public 속성
 속성다음에 의해 정의됨
 Inheritedconstructor : Object
지정된 객체 인스턴스의 클래스 객체 또는 생성자 함수에 대한 참조입니다.
Object
 Inheritedprototype : Object
[static] 클래스 또는 함수 객체의 프로토타입 객체에 대한 참조입니다.
Object
Public 메서드
 메서드다음에 의해 정의됨
  
beginBitmapFill(bitmap:BitmapData, matrix:Matrix = null, repeat:Boolean = true, smooth:Boolean = false):void
비트맵 이미지로 드로잉 영역을 채웁니다.
Graphics
  
beginFill(color:uint, alpha:Number = 1.0):void
해당 객체의 다른 Graphics 메서드(예: lineTo() 또는 drawCircle())에 대한 후속 호출이 있을 때 Flash Player가 사용할 단순한 단색 채우기를 지정합니다.
Graphics
  
beginGradientFill(type:String, colors:Array, alphas:Array, ratios:Array, matrix:Matrix = null, spreadMethod:String = "pad", interpolationMethod:String = "rgb", focalPointRatio:Number = 0):void
해당 객체의 다른 Graphics 메서드(예: lineTo() 또는 drawCircle())에 대한 후속 호출이 있을 때 Flash Player에서 사용할 그래디언트 채우기를 지정합니다.
Graphics
  
이 Graphics 객체에 그린 그래픽을 지우고 채우기 및 선 스타일을 다시 설정합니다.
Graphics
  
curveTo(controlX:Number, controlY:Number, anchorX:Number, anchorY:Number):void
현재의 선 스타일을 사용하여 현재의 드로잉 위치에서 (anchorX, anchorY) 위치까지 곡선을 그립니다. 제어점으로는 (controlX, controlY) 위치를 사용합니다.
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
해당 객체의 다른 Graphics 메서드(예: lineTo() 또는 drawCircle())에 대한 후속 호출이 있을 때 Flash Player에서 사용할 선 스타일의 그래디언트를 지정합니다.
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
해당 객체의 다른 Graphics 메서드(예: lineTo() 또는 drawCircle())에 대한 후속 호출이 있을 때 Flash에서 사용할 선 스타일을 지정합니다.
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이면 비트맵 이미지가 반복되지 않고 해당 비트맵을 넘는 채우기 영역에 비트맵의 가장자리가 사용됩니다.

예를 들어, 다음과 같은 20 x 20픽셀의 바둑판 모양 비트맵을 생각해 볼 수 있습니다.

다음 예제와 같이 repeattrue로 설정된 경우에는 비트맵 채우기가 비트맵을 반복합니다.

repeatfalse로 설정된 경우에는 비트맵 채우기가 비트맵 바깥쪽의 채우기 영역에 대해 가장자리 픽셀을 사용합니다.

 
smooth:Boolean (default = false)false이면 확대된 비트맵 이미지가 최단입점 알고리즘을 사용하여 렌더링되며 픽셀화되어 나타납니다. true이면 확대된 비트맵 이미지가 쌍선형 알고리즘을 사용하여 렌더링됩니다. 일반적으로 최단입점 알고리즘을 사용한 렌더링이 더 빠릅니다.

참고 사항


예제

다음 예제에서는 사각형을 회전시키면서 채우기를 반복하는 이미지(image1.jpg)를 사용합니다.
  1. 이미지 파일(image1.jpg)은 LoaderURLRequest 객체를 사용하여 로드됩니다. 여기에서는 이미지 파일이 SWF 파일과 동일한 디렉토리에 있습니다. SWF 파일은 [로컬 재생 보안]이 [로컬 파일에만 액세스]로 설정된 상태에서 컴파일해야 합니다.
  2. 이미지가 로드되면(Event가 완료됨) drawImage() 메서드가 호출됩니다. ioErrorHandler() 메서드는 이미지가 제대로 로드되지 않은 경우 추적 주석을 기록합니다.
  3. drawImage() 메서드에서 BitmapData 객체가 인스턴스화되고 폭과 높이가 이미지(image1.jpg)로 설정됩니다. 그런 다음 BitmapData 객체에 소스 이미지가 그려집니다. 이어서 mySprite Sprite 객체에서 사각형이 그려지고 BitmapData 객체를 사용해서 사각형을 채웁니다. Matrix 객체를 사용해서 beginBitmapFill() 메서드가 이미지를 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

해당 객체의 다른 Graphics 메서드(예: lineTo() 또는 drawCircle())에 대한 후속 호출이 있을 때 Flash Player가 사용할 단순한 단색 채우기를 지정합니다. 채우기의 효과는 beginFill(), beginBitmapFill() 또는 beginGradientFill() 메서드를 호출할 때까지 유지됩니다. clear() 메서드를 호출하면 채우기가 지워집니다.

Flash Player는 endFill() 메서드가 호출될 때까지 채우기를 렌더링하지 않습니다.

매개 변수

color:uint — 채우기 색상(0xRRGGBB)입니다.
 
alpha:Number (default = 1.0) — 채우기의 알파 값(0.0 ~ 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

해당 객체의 다른 Graphics 메서드(예: lineTo() 또는 drawCircle())에 대한 후속 호출이 있을 때 Flash Player에서 사용할 그래디언트 채우기를 지정합니다. 채우기의 효과는 beginFill(), beginBitmapFill() 또는 beginGradientFill() 메서드를 호출할 때까지 유지됩니다. clear() 메서드를 호출하면 채우기가 지워집니다.

Flash Player는 endFill() 메서드가 호출될 때까지 채우기를 렌더링하지 않습니다.

매개 변수

type:String — 사용할 그래디언트 유형, 즉 GradientType.LINEAR 또는 GradientType.RADIAL을 지정하는 GradientType 클래스 값입니다.
 
colors:Array — 그래디언트에서 사용할 RGB 16진수 색상 값의 배열입니다(예: 빨강은 0xFF0000, 파랑은 0x0000FF 등). 최대 15가지 색상을 지정할 수 있습니다. 색상별로 알파 및 비율 매개 변수 값을 지정해야 합니다.
 
alphas:Array — 색상 배열에 속한 색상의 알파 값 배열이며 유효한 값은 0부터 1까지입니다. 값이 0보다 작으면 기본값은 0입니다. 값이 1보다 큰 경우 기본값은 1입니다.
 
ratios:Array — 색상 배분 비율의 배열로, 유효 값은 0부터 255까지입니다. 이 값은 색상이 100%로 샘플링되는 곳의 폭에 대한 백분율을 정의합니다. 값 0은 그래디언트 상자의 왼쪽을, 255는 그래디언트 상자의 오른쪽을 나타냅니다.

참고: 이 값은 최종 그래디언트의 좌표 공간이 아니라 그래디언트 상자에서의 위치를 나타내며, 그래디언트 상자보다 넓거나 좁을 수 있습니다. colors 매개 변수의 각 값을 지정합니다.

예를 들어, 파랑 및 녹색의 두 가지 색상이 포함된 선형 그래디언트의 경우, 다음 예제에서는 ratios 배열의 다른 값을 기준으로 그래디언트에 색상을 배치하는 것을 보여 줍니다.

ratiosGradient
[0, 127]
[0, 255]
[127, 255]

배열의 값은 [0, 63, 127, 190, 255]와 같이 순차적으로 증가해야 합니다.

 
matrix:Matrix (default = null) — flash.geom.Matrix 클래스에 의해 정의된 변형 행렬입니다. flash.geom.Matrix 클래스에 포함된 createGradientBox() 메서드를 사용하면 beginGradientFill() 메서드와 함께 사용할 행렬을 편리하게 설정할 수 있습니다.
 
spreadMethod:String (default = "pad") — 사용할 스프레드 메서드, 즉 SpreadMethod.PAD, SpreadMethod.REFLECT 또는 SpreadMethod.REPEAT를 지정하는 SpreadMethod 클래스 값입니다.

예를 들어, 다음과 같이 두 색상 간의 간단한 선형 그래디언트를 생각해 볼 수 있습니다.

  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.linearRGB 또는 InterpolationMethod.RGB를 지정하는 InterpolationMethod 클래스 값입니다.

예를 들어, 두 색상 간의 간단한 선형 그래디언트를 생각해 볼 수 있습니다(spreadMethod 매개 변수를 SpreadMethod.REFLECT로 설정). 여러 가지 보간 방법은 다음과 같이 외양에 영향을 미칩니다.

InterpolationMethod.LINEAR_RGBInterpolationMethod.RGB
 
focalPointRatio:Number (default = 0) — 그래디언트의 초점 위치를 제어하는 숫자입니다. 0은 초점 위치가 가운데에 있음을 의미합니다. 1은 초점 위치가 그래디언트 원의 한 테두리에 있음을 의미합니다. -1은 초점 위치가 그래디언트 원의 다른 테두리에 있음을 의미합니다. -1보다 작거나 1보다 큰 값은 -1 또는 1로 반올림됩니다. 다음 이미지는 0.75로 설정된 focalPointRatio의 예를 보여 줍니다.


오류
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

현재의 선 스타일을 사용하여 현재의 드로잉 위치에서 (anchorX, anchorY) 위치까지 곡선을 그립니다. 제어점으로는 (controlX, controlY) 위치를 사용합니다. 그러면 현재 드로잉 위치가 (anchorX, anchorY)로 설정됩니다. 그리고 있는 무비 클립에 Flash 드로잉 도구로 만든 내용이 포함된 경우, 이 내용 아래에 curveTo() 메서드에 대한 호출이 그려집니다. moveTo() 메서드를 호출하기 전에 curveTo() 메서드를 호출할 경우, 현재 드로잉 위치의 기본값이 (0, 0)입니다. 매개 변수가 하나라도 없으면 이 메서드는 실패하고 현재 드로잉 위치는 변경되지 않습니다.

그려진 곡선은 2차원 베지어 곡선입니다. 2차원 베지어 곡선은 앵커 포인트 두 개와 제어점 한 개로 구성됩니다. 이 곡선은 앵커 포인트를 두 개 삽입하고 제어점 방향으로 구부러집니다.

매개 변수

controlX:Number — 부모 표시 객체의 등록 포인트를 기준으로 제어점의 가로 위치를 지정하는 숫자입니다.
 
controlY:Number — 부모 표시 객체의 등록 포인트를 기준으로 제어점의 세로 위치를 지정하는 숫자입니다.
 
anchorX:Number — 부모 표시 객체의 등록 포인트를 기준으로 다음 앵커 포인트의 가로 위치를 지정하는 숫자입니다.
 
anchorY:Number — 부모 표시 객체의 등록 포인트를 기준으로 다음 앵커 포인트의 세로 위치를 지정하는 숫자입니다.


예제

다음 예제는 Sprite 표시 객체의 등록 포인트 (0, 0)에서 오른쪽으로 폭과 높이가 각각 100픽셀과 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픽셀인 2개의 곡선이 그려지고 사이의 공간이 흰색으로 채워집니다. 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 매개 변수에 따라 서로 다른 크기의 계란(3가지 크기의 타원) 3개를 그립니다.
  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 width 또는 height 매개 변수가 숫자가 아닌 경우(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 width, height, ellipseWidth 또는 ellipseHeight 매개 변수가 숫자가 아닌 경우(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

해당 객체의 다른 Graphics 메서드(예: lineTo() 또는 drawCircle())에 대한 후속 호출이 있을 때 Flash Player에서 사용할 선 스타일의 그래디언트를 지정합니다. lineStyle() 메서드 또는 lineGradientStyle() 메서드를 다른 매개 변수를 사용하여 호출할 때까지 선 스타일은 유효합니다. 경로를 그리는 동안 lineGradientStyle() 메서드를 호출하면 특정 경로 내의 다른 선분에 다른 스타일을 지정할 수 있습니다.

획을 사용하려면 lineGradientStyle()을 호출하기 전에 lineStyle()을 호출해야 합니다. 그렇지 않으면 선 스타일 값이 undefined로 남게 됩니다.

clear()를 호출하면 선 스타일이 다시 undefined로 설정됩니다.

매개 변수

type:String — 사용할 그래디언트 유형, 즉 GradientType.LINEAR 또는 GradientType.RADIAL을 지정하는 GradientType 클래스 값입니다.
 
colors:Array — 그래디언트에서 사용할 RGB 16진수 색상 값의 배열입니다(예: 빨강은 0xFF0000, 파랑은 0x0000FF 등).
 
alphas:Arraycolors 배열에 있는 해당 색상의 알파 값 배열이며, 유효 값은 0부터 100까지입니다. Flash Player는 이 값이 0보다 작으면 0을 사용하고 100보다 크면 100을 사용합니다.
 
ratios:Array — 색상 배분 비율의 배열로, 유효한 값은 0부터 255까지입니다. 이 값은 색상이 100%로 샘플링되는 곳의 폭에 대한 백분율을 정의합니다. 값 0은 그래디언트 상자의 왼쪽을, 255는 그래디언트 상자의 오른쪽을 나타냅니다. 이 값은 그래디언트 상자보다 더 넓거나 좁을 수 있는 최종 그래디언트의 좌표 공간이 아니라 그래디언트 상자에서의 위치를 나타냅니다. colors 매개 변수의 각 값을 지정합니다.

예를 들어, 파랑과 녹색의 두 색상을 포함하는 선형 그래디언트의 경우 다음 그림에서는 ratios 배열의 서로 다른 값을 기준으로 그래디언트의 색상 배치를 보여 줍니다.

ratiosGradient
[0, 127]
[0, 255]
[127, 255]

배열의 값은 [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() 메서드에 대한 획의 두께를 반드시 정의해야 합니다. 그래디언트는 선형으로 설정됩니다. 그래디언트의 색상은 빨강, 녹색, 파랑으로 설정됩니다. 색상의 투명도(알파 값)은 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

해당 객체의 다른 Graphics 메서드(예: lineTo() 또는 drawCircle())에 대한 후속 호출이 있을 때 Flash에서 사용할 선 스타일을 지정합니다. lineGradientStyle() 메서드 또는 lineStyle() 메서드를 다른 매개 변수를 사용하여 호출할 때까지 선 스타일은 유효합니다. 경로를 그리는 동안 lineStyle() 메서드를 호출하면 특정 경로 내의 다른 선분에 다른 스타일을 지정할 수 있습니다.

참고: clear() 메서드를 호출하면 선 스타일이 다시 undefined로 설정됩니다.

매개 변수

thickness:Number — 선의 두께를 포인트 단위로 나타내는 정수이며 유효한 값은 0부터 255까지입니다. 숫자를 지정하지 않았거나 매개 변수가 정의되지 않은 경우 선이 그려지지 않습니다. 0보다 작은 값이 전달될 경우 기본값은 0입니다. 값 0은 매우 가는 두께를 나타내며 최대 두께는 255입니다. 255보다 큰 값이 전달될 경우 기본값은 255입니다.
 
color:uint (default = 0) — 선의 16진수 색상 값입니다. 예를 들어, 빨강은 0xFF0000, 파랑은 0x0000FF 등입니다. 값이 지정되지 않은 경우 기본값은 0x000000(검정)입니다. 선택 사항입니다.
 
alpha:Number (default = 1.0) — 선 색상의 알파 값을 나타내는 숫자로, 유효한 값은 0부터 1까지입니다. 값이 지정되지 않은 경우 기본값은 1(단색)입니다. 값이 0보다 작으면 기본값은 0입니다. 값이 1보다 큰 경우 기본값은 1입니다.
 
pixelHinting:Boolean (default = false) — 전체 픽셀로 획을 힌팅할 것인지 여부를 지정하는 부울 값입니다. 이 값은 곡선의 앵커 위치와 선 획 크기에 모두 영향을 줍니다. pixelHintingtrue로 설정되면 Flash Player는 선의 폭을 전체 픽셀 폭으로 힌팅합니다. pixelHintingfalse로 설정되면 곡선 및 직선에 분리가 발생할 수 있습니다. 예를 들어, 다음 그림에서는 lineStyle() 메서드에 사용된 pixelHinting 매개 변수가 다르게 설정된 것을 제외하고는 동일한 두 개의 둥근 사각형을 Flash Player가 렌더링하는 방법을 보여 줍니다(이미지는 차이점을 강조하기 위해 200%로 확대되었음).

값이 제공되지 않으면 선에서는 픽셀 힌팅을 사용하지 않습니다.

 
scaleMode:String (default = "normal") — 사용할 크기 조절 모드를 지정하는 LineScaleMode 클래스 값입니다.
  • LineScaleMode.NORMAL - 객체의 크기가 조절될 때 항상 선 두께를 조절합니다(기본값).
  • LineScaleMode.NONE - 선 두께를 조절하지 않습니다.
  • LineScaleMode.VERTICAL - 객체의 크기가 세로로만 조절되는 경우 선 두께를 조절하지 않습니다. 예를 들어, scaleMode 매개 변수를 LineScaleMode.VERTICAL로 설정하고 1픽셀 선으로 그린 다음과 같은 원을 생각해 볼 수 있습니다. 왼쪽 원의 크기는 세로로만 조절되며, 오른쪽 원의 크기는 세로 및 가로 방향 모두 조절됩니다.

  • LineScaleMode.HORIZONTAL - 객체의 크기가 가로로만 조절되는 경우 선 두께를 조절하지 않습니다. 예를 들어, scaleMode 매개 변수를 LineScaleMode.HORIZONTAL로 설정하고 1픽셀 선으로 그린 다음과 같은 원을 생각해 볼 수 있습니다. 왼쪽 원의 크기는 가로로만 조절되며, 오른쪽 원의 크기는 세로 및 가로 방향 모두 조절됩니다.

 
caps:String (default = null) — 선 끝의 유형을 지정하는 CapsStyle 클래스 값입니다. 유효 값은 CapsStyle.NONE, CapsStyle.ROUNDCapsStyle.SQUARE입니다. 값이 지정되지 않으면 Flash에서는 둥근 끝을 사용합니다.

예를 들어, 다음 그림에서는 다양한 capsStyle 설정을 보여 줍니다. 이 그림에서는 각 설정에 대해 두께가 30인 파란색 선(capsStyle이 적용됨)과 이 선과 겹쳐져 있는 두께가 1인 검은색 선(capsStyle이 적용되지 않음)을 보여 줍니다.

 
joints:String (default = null) — 각도에 사용된 연결 모양의 유형을 지정하는 JointStyle 클래스 값입니다. 유효 값은 JointStyle.BEVEL, JointStyle.MITERJointStyle.ROUND입니다. 값이 지정되지 않으면 Flash에서는 둥근 연결을 사용합니다.

예를 들어, 다음 그림에서는 다양한 joints 설정을 보여 줍니다. 이 그림에서는 각 설정에 대해 두께가 30인 각진 파란색 선(jointStyle이 적용됨)과 이 선과 겹쳐져 있는 두께가 1인 각진 검은색 선(jointStyle이 적용되지 않음)을 보여 줍니다.

참고: jointsJointStyle.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() 메서드를 호출하면 그 내용 아래에 그려집니다. moveTo() 메서드를 호출하기 전에 lineTo()를 호출하면 현재 드로잉의 기본 위치는 (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 속성은 square로 설정됩니다(기본값은 round).

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_kr/ActionScriptLangRefV3/flash/display/Graphics.html