共用方式為


繪圖物件概觀

更新:2007 年 11 月

本主題將介紹 Drawing 物件,並描述如何使用這些物件有效地繪製圖案、點陣圖、文字和媒體。當您建立美工圖案、用 DrawingBrush 繪圖,或使用 Visual 物件時,請使用 Drawing 物件。

這個主題包含下列章節。

  • 什麼是繪圖物件?
  • 繪製圖案
  • 繪製影像
  • 播放媒體 (僅限程式碼)
  • 繪製文字
  • 複合繪圖
  • 將繪圖顯示為影像
  • 繪製含有繪圖的物件
  • 使用視覺項目來呈現繪圖
  • DrawingContext 物件
  • 列舉視覺項目的內容
  • 相關主題

什麼是繪圖物件?

Drawing 物件可描繪可見內容,例如圖案、點陣圖、視訊或文字行。不同類型的繪圖可描繪不同類型的內容。以下列出不同類型的繪圖物件。

Drawing 物件的用途很多,您有許多方法可以使用 Drawing 物件。

WPF 會提供其他型別的物件,這些物件也能夠繪製圖案、點陣圖、文字和媒體。例如,您也可以使用 Shape 物件來繪製圖案,而 MediaElement 控制項會提供另一種將視訊加入至應用程式的方法。因此,何時應該使用 Drawing 物件呢?就是當您可以犧牲架構層級功能以取得效能優點時,或當您需要 Freezable 功能時。因為 Drawing 物件不支援配置系統、輸入和焦點,所以這類物件所提供的效能優點很適合於描繪背景、美工圖案,以及使用 Visual 物件的低階繪圖。

因為這類物件屬於 Freezable 型別物件,所以 Drawing 物件會取得幾項特殊功能,包括:這類物件可以宣告為資源、供多個物件共用、設成唯讀以提升效能、複製以及設成安全執行緒 (Thread-Safe)。如需 Freezable 物件提供之不同功能的詳細資訊,請參閱 Freezable 物件概觀

繪製圖案

若要繪製圖案,您可使用 GeometryDrawing。幾何繪圖的 Geometry 屬性描述要繪製的圖案,其 Brush 屬性描述應如何繪製圖案的內部,而其 Pen 屬性則描述應如何繪製其外框。

下列範例使用 GeometryDrawing 來繪製圖案。此圖案是由一個 GeometryGroup 和兩個 EllipseGeometry 物件描述。此圖案的內部是用 LinearGradientBrush 繪製,而其外框則是用 BlackPen 繪製。

這個範例會建立下列 GeometryDrawing

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>

如需完整的範例,請參閱 HOW TO:建立 GeometryDrawing

PathGeometry 之類的其他 Geometry 類別可讓您建立曲線和弧線,進而建立更複雜的圖案。如需 Geometry 物件的詳細資訊,請參閱幾何概觀

如需其他不用 Drawing 物件繪製圖案之方法的詳細資訊,請參閱 WPF 中圖案和基本繪圖概觀

繪製影像

若要繪製影像,您可使用 ImageDrawingImageDrawing 物件的 ImageSource 屬性描述要繪製的影像,而其 Rect 屬性則定義繪製影像的區域。

下列範例會將影像繪製到位於 (75,75) 且為 100 x 100 像素的矩形中。下圖顯示此範例所建立的 ImageDrawing。圖中會加入灰色框線以顯示 ImageDrawing 的界限。

100 x 100 ImageDrawing

在 (75,75) 繪製之 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) 中宣告 VideoDrawing,但您只能使用程式碼載入和播放其媒體。若要在可延伸標記語言 (XAML) 中播放視訊,請改用 MediaElement

若要播放音訊或視訊檔,您可使用 VideoDrawingMediaPlayer。載入及播放媒體的方法有兩種。第一種方法是使用 MediaPlayerVideoDrawing 本身的功能,第二種方法是建立您自己的 MediaTimeline 來搭配 MediaPlayerVideoDrawing

注意事項:

使用您的應用程式散發媒體時,您不能像處理影像一樣,將媒體檔案當做專案資源來用。在專案檔中,您必須改為將媒體類型設為 Content,並將 CopyToOutputDirectory 設為 PreserveNewest 或 Always。

