Übersicht über Zeichnungsobjekte

In diesem Thema werden Drawing-Objekte vorgestellt und beschrieben, wie sie effizient zum Zeichnen von Formen, Bitmaps, Text und Medien verwendet werden. Verwenden Sie Drawing-Objekte beim Erstellen von ClipArt, beim Malen mit einem DrawingBrush oder beim Verwenden von Visual-Objekten.

Was ein Zeichnungsobjekt ist

Ein Drawing-Objekt beschreibt sichtbaren Inhalt, z. B. eine Form, ein Bitmap, ein Video oder eine Textzeile. Verschiedene Arten von Zeichnungen beschreiben verschiedene Arten von Inhalten. Im Folgenden finden Sie eine Liste der unterschiedlichen Typen von Zeichnungsobjekten.

Drawing-Objekte sind vielseitig, es gibt viele Verwendungsmöglichkeiten für ein Drawing-Objekt.

  • Sie können es als Bild anzeigen, indem Sie ein DrawingImage und ein Image-Steuerelement verwenden

  • Sie können es mit einem DrawingBrush verwenden, um ein Objekt zu zeichnen, wie etwa den Background einer Page

  • Sie können es verwenden, um die Darstellung eines DrawingVisual zu beschreiben

  • Sie können es verwenden, um die Inhalte eines Visual aufzuzählen

WPF bietet andere Arten von Objekten, zeichnen Formen, Bitmaps, Text und Medien. Beispielsweise können Sie auch Shape-Objekte zum Zeichnen von Formen verwenden, und das MediaElement-Steuerelement bietet eine alternative Möglichkeit, Ihrer Anwendung Video hinzuzufügen. Wann sollten Sie also Drawing-Objekte verwenden? Wenn Sie auf Funktionen auf Frameworkebene verzichten können, um Leistungsverbesserungen zu erzielen, oder wenn Sie Freezable-Features benötigen. Da Drawing-Objekte keine Unterstützung für Layout, Eingabe und Fokus bieten, weisen sie Leistungsvorteile auf, die sie zum Beschreiben von Hintergründen, ClipArt und das Zeichnen auf niedriger Ebene mit Visual-Objekten ideal geeignet machen.

Da sie Objekte vom Typ Freezable sind, stellen Drawing-Objekte mehrere spezielle Features bereit: Sie können als Ressourcen deklariert, von mehreren Objekten gemeinsam verwendet, zur Leistungsoptimierung als schreibgeschützt definiert, geklont und als threadsicher festgelegt werden. Weitere Informationen zu den verschiedenen Funktionen, die Freezable-Objekte bieten, finden Sie unter Übersicht über Freezable-Objekte.

Zeichnen einer Form

Zum Zeichnen einer Form verwenden Sie eine GeometryDrawing. Die Eigenschaft Geometry einer Geometriezeichnung beschreibt die zu zeichnende Form, ihre Brush-Eigenschaft beschreibt, wie der Füllbereich der Form gezeichnet und ihre Pen-Eigenschaft, wie ihre Umrisslinie gezeichnet werden soll.

Im folgenden Beispiel wird eine GeometryDrawing zum Zeichnen einer Form verwendet. Die Form wird durch eine GeometryGroup und zwei EllipseGeometry-Objekte beschrieben. Der Füllbereich der Form wird mit einem LinearGradientBrush und ihr Umriss mit einem BlackPen gezeichnet.

Dieses Beispiel erstellt die folgende GeometryDrawing.

A GeometryDrawing of two ellipses
Eine 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>

Das vollständige Beispiel finden Sie unter Erstellen einer GeometryDrawing.

Andere Geometry-Klassen, wie etwa PathGeometry, ermöglichen Ihnen das Erstellen komplexerer Formen durch das Erstellen von Kurven und Bögen. Weitere Informationen zu Geometry-Objekten finden Sie in der Übersicht über die Geometrie.

Weitere Informationen zu anderen Methoden zum Zeichnen von Formen, die keine Drawing-Objekte verwenden, finden Sie unter Überblick über Formen und die grundlegenden Funktionen zum Zeichnen in WPF.

Zeichnen eines Bilds

Zum Zeichnen eines Bilds verwenden Sie eine ImageDrawing. Die Eigenschaft ImageSource eines ImageDrawing-Objekts beschreibt das zu zeichnende Bild, und seine Rect-Eigenschaft definiert den Bereich, in dem das Bild gezeichnet wird.

