Drawing 개체 개요
업데이트: 2007년 11월
이 항목에서는 Drawing 개체를 소개하고 이 개체를 사용하여 도형, 비트맵, 텍스트 및 미디어를 효율적으로 그리는 방법을 설명합니다. 클립 아트를 만들거나, DrawingBrush를 사용하여 그리거나, Visual 개체를 사용할 때 Drawing 개체를 사용하십시오.
이 항목에는 다음 단원이 포함되어 있습니다.
- Drawing 개체란?
- 도형 그리기
- 이미지 그리기
- 미디어 재생(코드 전용)
- 텍스트 그리기
- 합성 그리기
- 그리기를 이미지로 표시
- 그림으로 개체 그리기
- Visual로 그리기 렌더링
- DrawingContext 개체
- Visual의 콘텐츠 열거
- 관련 항목
Drawing 개체란?
Drawing 개체는 도형, 비트맵, 비디오 또는 텍스트 줄과 같은 표시 가능한 콘텐츠를 나타냅니다. 그리기 형식이 다르면 나타내는 콘텐츠 형식도 다릅니다. 다음은 여러 그리기 개체 형식을 보여 주는 목록입니다.
GeometryDrawing - 도형을 그립니다.
ImageDrawing - 이미지를 그립니다.
GlyphRunDrawing - 텍스트를 그립니다.
VideoDrawing – 오디오 또는 비디오 파일을 재생합니다.
DrawingGroup - 기타 그림을 그립니다. 다른 그리기를 단일 합성 그리기로 결합하려면 그리기 그룹을 사용합니다.
Drawing 개체는 다목적입니다. 즉, 다양한 방식으로 Drawing 개체를 사용할 수 있습니다.
DrawingImage 및 Image 컨트롤을 사용하여 이 개체를 이미지로 표시할 수 있습니다.
이 개체를 DrawingBrush와 함께 사용하여 Page의 Background 같은 개체를 그릴 수 있습니다.
이 개체를 사용하여 DrawingVisual의 모양을 설명할 수 있습니다.
이 개체를 사용하여 Visual의 내용을 열거할 수 있습니다.
WPF는 도형, 비트맵, 텍스트 및 미디어를 그릴 수 있는 다른 개체 형식을 제공합니다. 예를 들어 Shape 개체를 사용하여 도형을 그릴 수도 있으며 MediaElement 컨트롤은 응용 프로그램에 비디오를 추가할 수 있는 또 다른 방법을 제공합니다. 그렇다면 Drawing 개체를 언제 사용해야 할까요? 프레임워크 수준 기능을 희생하여 성능을 높이거나 Freezable 기능이 필요할 때 사용해야 합니다. Drawing 개체는 레이아웃 시스템, 입력 및 포커스에 대한 지원이 부족하기 때문에 배경, 클립 아트 그리고 Visual 개체가 있는 하위 수준 그리기를 설명하는 데 적합한 성능상의 이점이 제공됩니다.
Drawing 개체는 Freezable 형식 개체이기 때문에 여러 가지 특수한 기능을 가집니다. 예를 들어 리소스로 선언하거나, 여러 개체 간에 공유하거나, 읽기 전용으로 설정하여 성능을 향상할 수 있으며, 복제하거나, 스레드로부터 안전하게 보호할 수 있습니다. Freezable 개체에서 제공하는 여러 기능에 대한 자세한 내용은 Freezable 개체 개요를 참조하십시오.
도형 그리기
도형을 그리려면 GeometryDrawing을 사용하십시오. 기하 도형 그리기의 Geometry 속성은 그릴 도형을 설명하고, Brush 속성은 도형의 내부를 칠하는 방법을 설명하고, Pen 속성은 윤곽을 그리는 방법을 설명합니다.
다음 예제에서는 GeometryDrawing을 사용하여 도형을 그립니다. 도형은 GeometryGroup 및 두 개의 EllipseGeometry 개체로 설명됩니다. 도형의 내부는 LinearGradientBrush를 사용하여 칠하고, 윤곽은 Black Pen을 사용하여 그립니다.
이 예제는 다음 GeometryDrawing을 만듭니다.
GeometryDrawing
//
// Create the Geometry to draw.
//
GeometryGroup ellipses = new GeometryGroup();
ellipses.Children.Add(
new EllipseGeometry(new Point(50,50), 45, 20)
);
ellipses.Children.Add(
new EllipseGeometry(new Point(50, 50), 20, 45)
);
//
// Create a GeometryDrawing.
//
GeometryDrawing aGeometryDrawing = new GeometryDrawing();
aGeometryDrawing.Geometry = ellipses;
// Paint the drawing with a gradient.
aGeometryDrawing.Brush =
new LinearGradientBrush(
Colors.Blue,
Color.FromRgb(204,204,255),
new Point(0,0),
new Point(1,1));
// Outline the drawing with a solid color.
aGeometryDrawing.Pen = new Pen(Brushes.Black, 10);
<GeometryDrawing>
<GeometryDrawing.Geometry>
<!-- Create a composite shape. -->
<GeometryGroup>
<EllipseGeometry Center="50,50" RadiusX="45" RadiusY="20" />
<EllipseGeometry Center="50,50" RadiusX="20" RadiusY="45" />
</GeometryGroup>
</GeometryDrawing.Geometry>
<GeometryDrawing.Brush>
<!-- Paint the drawing with a gradient. -->
<LinearGradientBrush>
<GradientStop Offset="0.0" Color="Blue" />
<GradientStop Offset="1.0" Color="#CCCCFF" />
</LinearGradientBrush>
</GeometryDrawing.Brush>
<GeometryDrawing.Pen>
<!-- Outline the drawing with a solid color. -->
<Pen Thickness="10" Brush="Black" />
</GeometryDrawing.Pen>
</GeometryDrawing>
전체 예제를 보려면 방법: GeometryDrawing 만들기를 참조하십시오.
PathGeometry 같은 다른 Geometry 클래스를 사용하면 곡선 및 원호를 만들어 보다 복잡한 도형을 만들 수 있습니다. Geometry 개체에 대한 자세한 내용은 Geometry 개요를 참조하십시오.
Drawing 개체를 사용하지 않는 도형을 그리는 다른 방법에 대한 자세한 내용은 WPF에서 Shape 및 기본 그리기 개요를 참조하십시오.
이미지 그리기
이미지를 그리려면 ImageDrawing을 사용하십시오. ImageDrawing 개체의 ImageSource 속성은 그릴 이미지를 설명하고, Rect 속성은 이미지가 그려지는 영역을 정의합니다.
다음 예제에서는 (75,75)에 위치한 100 x 100 픽셀의 직사각형 안에 이미지를 그립니다. 다음 그림에서는 이 예제에서 만든 ImageDrawing을 보여 줍니다. ImageDrawing의 경계를 보여 주기 위해 회색 테두리가 추가되었습니다.
100 x 100 ImageDrawing
// Create a 100 by 100 image with an upper-left point of (75,75).
ImageDrawing bigKiwi = new ImageDrawing();
bigKiwi.Rect = new Rect(75, 75, 100, 100);
bigKiwi.ImageSource = new BitmapImage(
new Uri(@"sampleImages\kiwi.png", UriKind.Relative));
<!-- The Rect property specifies that the image only fill a 100 by 100
rectangular area. -->
<ImageDrawing Rect="75,75,100,100" ImageSource="sampleImages\kiwi.png"/>
이미지에 대한 자세한 내용은 이미징 개요를 참조하십시오.
미디어 재생(코드 전용)
참고
XAML(Extensible Application Markup Language)에서 VideoDrawing을 선언할 수는 있지만 코드를 사용해서만 해당 미디어를 로드하고 재생할 수 있습니다. XAML(Extensible Application Markup Language)에서 비디오를 재생하려면 MediaElement를 대신 사용하십시오.
오디오 또는 비디오 파일을 재생하려면 VideoDrawing 및 MediaPlayer를 사용합니다. 두 가지 방법으로 미디어를 로드하고 재생할 수 있습니다. 첫 번째 방법은 MediaPlayer 및 VideoDrawing만 사용하는 것이고, 두 번째 방법은 자체적인 MediaTimeline을 만들어서 MediaPlayer 및 VideoDrawing과 함께 사용하는 것입니다.
참고
응용 프로그램으로 미디어를 배포하는 경우 이미지와 달리 미디어 파일은 프로젝트 리소스로 사용할 수 없습니다. 대신 프로젝트 파일에서 미디어 형식을 Content로 설정하고 CopyToOutputDirectory를 PreserveNewest 또는 Always로 설정해야 합니다.
자체적인 MediaTimeline을 만들지 않고 미디어를 재생하려면 다음 단계를 수행하십시오.
MediaPlayer 개체를 만듭니다.
MediaPlayer player = new MediaPlayer();
Open 메서드를 사용하여 미디어 파일을 로드합니다.
player.Open(new Uri(@"sampleMedia\xbox.wmv", UriKind.Relative));
VideoDrawing을 만듭니다.
VideoDrawing aVideoDrawing = new VideoDrawing();
VideoDrawing의 Rect 속성을 설정하여 미디어를 그릴 크기와 위치를 지정합니다.
aVideoDrawing.Rect = new Rect(0, 0, 100, 100);
직접 만든 MediaPlayer를 사용하여 VideoDrawing의 Player 속성을 설정합니다.
aVideoDrawing.Player = player;
MediaPlayer의 Play 메서드를 사용하여 미디어 재생을 시작합니다.
// Play the video once. player.Play();
다음 예제에서는 VideoDrawing 및 MediaPlayer를 사용하여 비디오 파일을 한 번 재생합니다.
//
// Create a VideoDrawing.
//
MediaPlayer player = new MediaPlayer();
player.Open(new Uri(@"sampleMedia\xbox.wmv", UriKind.Relative));
VideoDrawing aVideoDrawing = new VideoDrawing();
aVideoDrawing.Rect = new Rect(0, 0, 100, 100);
aVideoDrawing.Player = player;
// Play the video once.
player.Play();
미디어에 대한 추가적인 타이밍 제어권을 얻으려면 MediaTimeline을 MediaPlayer 및 VideoDrawing 개체와 함께 사용하십시오. MediaTimeline을 통해 비디오의 반복 여부를 지정할 수 있습니다. MediaTimeline을 VideoDrawing과 함께 사용하려면 다음 단계를 수행하십시오.
MediaTimeline을 선언하고 해당 타이밍 동작을 설정합니다.
// Create a MediaTimeline. MediaTimeline mTimeline = new MediaTimeline(new Uri(@"sampleMedia\xbox.wmv", UriKind.Relative)); // Set the timeline to repeat. mTimeline.RepeatBehavior = RepeatBehavior.Forever;
MediaTimeline에서 MediaClock을 만듭니다.
// Create a clock from the MediaTimeline. MediaClock mClock = mTimeline.CreateClock();
MediaPlayer를 만들고 MediaClock을 사용하여 해당 Clock 속성을 설정합니다.
MediaPlayer repeatingVideoDrawingPlayer = new MediaPlayer(); repeatingVideoDrawingPlayer.Clock = mClock;
VideoDrawing을 만들고 MediaPlayer를 VideoDrawing의 Player 속성에 할당합니다.
VideoDrawing repeatingVideoDrawing = new VideoDrawing(); repeatingVideoDrawing.Rect = new Rect(150, 0, 100, 100); repeatingVideoDrawing.Player = repeatingVideoDrawingPlayer;
다음 예제에서는 MediaTimeline을 MediaPlayer 및 VideoDrawing과 함께 사용하여 비디오를 반복 재생합니다.
//
// Create a VideoDrawing that repeats.
//
// Create a MediaTimeline.
MediaTimeline mTimeline =
new MediaTimeline(new Uri(@"sampleMedia\xbox.wmv", UriKind.Relative));
// Set the timeline to repeat.
mTimeline.RepeatBehavior = RepeatBehavior.Forever;
// Create a clock from the MediaTimeline.
MediaClock mClock = mTimeline.CreateClock();
MediaPlayer repeatingVideoDrawingPlayer = new MediaPlayer();
repeatingVideoDrawingPlayer.Clock = mClock;
VideoDrawing repeatingVideoDrawing = new VideoDrawing();
repeatingVideoDrawing.Rect = new Rect(150, 0, 100, 100);
repeatingVideoDrawing.Player = repeatingVideoDrawingPlayer;
MediaTimeline을 사용할 때는 MediaClock의 Controller 속성에서 반환된 대화형 ClockController를 사용하여 MediaPlayer의 대화형 메서드 대신 미디어 재생을 제어합니다.
텍스트 그리기
텍스트를 그리려면 GlyphRunDrawing 및 GlyphRun을 사용합니다. 다음 예제에서는 GlyphRunDrawing을 사용하여 "Hello World" 텍스트를 그립니다.
GlyphRun theGlyphRun = new GlyphRun(
new GlyphTypeface(new Uri(@"C:\WINDOWS\Fonts\TIMES.TTF")),
0,
false,
13.333333333333334,
new ushort[]{43, 72, 79, 79, 82, 3, 58, 82, 85, 79, 71},
new Point(0, 12.29),
new double[]{
9.62666666666667, 7.41333333333333, 2.96,
2.96, 7.41333333333333, 3.70666666666667,
12.5866666666667, 7.41333333333333,
4.44, 2.96, 7.41333333333333},
null,
null,
null,
null,
null,
null
);
GlyphRunDrawing gDrawing = new GlyphRunDrawing(Brushes.Black, theGlyphRun);
<GlyphRunDrawing ForegroundBrush="Black">
<GlyphRunDrawing.GlyphRun>
<GlyphRun
CaretStops="{x:Null}"
ClusterMap="{x:Null}"
IsSideways="False"
GlyphOffsets="{x:Null}"
GlyphIndices="43 72 79 79 82 3 58 82 85 79 71"
BaselineOrigin="0,12.29"
FontRenderingEmSize="13.333333333333334"
DeviceFontName="{x:Null}"
AdvanceWidths="9.62666666666667 7.41333333333333 2.96 2.96 7.41333333333333 3.70666666666667 12.5866666666667 7.41333333333333 4.44 2.96 7.41333333333333"
BidiLevel="0">
<GlyphRun.GlyphTypeface>
<GlyphTypeface FontUri="C:\WINDOWS\Fonts\TIMES.TTF" />
</GlyphRun.GlyphTypeface>
</GlyphRun>
</GlyphRunDrawing.GlyphRun>
</GlyphRunDrawing>
GlyphRun은 고정 형식 문서 표시 및 인쇄 시나리오에 사용하기 위한 하위 수준 개체입니다. Label 또는 TextBlock을 사용하면 보다 쉽게 텍스트를 화면에 그릴 수 있습니다. GlyphRun에 대한 자세한 내용은 GlyphRun 개체 및 Glyphs 요소 소개 개요를 참조하십시오.
합성 그리기
DrawingGroup을 사용하면 여러 그리기를 단일 합성 그리기로 결합할 수 있습니다. DrawingGroup을 사용하면 도형, 이미지 및 텍스트를 단일 Drawing 개체로 결합할 수 있습니다.
다음 예제에서는 DrawingGroup을 사용하여 두 개의 GeometryDrawing 개체와 ImageDrawing 개체를 결합합니다. 이 예제의 결과는 다음과 같습니다.
합성 그리기
//
// Create three drawings.
//
GeometryDrawing ellipseDrawing =
new GeometryDrawing(
new SolidColorBrush(Color.FromArgb(102, 181, 243, 20)),
new Pen(Brushes.Black, 4),
new EllipseGeometry(new Point(50,50), 50, 50)
);
ImageDrawing kiwiPictureDrawing =
new ImageDrawing(
new BitmapImage(new Uri(@"sampleImages\kiwi.png", UriKind.Relative)),
new Rect(50,50,100,100));
GeometryDrawing ellipseDrawing2 =
new GeometryDrawing(
new SolidColorBrush(Color.FromArgb(102,181,243,20)),
new Pen(Brushes.Black, 4),
new EllipseGeometry(new Point(150, 150), 50, 50)
);
// Create a DrawingGroup to contain the drawings.
DrawingGroup aDrawingGroup = new DrawingGroup();
aDrawingGroup.Children.Add(ellipseDrawing);
aDrawingGroup.Children.Add(kiwiPictureDrawing);
aDrawingGroup.Children.Add(ellipseDrawing2);
<DrawingGroup>
<GeometryDrawing Brush="#66B5F314">
<GeometryDrawing.Geometry>
<EllipseGeometry Center="50,50" RadiusX="50" RadiusY="50"/>
</GeometryDrawing.Geometry>
<GeometryDrawing.Pen>
<Pen Brush="Black" Thickness="4" />
</GeometryDrawing.Pen>
</GeometryDrawing>
<ImageDrawing ImageSource="sampleImages\kiwi.png" Rect="50,50,100,100"/>
<GeometryDrawing Brush="#66B5F314">
<GeometryDrawing.Geometry>
<EllipseGeometry Center="150,150" RadiusX="50" RadiusY="50"/>
</GeometryDrawing.Geometry>
<GeometryDrawing.Pen>
<Pen Brush="Black" Thickness="4" />
</GeometryDrawing.Pen>
</GeometryDrawing>
</DrawingGroup>
DrawingGroup을 사용하여 해당 콘텐츠에 불투명 마스크, 변환, 비트맵 효과 및 기타 작업을 적용할 수도 있습니다. DrawingGroup 작업은 OpacityMask, Opacity, BitmapEffect, ClipGeometry, GuidelineSet 및 Transform의 순서로 적용됩니다.
다음 그림에서는 DrawingGroup 작업이 적용되는 순서를 보여 줍니다.
DrawingGroup 작업의 순서
다음 표에서는 DrawingGroup 개체의 콘텐츠를 조작하는 데 사용할 수 있는 속성에 대해 설명합니다.
속성 |
설명 |
그림 |
---|---|---|
DrawingGroup 콘텐츠에서 선택한 부분의 불투명도를 변경합니다. 예제를 보려면 방법: Drawing의 불투명도 제어를 참조하십시오. |
||
DrawingGroup 콘텐츠의 불투명도를 균일하게 변경합니다. 이 속성을 사용하여 Drawing을 투명하게 또는 부분적으로 투명하게 만듭니다. 예제를 보려면 방법: Drawing에 불투명 마스크 적용을 참조하십시오. |
||
BitmapEffect를 DrawingGroup 콘텐츠에 적용합니다. 예제를 보려면 방법: Drawing에 BitmapEffect 적용을 참조하십시오. |
||
DrawingGroup 콘텐츠를 Geometry를 사용하여 설명하는 영역에 클리핑합니다. 예제를 보려면 방법: 그리기 클리핑을 참조하십시오. |
||
지정된 지침에 따라 장치 독립적 픽셀을 장치 픽셀에 맞춥니다. 이 속성은 매우 세부적인 그래픽이 낮은 DPI 디스플레이에서 선명하게 렌더링되도록 하는 데 유용합니다. 예제를 보려면 방법: Drawing에 GuidelineSet 적용을 참조하십시오. |
||
DrawingGroup 콘텐츠를 변환합니다. 예제를 보려면 방법: 그리기에 변환 적용을 참조하십시오. |
그리기를 이미지로 표시
Image 컨트롤을 사용하여 Drawing을 표시하려면 DrawingImage를 Image 컨트롤의 Source로 사용하고 DrawingImage 개체의 DrawingImage.Drawing 속성을 표시할 그리기로 설정하십시오.
다음 예제에서는 DrawingImage 및 Image 컨트롤을 사용하여 GeometryDrawing을 표시합니다. 이 예제의 결과는 다음과 같습니다.
DrawingImage
using System;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
namespace SDKSample
{
public class DrawingImageExample : Page
{
public DrawingImageExample()
{
//
// Create the Geometry to draw.
//
GeometryGroup ellipses = new GeometryGroup();
ellipses.Children.Add(
new EllipseGeometry(new Point(50,50), 45, 20)
);
ellipses.Children.Add(
new EllipseGeometry(new Point(50, 50), 20, 45)
);
//
// Create a GeometryDrawing.
//
GeometryDrawing aGeometryDrawing = new GeometryDrawing();
aGeometryDrawing.Geometry = ellipses;
// Paint the drawing with a gradient.
aGeometryDrawing.Brush =
new LinearGradientBrush(
Colors.Blue,
Color.FromRgb(204,204,255),
new Point(0,0),
new Point(1,1));
// Outline the drawing with a solid color.
aGeometryDrawing.Pen = new Pen(Brushes.Black, 10);
//
// Use a DrawingImage and an Image control
// to display the drawing.
//
DrawingImage geometryImage = new DrawingImage(aGeometryDrawing);
// Freeze the DrawingImage for performance benefits.
geometryImage.Freeze();
Image anImage = new Image();
anImage.Source = geometryImage;
anImage.HorizontalAlignment = HorizontalAlignment.Left;
//
// Place the image inside a border and
// add it to the page.
//
Border exampleBorder = new Border();
exampleBorder.Child = anImage;
exampleBorder.BorderBrush = Brushes.Gray;
exampleBorder.BorderThickness = new Thickness(1);
exampleBorder.HorizontalAlignment = HorizontalAlignment.Left;
exampleBorder.VerticalAlignment = VerticalAlignment.Top;
exampleBorder.Margin = new Thickness(10);
this.Margin = new Thickness(20);
this.Background = Brushes.White;
this.Content = exampleBorder;
}
}
}
<Page
xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml"
xmlns:PresentationOptions="https://schemas.microsoft.com/winfx/2006/xaml/presentation/options"
xmlns:mc="https://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="PresentationOptions"
Background="White" Margin="20">
<Border BorderBrush="Gray" BorderThickness="1"
HorizontalAlignment="Left" VerticalAlignment="Top"
Margin="10">
<!-- This image uses a Drawing object for its source. -->
<Image>
<Image.Source>
<DrawingImage PresentationOptions:Freeze="True">
<DrawingImage.Drawing>
<GeometryDrawing>
<GeometryDrawing.Geometry>
<GeometryGroup>
<EllipseGeometry Center="50,50" RadiusX="45" RadiusY="20" />
<EllipseGeometry Center="50,50" RadiusX="20" RadiusY="45" />
</GeometryGroup>
</GeometryDrawing.Geometry>
<GeometryDrawing.Brush>
<LinearGradientBrush>
<GradientStop Offset="0.0" Color="Blue" />
<GradientStop Offset="1.0" Color="#CCCCFF" />
</LinearGradientBrush>
</GeometryDrawing.Brush>
<GeometryDrawing.Pen>
<Pen Thickness="10" Brush="Black" />
</GeometryDrawing.Pen>
</GeometryDrawing>
</DrawingImage.Drawing>
</DrawingImage>
</Image.Source>
</Image>
</Border>
</Page>
그림으로 개체 그리기
DrawingBrush는 그리기 개체로 영역을 그리는 브러시 유형입니다. 이를 사용하여 그림으로 모든 그래픽 요소를 그릴 수 있습니다. DrawingBrush의 Drawing 속성은 해당 Drawing을 설명합니다. DrawingBrush를 사용하여 Drawing을 렌더링하려면 브러시의 Drawing 속성을 사용하여 이를 브러시에 추가하고 브러시를 사용하여 컨트롤 또는 패널 같은 그래픽 개체를 그리십시오.
다음 예제에서는 DrawingBrush를 사용하여 GeometryDrawing에서 만든 패턴으로 Rectangle의 Fill을 그립니다. 이 예제의 결과는 다음과 같습니다.
DrawingBrush와 함께 사용된 GeometryDrawing
using System;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
namespace SDKSample
{
public class DrawingBrushExample : Page
{
public DrawingBrushExample()
{
//
// Create the Geometry to draw.
//
GeometryGroup ellipses = new GeometryGroup();
ellipses.Children.Add(
new EllipseGeometry(new Point(50,50), 45, 20)
);
ellipses.Children.Add(
new EllipseGeometry(new Point(50, 50), 20, 45)
);
//
// Create a GeometryDrawing.
//
GeometryDrawing aGeometryDrawing = new GeometryDrawing();
aGeometryDrawing.Geometry = ellipses;
// Paint the drawing with a gradient.
aGeometryDrawing.Brush =
new LinearGradientBrush(
Colors.Blue,
Color.FromRgb(204,204,255),
new Point(0,0),
new Point(1,1));
// Outline the drawing with a solid color.
aGeometryDrawing.Pen = new Pen(Brushes.Black, 10);
DrawingBrush patternBrush = new DrawingBrush(aGeometryDrawing);
patternBrush.Viewport = new Rect(0, 0, 0.25, 0.25);
patternBrush.TileMode = TileMode.Tile;
patternBrush.Freeze();
//
// Create an object to paint.
//
Rectangle paintedRectangle = new Rectangle();
paintedRectangle.Width = 100;
paintedRectangle.Height = 100;
paintedRectangle.Fill = patternBrush;
//
// Place the image inside a border and
// add it to the page.
//
Border exampleBorder = new Border();
exampleBorder.Child = paintedRectangle;
exampleBorder.BorderBrush = Brushes.Gray;
exampleBorder.BorderThickness = new Thickness(1);
exampleBorder.HorizontalAlignment = HorizontalAlignment.Left;
exampleBorder.VerticalAlignment = VerticalAlignment.Top;
exampleBorder.Margin = new Thickness(10);
this.Margin = new Thickness(20);
this.Background = Brushes.White;
this.Content = exampleBorder;
}
}
}
<Page
xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml"
xmlns:PresentationOptions="https://schemas.microsoft.com/winfx/2006/xaml/presentation/options"
xmlns:mc="https://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="PresentationOptions"
Margin="20" Background="White">
<Border BorderBrush="Gray" BorderThickness="1"
HorizontalAlignment="Left" VerticalAlignment="Top"
Margin="10">
<Rectangle Width="100" Height="100">
<Rectangle.Fill>
<DrawingBrush PresentationOptions:Freeze="True"
Viewport="0,0,0.25,0.25" TileMode="Tile">
<DrawingBrush.Drawing>
<GeometryDrawing>
<GeometryDrawing.Geometry>
<GeometryGroup>
<EllipseGeometry Center="50,50" RadiusX="45" RadiusY="20" />
<EllipseGeometry Center="50,50" RadiusX="20" RadiusY="45" />
</GeometryGroup>
</GeometryDrawing.Geometry>
<GeometryDrawing.Brush>
<LinearGradientBrush>
<GradientStop Offset="0.0" Color="Blue" />
<GradientStop Offset="1.0" Color="#CCCCFF" />
</LinearGradientBrush>
</GeometryDrawing.Brush>
<GeometryDrawing.Pen>
<Pen Thickness="10" Brush="Black" />
</GeometryDrawing.Pen>
</GeometryDrawing>
</DrawingBrush.Drawing>
</DrawingBrush>
</Rectangle.Fill>
</Rectangle>
</Border>
</Page>
using System;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
namespace SDKSample
{
public class DrawingBrushExample : Page
{
public DrawingBrushExample()
{
//
// Create the Geometry to draw.
//
GeometryGroup ellipses = new GeometryGroup();
ellipses.Children.Add(
new EllipseGeometry(new Point(50,50), 45, 20)
);
ellipses.Children.Add(
new EllipseGeometry(new Point(50, 50), 20, 45)
);
//
// Create a GeometryDrawing.
//
GeometryDrawing aGeometryDrawing = new GeometryDrawing();
aGeometryDrawing.Geometry = ellipses;
// Paint the drawing with a gradient.
aGeometryDrawing.Brush =
new LinearGradientBrush(
Colors.Blue,
Color.FromRgb(204,204,255),
new Point(0,0),
new Point(1,1));
// Outline the drawing with a solid color.
aGeometryDrawing.Pen = new Pen(Brushes.Black, 10);
DrawingBrush patternBrush = new DrawingBrush(aGeometryDrawing);
patternBrush.Viewport = new Rect(0, 0, 0.25, 0.25);
patternBrush.TileMode = TileMode.Tile;
patternBrush.Freeze();
//
// Create an object to paint.
//
Rectangle paintedRectangle = new Rectangle();
paintedRectangle.Width = 100;
paintedRectangle.Height = 100;
paintedRectangle.Fill = patternBrush;
//
// Place the image inside a border and
// add it to the page.
//
Border exampleBorder = new Border();
exampleBorder.Child = paintedRectangle;
exampleBorder.BorderBrush = Brushes.Gray;
exampleBorder.BorderThickness = new Thickness(1);
exampleBorder.HorizontalAlignment = HorizontalAlignment.Left;
exampleBorder.VerticalAlignment = VerticalAlignment.Top;
exampleBorder.Margin = new Thickness(10);
this.Margin = new Thickness(20);
this.Background = Brushes.White;
this.Content = exampleBorder;
}
}
}
DrawingBrush 클래스는 해당 콘텐츠를 늘이고 바둑판식으로 배열하는 다양한 옵션을 제공합니다. DrawingBrush에 대한 자세한 내용은 이미지, 그림 및 시각적 표시로 그리기 개요를 참조하십시오.
Visual로 그리기 렌더링
DrawingVisual은 그리기를 렌더링하도록 디자인된 시각적 개체 형식입니다. 시각적 계층에서 직접 작업하는 것은 고도의 사용자 지정된 그래픽 환경을 빌드하려는 개발자를 위한 옵션이며 이 개요에 설명되어 있지 않습니다. 자세한 내용은 DrawingVisual 개체 사용 개요를 참조하십시오.
DrawingContext 개체
DrawingContext 클래스를 사용하면 Visual 또는 Drawing에 시각적 콘텐츠를 넣을 수 있습니다. 다수의 이러한 하위 수준 그래픽 개체는 그래픽 콘텐츠를 매우 효율적으로 설명하는 DrawingContext를 사용합니다.
DrawingContext 그리기 메서드와 System.Drawing.Graphics 형식의 그리기 메서드는 비슷해 보이지만 실제로는 매우 다릅니다. DrawingContext는 유지 모드 그래픽 시스템과 함께 사용되는 반면 System.Drawing.Graphics 형식은 직접 실행 모드 그래픽 시스템과 함께 사용됩니다. DrawingContext 개체의 그리기 명령을 사용할 때는 화면에 실시간으로 그려지는 것이 아니라 실제로는 그래픽 시스템에서 나중에 사용될 렌더링 명령 집합이 저장됩니다. 단, 정확한 저장 메커니즘은 DrawingContext를 제공하는 개체의 형식에 따라 달라집니다. WPF(Windows Presentation Foundation) 그래픽 시스템의 작동 방식에 대한 자세한 내용은 Windows Presentation Foundation 그래픽 렌더링 개요를 참조하십시오.
DrawingContext는 직접 인스턴스화할 수 없지만 DrawingGroup.Open 및 DrawingVisual.RenderOpen과 같은 특정 메서드에서 그리기 컨텍스트를 가져올 수 있습니다.
Visual의 콘텐츠 열거
기타 다른 용도와 더불어 Drawing 개체는 Visual의 콘텐츠를 열거하기 위한 개체 모델을 제공합니다.
다음 예제에서는 GetDrawing 메서드를 사용하여 Visual의 DrawingGroup 값을 검색하고 이를 열거합니다.
public void RetrieveDrawing(Visual v)
{
DrawingGroup dGroup = VisualTreeHelper.GetDrawing(v);
EnumDrawingGroup(dGroup);
}
// Enumerate the drawings in the DrawingGroup.
public void EnumDrawingGroup(DrawingGroup drawingGroup)
{
DrawingCollection dc = drawingGroup.Children;
// Enumerate the drawings in the DrawingCollection.
foreach (Drawing drawing in dc)
{
// If the drawing is a DrawingGroup, call the function recursively.
if (drawing.GetType() == typeof(DrawingGroup))
{
EnumDrawingGroup((DrawingGroup)drawing);
}
else if (drawing.GetType() == typeof(GeometryDrawing))
{
// Perform action based on drawing type.
}
else if (drawing.GetType() == typeof(ImageDrawing))
{
// Perform action based on drawing type.
}
else if (drawing.GetType() == typeof(GlyphRunDrawing))
{
// Perform action based on drawing type.
}
else if (drawing.GetType() == typeof(VideoDrawing))
{
// Perform action based on drawing type.
}
}
}
참고 항목
개념
Windows Presentation Foundation 그래픽 렌더링 개요