若要在不建立自己的 MediaTimeline 的情形下播放媒體,請執行下列步驟。

  1. 建立 MediaPlayer 物件。

    MediaPlayer player = new MediaPlayer();
    
  2. 使用 Open 方法載入媒體檔。

    player.Open(new Uri(@"sampleMedia\xbox.wmv", UriKind.Relative));
    
  3. 建立 VideoDrawing

    VideoDrawing aVideoDrawing = new VideoDrawing();
    
  4. 設定 VideoDrawingRect 屬性,指定要繪製媒體的大小和位置。

    aVideoDrawing.Rect = new Rect(0, 0, 100, 100);
    
  5. VideoDrawingPlayer 屬性設定為您建立的 MediaPlayer

    aVideoDrawing.Player = player;
    
  6. 使用 MediaPlayerPlay 方法,開始播放媒體。

    // Play the video once.
    player.Play();        
    

下列範例使用 VideoDrawingMediaPlayer 播放一次視訊檔。

//
// 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 搭配 MediaPlayerVideoDrawing 物件。MediaTimeline 可讓您指定視訊是否應重複。若要使用 MediaTimeline 搭配 VideoDrawing,請執行下列步驟:

  1. 宣告 MediaTimeline 並設定其計時行為。

    // Create a MediaTimeline.
    MediaTimeline mTimeline = 
        new MediaTimeline(new Uri(@"sampleMedia\xbox.wmv", UriKind.Relative)); 
    
    // Set the timeline to repeat.
    mTimeline.RepeatBehavior = RepeatBehavior.Forever;
    
  2. MediaTimeline 建立 MediaClock

    // Create a clock from the MediaTimeline.
    MediaClock mClock = mTimeline.CreateClock();
    
  3. 建立 MediaPlayer,並使用 MediaClock 設定其 Clock 屬性。

    MediaPlayer repeatingVideoDrawingPlayer = new MediaPlayer();
    repeatingVideoDrawingPlayer.Clock = mClock;
    
  4. 建立 VideoDrawing,並將 MediaPlayer 指派給 VideoDrawingPlayer 屬性。

    VideoDrawing repeatingVideoDrawing = new VideoDrawing();
    repeatingVideoDrawing.Rect = new Rect(150, 0, 100, 100);
    repeatingVideoDrawing.Player = repeatingVideoDrawingPlayer;  
    

下列範例使用 MediaTimeline 搭配 MediaPlayerVideoDrawing,來重複播放視訊。

//
// 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 時,您是使用 MediaClockController 屬性所傳回的互動式 ClockController 來控制媒體播放,而非使用 MediaPlayer 的互動式方法。

繪製文字

若要繪製文字,您可使用 GlyphRunDrawingGlyphRun。下列範例使用 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 是適用於固定格式文件展示和列印案例的低階物件。在螢幕上繪製文字的較簡單方式是使用 LabelTextBlock。如需 GlyphRun 的詳細資訊,請參閱 GlyphRun 物件和 Glyphs 項目簡介概觀。

複合繪圖

DrawingGroup 可讓您將多個繪圖組合成單一複合繪圖。您可以使用 DrawingGroup,將圖案、影像和文字組合成單一 Drawing 物件。

下列範例使用 DrawingGroup 來組合兩個 GeometryDrawing 物件和一個 ImageDrawing 物件。這個範例產生下列輸出。

複合繪圖

包含多個圖形的 DrawingGroup

//
// 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 作業會按照下列順序套用:OpacityMaskOpacityBitmapEffectClipGeometryGuidelineSet,然後是 Transform

下圖顯示 DrawingGroup 作業的套用順序。

DrawingGroup 作業的順序

DrawingGroup 作業的順序

下表說明您可用於操作 DrawingGroup 物件內容的屬性。

屬性

描述

示意圖

OpacityMask

變更 DrawingGroup 內容之選定部分的不透明度。如需範例,請參閱 HOW TO:控制繪圖的不透明度

具有不透明遮罩的 DrawingGroup

Opacity

統一變更 DrawingGroup 內容的不透明度。使用這個屬性,可讓 Drawing 變成透明或部分透明。如需範例,請參閱 HOW TO:對圖形套用不透明遮罩