Im folgende Beispiel wird ein Bild in ein Rechteck bei (75,75) gezeichnet, das 100 x 100 Pixel groß ist. Die folgende Abbildung zeigt die durch dieses Beispiel erstellte ImageDrawing. Es wurde ein grauer Rahmen hinzugefügt, um die Begrenzungen der ImageDrawing darzustellen.

A 100 by 100 ImageDrawing drawn at (75,75)
Eine ImageDrawing mit den Maßen 100 x 100

// 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"/>

Weitere Informationen zu Bildern finden Sie unter der Überblick über die Bildverarbeitung.

Wiedergeben von Medien (nur Code)

Hinweis

Zwar können Sie eine VideoDrawing in XAML (Extensible Application Markup Language) deklarieren, jedoch können Sie ihren Medieninhalt nur mithilfe von Code laden und abspielen. Zum Wiedergeben von Video in XAML (Extensible Application Markup Language) verwenden Sie stattdessen ein MediaElement.

Zum Wiedergeben einer Audio- oder Videodatei verwenden Sie eine VideoDrawing und einen MediaPlayer. Es gibt zwei Methoden zum Laden und Wiedergeben von Medien. Die erste besteht in der eigenständigen Verwendung eines MediaPlayer und einer VideoDrawing, und die zweite Methode besteht im Erstellen einer eigenen MediaTimeline für die Verwendung mit dem MediaPlayer und der VideoDrawing.

Hinweis

Wenn Sie Medien mit Ihrer Anwendung verteilen, können Sie keine Mediendatei als Ressource verwenden, wie Sie das mit einem Bild machen würden. In der Projektdatei müssen Sie stattdessen den Medientyp auf Content festlegen, und CopyToOutputDirectory auf PreserveNewest oder Always.

Zum Abspielen von Medien ohne das Erstellen einer eigenen MediaTimeline führen Sie die folgenden Schritte aus.

  1. Erstellen eines MediaPlayer-Objekts

    MediaPlayer player = new MediaPlayer();
    
  2. Verwenden Sie die Open-Methode, um die Mediendatei zu laden.

    player.Open(new Uri(@"sampleMedia\xbox.wmv", UriKind.Relative));
    
  3. Erstellen Sie eine VideoDrawing.

    VideoDrawing aVideoDrawing = new VideoDrawing();
    
  4. Geben Sie die Größe und Position zum Zeichnen des Medieninhalts an, indem Sie die Rect-Eigenschaft der VideoDrawing festlegen.

    aVideoDrawing.Rect = new Rect(0, 0, 100, 100);
    
  5. Legen Sie die Player-Eigenschaft der VideoDrawing auf den von Ihnen erstellten MediaPlayer fest.

    aVideoDrawing.Player = player;
    
  6. Verwenden Sie die Play-Methode des MediaPlayer, um mit der Wiedergabe des Medieninhalts zu beginnen.

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

Das folgende Beispiel verwendet eine VideoDrawing und einen MediaPlayer, um eine Videodatei einmal wiederzugeben.

//
// 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();

Wenn Sie zusätzliche zeitliche Kontrolle über die Medienwiedergabe erlangen möchten, verwenden Sie eine MediaTimeline mit den Objekten MediaPlayer und VideoDrawing. Die MediaTimeline erlaubt Ihnen anzugeben, ob die Videowiedergabe wiederholt werden soll. Zum Verwenden einer MediaTimeline mit einer VideoDrawing führen Sie die folgenden Schritte aus:

  1. Deklarieren Sie die MediaTimeline, und legen Sie ihr zeitliches Verhalten fest.

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

    // Create a clock from the MediaTimeline.
    MediaClock mClock = mTimeline.CreateClock();
    
  3. Erstellen Sie einen MediaPlayer, und verwenden Sie die MediaClock, um ihre Clock-Eigenschaft festzulegen.

    MediaPlayer repeatingVideoDrawingPlayer = new MediaPlayer();
    repeatingVideoDrawingPlayer.Clock = mClock;
    
  4. Erstellen Sie eine VideoDrawing, und weisen Sie den MediaPlayer der Player-Eigenschaft von VideoDrawing zu.

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

Das folgende Beispiel verwendet eine MediaTimeline mit einem MediaPlayer und einer VideoDrawing, um ein Video wiederholt abzuspielen.

//
// 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;

Beachten Sie, dass Sie beim Verwenden einer MediaTimeline den interaktiven ClockController zum Steuern der Medienwiedergabe verwenden, der von der Controller-Eigenschaft der MediaClock zurückgegeben wird, anstelle der interaktiven Methoden von MediaPlayer.

Zeichnen von Text

