다음을 통해 공유


방법: 선형 그라데이션 만들기

GDI+는 가로, 세로, 대각선 선형 그라데이션을 제공합니다. 기본적으로 선형 그라데이션의 색은 균일하게 변경됩니다. 그러나 선형 그라데이션을 사용자 지정하여 색이 균일하지 않은 방식으로 변경되도록 할 수 있습니다.

참고

이 문서의 예는 컨트롤의 Paint 이벤트 처리기에서 호출되는 메서드입니다.

다음은 가로 선형 그라데이션 브러시로 선, 타원, 사각형을 채우는 예제입니다.

LinearGradientBrush 생성자는 4개의 인수(점 2개와 색 2개)를 받습니다. 첫 번째 점(0, 10)은 첫 번째 색(빨강)과 연결되고 두 번째 점(200, 10)은 두 번째 색(파란색)과 연결됩니다. 예상대로 (0, 10)에서 (200, 10)로 그리는 선은 빨간색에서 파란색으로 점진적으로 변경됩니다.

점(0, 10) 및 (200, 10)의 10은 중요하지 않습니다. 중요한 것은 두 점의 두 번째 좌표가 같고, 두 점을 연결하는 선이 수평이라는 것입니다. 가로 좌표가 0에서 200으로 이동함에 따라 타원과 사각형도 빨간색에서 파란색으로 점진적으로 변합니다.

다음 그림에서는 줄, 타원, 사각형을 보여 줍니다. 가로 좌표가 200을 초과하여 증가하면 색 그라데이션이 반복됩니다.

색상 그라데이션로 채워진 선, 타원, 사각형.

가로 선형 그라데이션을 사용하려면 다음을 수행합니다.

  • 각각 불투명한 빨간색과 불투명 파란색을 세 번째 및 네 번째 인수로 전달합니다.

    public void UseHorizontalLinearGradients(PaintEventArgs e)
    {
        LinearGradientBrush linGrBrush = new LinearGradientBrush(
           new Point(0, 10),
           new Point(200, 10),
           Color.FromArgb(255, 255, 0, 0),   // Opaque red
           Color.FromArgb(255, 0, 0, 255));  // Opaque blue
    
        Pen pen = new Pen(linGrBrush);
    
        e.Graphics.DrawLine(pen, 0, 10, 200, 10);
        e.Graphics.FillEllipse(linGrBrush, 0, 30, 200, 100);
        e.Graphics.FillRectangle(linGrBrush, 0, 155, 500, 30);
    }
    
    Dim linGrBrush As New LinearGradientBrush( _
       New Point(0, 10), _
       New Point(200, 10), _
       Color.FromArgb(255, 255, 0, 0), _
       Color.FromArgb(255, 0, 0, 255))
    Dim pen As New Pen(linGrBrush)
    
    e.Graphics.DrawLine(pen, 0, 10, 200, 10)
    e.Graphics.FillEllipse(linGrBrush, 0, 30, 200, 100)
    e.Graphics.FillRectangle(linGrBrush, 0, 155, 500, 30)
    
    

앞의 예제에서 색상 구성 요소는 가로 좌표 0에서 가로 좌표 200으로 이동함에 따라 선형으로 변경됩니다. 예를 들어 첫 번째 좌표가 0과 200 사이의 중간인 점에는 0과 255 사이의 중간인 파란색 구성 요소가 있습니다.

GDI+를 사용하면 그라데이션의 가장자리마다 색이 달라지는 방식을 조정할 수 있습니다. 다음 표에 따라 검은색에서 빨간색으로 변경되는 그라데이션 브러시를 만들려는 경우를 가정해 보겠습니다.

가로 좌표 RGB 구성 요소
0 (0, 0, 0)
40 (128, 0, 0)
200 (255, 0, 0)

빨간색 구성 요소는 가로 좌표가 0에서 200까지의 20%에 불과할 때 절반 강도입니다.

다음 예제에서는 3개의 상대 강도와 3개의 상대 위치를 연결하도록 LinearGradientBrush.Blend 속성을 설정합니다. 앞의 표에서와 같이 상대 강도 0.5는 0.2의 상대 위치와 연결됩니다. 코드는 그라데이션 브러시로 타원과 사각형을 채웁니다.