具有不同不透明度設定的 DrawingGroup

BitmapEffect

BitmapEffect 套用到 DrawingGroup 內容。如需範例,請參閱 HOW TO:對圖形套用 BitmapEffect

具有 BlurBitmapEffect 的 DrawingGroup

ClipGeometry

使用 Geometry,將 DrawingGroup 內容裁剪成您描述的區域。如需範例,請參閱 HOW TO:裁剪圖形

具有已定義之裁剪區域的 DrawingGroup

GuidelineSet

沿著指定的導線,讓與裝置無關的像素貼齊裝置像素。這個屬性可確保在低 DPI 的顯示器上清晰呈現細緻的圖形。如需範例,請參閱 HOW TO:對圖形套用 GuidelineSet

具有與不具 GuidelineSet 的 DrawingGroup

Transform

轉換 DrawingGroup 內容。如需範例,請參閱 HOW TO:對圖形套用轉換

旋轉後的 DrawingGroup

將繪圖顯示為影像

若要使用 Image 控制項顯示 Drawing,請使用 DrawingImage 做為 Image 控制項的 Source,並將 DrawingImage 物件的 DrawingImage.Drawing 屬性設定為您要顯示的繪圖。

下列範例使用 DrawingImageImage 控制項來顯示 GeometryDrawing。這個範例產生下列輸出。

DrawingImage

兩個橢圓形的 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 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 是一種筆刷,可以用繪圖物件來繪製區域。您可以使用它來繪製幾乎任何含有繪圖的圖形物件。DrawingBrushDrawing 屬性會描述其 Drawing。若要使用 DrawingBrush 來呈現 Drawing,請使用筆刷的 Drawing 屬性將它加入至筆刷,並使用筆刷來繪製圖形物件,例如控制項或面板。

下列範例使用 DrawingBrush,採用從 GeometryDrawing 建立的圖樣來繪製 RectangleFill。這個範例產生下列輸出。

搭配 DrawingBrush 使用的 GeometryDrawing

並排顯示的 DrawingBrush

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 的詳細資訊,請參閱使用影像、繪圖和視覺效果繪製概觀。

使用視覺項目來呈現繪圖

DrawingVisual 是一種為了呈現繪圖所設計的視覺物件。對於要建置高度自訂圖形環境的開發人員而言,可以選擇直接在視覺分層作業,但本概觀中並未說明此選項。如需詳細資訊,請參閱使用 DrawingVisual 物件概觀。

DrawingContext 物件

DrawingContext 類別可讓您用視覺內容填入 (Populate) VisualDrawing。許多此種低階圖形物件會使用 DrawingContext,因為它可有效地描繪圖形內容。

雖然 DrawingContext 繪圖方法與 System.Drawing.Graphics 型別的繪圖方法類似,但實際上卻非常不同。DrawingContext 用於保留模式的圖形系統,而 System.Drawing.Graphics 型別則用於即時模式的圖形系統。當您使用 DrawingContext 物件的繪圖命令時,實際上是儲存一組呈現指令 (雖然實際儲存機制取決於提供 DrawingContext 的物件型別) 以在稍後供圖形系統使用,而不是即時繪製到螢幕上。如需 Windows Presentation Foundation (WPF) 圖形系統運作方式的詳細資訊,請參閱 Windows Presentation Foundation 圖形轉譯概觀

您不能直接具現化 (Instantiate) DrawingContext,但是,您可以從某些方法取得繪圖內容,例如 DrawingGroup.OpenDrawingVisual.RenderOpen

列舉視覺項目的內容

除了其他用途以外,Drawing 物件也會提供物件模式,以便列舉 Visual 的內容。

下列範例使用 GetDrawing 方法,擷取 VisualDrawingGroup 值並加以列舉。

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.
         }
     }
 }

請參閱

概念

最佳化效能:2D 圖形和影像處理

使用影像、繪圖和視覺效果繪製

幾何概觀

WPF 中圖案和基本繪圖概觀

Windows Presentation Foundation 圖形轉譯概觀

Freezable 物件概觀

參考

Drawing

DrawingGroup

其他資源

繪圖 HOW TO 主題