Zum Zeichnen von Text verwenden Sie eine GlyphRunDrawing und einen GlyphRun. Das folgende Beispiel verwendet eine GlyphRunDrawing, um den Text „Hello World“ zu zeichnen.

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>

Ein GlyphRun ist ein Objekt auf niedriger Ebene, das für die Verwendung mit der Dokumentpräsentation und Druckszenarien mit festem Format gedacht ist. Eine einfachere Möglichkeit, Text auf dem Bildschirm zu zeichnen, ist die Verwendung eines Label oder eines TextBlock. Weitere Informationen zu GlyphRun finden Sie in der Übersicht Einführung in das ‚GlyphRun‘-Objekt und das ‚Glyphs‘-Element.

Zusammengesetzte Zeichnungen

Mit einer DrawingGroup können Sie mehrere Zeichnungen in einer zusammengesetzten Zeichnung kombinieren. Durch Verwendung einer DrawingGroup können Sie Formen, Bilder und Text zu einem einzelnen Drawing-Objekt kombinieren.

Das folgende Beispiel verwendet eine DrawingGroup, um zwei GeometryDrawing-Objekte und ein ImageDrawing-Objekt zu kombinieren. Folgende Ergebnisse werden zurückgegeben:

A DrawingGroup with multiple drawings
Eine zusammengesetzte Zeichnung

//
// 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>

Mit einer DrawingGroup können Sie zudem Durchlässigkeitsmasken, Umwandlungen, Bitmapeffekte und andere Vorgänge auf die Inhalte anwenden. DrawingGroup-Vorgänge werden in der folgenden Reihenfolge angewendet: OpacityMask, Opacity, BitmapEffect, ClipGeometry, GuidelineSet und dann Transform.

Die folgende Abbildung zeigt die Reihenfolge, in der DrawingGroup-Vorgänge angewandt werden.

DrawingGroup order of operations
Reihenfolge der DrawingGroup-Vorgänge

Die folgende Tabelle beschreibt die Eigenschaften, mit denen Sie den Inhalt eines DrawingGroup-Objekts bearbeiten können.

Eigenschaft BESCHREIBUNG Abbildung
OpacityMask Ändert die Deckkraft ausgewählter Teile der DrawingGroup-Inhalte. Ein Beispiel finden Sie unter Vorgehensweise: Steuern der Durchlässigkeit einer Zeichnung. A DrawingGroup with an opacity mask
Opacity Ändert die Deckkraft der DrawingGroup-Inhalte einheitlich. Verwenden Sie diese Eigenschaft, um eine Drawing transparent oder teilweise transparent zu machen. Ein Beispiel finden Sie unter Vorgehensweise: Anwenden einer Deckkraftmaske auf eine Zeichnung. DrawingGroups with different opacity settings
BitmapEffect Wendet einen BitmapEffect auf den DrawingGroup-Inhalt an. Ein Beispiel finden Sie unter Vorgehensweise: Anwenden von Bitmapeffekten auf eine Zeichnung. DrawingGroup with a BlurBitmapEffect
ClipGeometry Schneidet die DrawingGroup-Inhalte auf einen Bereich zu, den Sie mithilfe einer Geometry beschreiben. Ein Beispiel finden Sie unter Verfahrensweise: Beschneiden einer Zeichnung . DrawingGroup with a defined clip region
GuidelineSet Richtet geräteunabhängige Pixel anhand der angegebenen Richtlinien an Gerätepixel aus. Diese Eigenschaft ist hilfreich, um sicherzustellen, dass datailreiche Grafiken auf Bildschirmen mit niedrigem DPI-Wert scharf gerendert werden. Ein Beispiel finden Sie unter Anwenden eines Führungsliniensatzes auf eine Zeichnung. A DrawingGroup with and without a GuidelineSet
Transform Transformiert die DrawingGroup-Inhalte. Ein Beispiel finden Sie unter Vorgehensweise: Anwenden einer Transformation auf eine Zeichnung. A rotated DrawingGroup

Anzeigen einer Zeichnung als Bild

Um eine Drawing mit einem Image-Steuerelement anzuzeigen, verwenden Sie ein DrawingImage als Source des Image-Steuerelements, und legen Sie die DrawingImage.Drawing-Eigenschaft des DrawingImage-Objekts auf die Zeichnung fest, die Sie anzeigen möchten.

Im folgenden Beispiel werden ein DrawingImage und ein Image-Steuerelement verwendet, um eine GeometryDrawing anzuzeigen. Folgende Ergebnisse werden zurückgegeben:

A GeometryDrawing of two ellipses
Ein 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="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  xmlns:PresentationOptions="http://schemas.microsoft.com/winfx/2006/xaml/presentation/options" 
  xmlns:mc="http://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>