다음 그림에서는 결과 타원 및 사각형을 보여 줍니다.

가로 색상 그라데이션으로 채워진 타원 및 사각형.

선형 그라데이션을 사용자 지정하려면 다음을 수행합니다.

  • 불투명한 검정색과 불투명한 빨간색을 각각 세 번째 및 네 번째 인수로 전달합니다.

    public void CustomizeLinearGradients(PaintEventArgs e)
    {
        LinearGradientBrush linGrBrush = new LinearGradientBrush(
           new Point(0, 10),
           new Point(200, 10),
           Color.FromArgb(255, 0, 0, 0),     // Opaque black
           Color.FromArgb(255, 255, 0, 0));  // Opaque red
    
        float[] relativeIntensities = { 0.0f, 0.5f, 1.0f };
        float[] relativePositions = { 0.0f, 0.2f, 1.0f };
    
        //Create a Blend object and assign it to linGrBrush.
        Blend blend = new Blend();
        blend.Factors = relativeIntensities;
        blend.Positions = relativePositions;
        linGrBrush.Blend = blend;
    
        e.Graphics.FillEllipse(linGrBrush, 0, 30, 200, 100);
        e.Graphics.FillRectangle(linGrBrush, 0, 155, 500, 30);
    }
    
    Dim linGrBrush As New LinearGradientBrush( _
       New Point(0, 10), _
       New Point(200, 10), _
       Color.FromArgb(255, 0, 0, 0), _
       Color.FromArgb(255, 255, 0, 0))
    
    Dim relativeIntensities As Single() = {0.0F, 0.5F, 1.0F}
    Dim relativePositions As Single() = {0.0F, 0.2F, 1.0F}
    
    'Create a Blend object and assign it to linGrBrush.
    Dim blend As New Blend()
    blend.Factors = relativeIntensities
    blend.Positions = relativePositions
    linGrBrush.Blend = blend
    
    e.Graphics.FillEllipse(linGrBrush, 0, 30, 200, 100)
    e.Graphics.FillRectangle(linGrBrush, 0, 155, 500, 30)
    
    

이전 예제의 그라데이션은 가로입니다. 즉, 가로 선을 따라 이동하면 색이 점차 변합니다. 세로 그라데이션 및 대각선 그라데이션을 정의할 수도 있습니다.

다음 예제에서는 점(0, 0) 및 (200, 100)을 LinearGradientBrush 생성자에 전달합니다. 파란색은 (0, 0)과 연결되고 녹색은 (200, 100)과 연결됩니다. 선(펜 너비 10)과 타원은 선형 그라데이션 브러시로 채워집니다.

다음 그림에서는 선과 타원을 보여 줍니다. 타원의 색은 (0, 0) 및 (200, 100)을 통과하는 선과 평행한 모든 선을 따라 이동하면서 점차 변합니다.

대각선 색상 그라데이션으로 채워진 선과 타원.

대각선 선형 그라데이션을 만들려면 다음을 수행합니다.

  • 불투명한 파란색과 불투명한 녹색을 각각 세 번째 및 네 번째 인수로 전달합니다.

    public void CreateDiagonalLinearGradients(PaintEventArgs e)
    {
        LinearGradientBrush linGrBrush = new LinearGradientBrush(
           new Point(0, 0),
           new Point(200, 100),
           Color.FromArgb(255, 0, 0, 255),   // opaque blue
           Color.FromArgb(255, 0, 255, 0));  // opaque green
    
        Pen pen = new Pen(linGrBrush, 10);
    
        e.Graphics.DrawLine(pen, 0, 0, 600, 300);
        e.Graphics.FillEllipse(linGrBrush, 10, 100, 200, 100);
    }
    
    Dim linGrBrush As New LinearGradientBrush( _
       New Point(0, 0), _
       New Point(200, 100), _
       Color.FromArgb(255, 0, 0, 255), _
       Color.FromArgb(255, 0, 255, 0))
    ' opaque blue
    ' opaque green
    Dim pen As New Pen(linGrBrush, 10)
    
    e.Graphics.DrawLine(pen, 0, 0, 600, 300)
    e.Graphics.FillEllipse(linGrBrush, 10, 100, 200, 100)
    
    

참고 항목