Zeichnen eines Objekts mit einer Zeichnung

Ein DrawingBrush ist ein Pinseltyp, der einen Bereich mit einem Zeichnungsobjekt zeichnet. Sie können ihn verwenden, um ein jedes beliebige graphische Objekt mit einer Zeichnung zu zeichnen. Die Drawing-Eigenschaft eines DrawingBrush beschreibt seine Drawing. Zum Rendern einer Drawing mit einem DrawingBrush fügen Sie sie dem Pinsel mithilfe der Eigenschaft Drawing des Pinsels hinzu, und verwenden Sie den Pinsel, um ein Grafikobjekt zu zeichnen, z. B. ein Steuerelement oder ein Bedienfeld.

Das folgende Beispiel verwendet einen DrawingBrush, um den Fill eines Rectangle mit einem Muster zu zeichnen, das aus einer GeometryDrawing erstellt wurde. Folgende Ergebnisse werden zurückgegeben:

A tiled DrawingBrush
Eine mit einem DrawingBrush verwendete 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="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  xmlns:PresentationOptions="http://schemas.microsoft.com/winfx/2006/xaml/presentation/options" 
  xmlns:mc="http://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>

Die DrawingBrush-Klasse bietet eine Vielzahl von Optionen zum Strecken und Unterteilen des Inhalts. Weitere Informationen zu DrawingBrush finden Sie in der Übersicht Zeichnen mit Bildern, Zeichnungen und visuellen Elementen.

Rendern einer Zeichnung mit einem visuellen Element

Ein DrawingVisual ist ein Typ von visuellem Objekt, das zum Rendern einer Zeichnung ausgelegt ist. Das direkte Arbeiten auf der visuellen Ebene ist eine Option für Entwickler, die eine stark benutzerdefinierte grafische Umgebung erstellen möchten; dies wird in dieser Übersicht nicht beschrieben. Weitere Informationen finden Sie unter Verwenden von DrawingVisual-Objekten.

DrawingContext-Objekte

Die DrawingContext-Klasse ermöglicht Ihnen das Auffüllen eines Visual oder einer Drawing mit visuellem Inhalt. Viele dieser grafischen Objekte auf niedriger Ebene verwenden einen DrawingContext, da er Grafikinhalte sehr effizient beschreibt.

Zwar erscheinen die DrawingContext-Zeichenmethoden den Zeichenmethoden des System.Drawing.Graphics-Typs ähnlich, sie sind aber tatsächlich sehr verschieden. DrawingContext wird für ein Retained Mode-Grafiksystem verwendet, während der System.Drawing.Graphics-Typ für ein Immediate Mode-Grafiksystem verwendet wird. Bei Verwendung der Zeichenbefehle eines DrawingContext-Objekts speichern Sie einen Satz von Renderinganweisungen (obwohl der tatsächliche Speichermechanismus vom Typ des Objekts abhängt, das den DrawingContext bereitstellt), die später vom Grafiksystem verwendet werden. Sie zeichnen nicht in Echtzeit auf den Bildschirm. Weitere Informationen zur Funktionsweise des WPF-Grafiksystems (Windows Presentation Foundation) finden Sie unter Übersicht über das WPF-Grafikrendering.

Sie instanziieren einen DrawingContext nie direkt. Sie können jedoch einen Zeichnungskontext mit bestimmten Methoden abrufen, z. B. DrawingGroup.Open und DrawingVisual.RenderOpen.

Auflisten der Inhalte eines visuellen Objekts

Neben ihren anderen Verwendungszwecken bieten Drawing-Objekte auch ein Objektmodell für das Aufzählen der Inhalte eines Visual.

Im folgenden Beispiel wird die GetDrawing-Methode verwendet, um den DrawingGroup-Wert einer Visual-Methode abzurufen und sie aufzuzählen.

public void RetrieveDrawing(Visual v)
{
    DrawingGroup drawingGroup = VisualTreeHelper.GetDrawing(v);
    EnumDrawingGroup(drawingGroup);
}

// 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 is DrawingGroup group)
        {
            EnumDrawingGroup(group);
        }
        else if (drawing is GeometryDrawing)
        {
            // Perform action based on drawing type.
        }
        else if (drawing is ImageDrawing)
        {
            // Perform action based on drawing type.
        }
        else if (drawing is GlyphRunDrawing)
        {
            // Perform action based on drawing type.
        }
        else if (drawing is VideoDrawing)
        {
            // Perform action based on drawing type.
        }
    }
}

Weitere Informationen