Freigeben über


Übersicht über Zeichnungsobjekte

In diesem Thema werden Drawing-Objekte eingeführt. Außerdem wird gezeigt, wie mit ihnen Formen, Bitmaps, Text und Medien effizient gezeichnet werden. Verwenden Sie Drawing-Objekte, wenn Sie ClipArt erstellen, mit einem DrawingBrush zeichnen oder Visual-Objekte verwenden.

Dieses Thema enthält folgende Abschnitte.

  • Was ist ein Zeichnungsobjekt?
  • Zeichnen einer Form
  • Zeichnen eines Bilds
  • Wiedergeben von Medien (Nur Code)
  • Zeichnen von Text
  • Zusammengesetzte Zeichnungen
  • Anzeigen einer Zeichnung als Bild
  • Zeichnen eines Objekts mithilfe einer Zeichnung
  • Rendern einer Zeichnung mit einem visuellen Element
  • DrawingContext-Objekte
  • Auflisten der Inhalte eines visuellen Objekts
  • Verwandte Abschnitte

Was ist ein Zeichnungsobjekt?

Ein Drawing-Objekt beschreibt sichtbaren Inhalt, z. B. eine Form, Bitmap, ein Video oder eine Textzeile. Die verschiedenen Zeichnungstypen beschreiben unterschiedliche Inhaltstypen. Die folgende Liste enthält die verschiedenen Typen von Zeichnungsobjekten.

  • GeometryDrawing – Zeichnet eine Form.

  • ImageDrawing – Zeichnet ein Bild.

  • GlyphRunDrawing – Zeichnet Text.

  • VideoDrawing – Gibt eine Audio- oder Videodatei wieder.

  • DrawingGroup – Zeichnet andere Zeichnungen. Verwenden Sie eine Zeichnungsgruppe, um aus anderen Zeichnungen eine einzelne zusammengesetzte Zeichnung zu bilden.

Drawing-Objekte sind vielseitig. Es gibt viele Möglichkeiten, wie Sie ein Drawing-Objekt verwenden können.

  • 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, z. B. den Background einer Page.

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

  • Sie können es verwenden, um die Inhalte eines Visual-Objekts aufzulisten.

WPF stellt andere Objekttypen bereit, mit denen sich Formen, Bitmaps, Text und Medien zeichnen lassen. Zum Beispiel können Sie auch mit Shape-Objekten Formen zeichnen, und das MediaElement-Steuerelement bietet eine andere Möglichkeit, der Anwendung Videofunktionen hinzuzufügen. Wann also sollten Sie Drawing-Objekte verwenden? Wenn Sie Features auf Frameworkebene zugunsten von Leistungsvorteilen opfern können oder wenn Sie Freezable-Features benötigen. Da Drawing-Objekte Layoutsystem, Eingabe und Fokus nicht unterstützen, bieten Sie Leistungsvorteile, aufgrund deren sie sich perfekt für die Beschreibung von Hintergründen und ClipArt sowie das Zeichnen auf niedriger Ebene mit Visual-Objekten eignen.

Da sie den Typ Freezable aufweisen, erhalten Drawing-Objekte mehrere spezielle Features. Dazu zählt, dass sie als Ressourcen deklariert, von mehreren Objekten gleichzeitig verwendet, für eine höhere Leistung als schreibgeschützt definiert, geklont und als threadsicher festgelegt werden können. Weitere Informationen über die verschiedenen von Freezable-Objekten bereitgestellten Features finden Sie unter Übersicht über Freezable-Objekte.

Zeichnen einer Form

Um eine Form zu zeichnen, verwenden Sie eine GeometryDrawing. Die Geometry-Eigenschaft einer Geometriezeichnung beschreibt die zu zeichnende Form, die Brush-Eigenschaft beschreibt, wie das Innere der Form zu zeichnen ist, und die Pen-Eigenschaft beschreibt, wie die Kontur zu zeichnen ist.

Im folgenden Beispiel wird mithilfe einer GeometryDrawing eine Form gezeichnet. Die Form wird von einer GeometryGroup und zwei EllipseGeometry-Objekten beschrieben. Das Innere der Form wird mit einem LinearGradientBrush, die Kontur mit einem Black Pen gezeichnet.

In diesem Beispiel wird die folgende GeometryDrawing erstellt.

Eine GeometryDrawing

Eine GeometryDrawing von zwei Ellipsen

//
// 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 Gewusst wie: Erstellen einer GeometryDrawing.

Mit anderen Geometry-Klassen, z. B. PathGeometry, können Sie komplexere Formen erzeugen, indem Sie Kurven und Bögen erstellen. Weitere Informationen über Geometry-Objekte finden Sie unter Übersicht über die Geometrie.

Weitere Informationen über andere Möglichkeiten zum Zeichnen von Formen, die ohne Drawing-Objekte auskommen, finden Sie unter Übersicht über Formen und die grundlegenden Funktionen zum Zeichnen in WPF.

Zeichnen eines Bilds

Um ein Bild zu zeichnen, verwenden Sie eine ImageDrawing. Die ImageSource-Eigenschaft eines ImageDrawing-Objekts beschreibt das zu zeichnende Bild, und die Rect-Eigenschaft definiert den Bereich, in dem das Bild gezeichnet wird.

Im folgenden Beispiel wird an der Position (75,75) ein Bild, das 100 x 100 Pixel groß ist, in ein Rechteck gezeichnet. In der folgenden Abbildung wird die durch das Beispiel erstellte ImageDrawing dargestellt. Es wurde ein grauer Rahmen hinzugefügt, um die Grenzen der ImageDrawing anzuzeigen.

ImageDrawing mit einer Größe von 100 x 100

Eine bei (75,75) gezeichnete 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 über Bilder finden Sie unter Übersicht über die Bildverarbeitung.

Wiedergeben von Medien (Nur Code)

HinweisHinweis

Sie können zwar in Extensible Application Markup Language (XAML) eine VideoDrawing deklarieren, aber Sie können die zugehörigen Medien nur mithilfe von Code laden und wiedergeben.Um Videos in Extensible Application Markup Language (XAML) wiederzugeben, verwenden Sie stattdessen ein MediaElement.

Um eine Audio- oder Videodatei wiederzugeben, verwenden Sie eine VideoDrawing und einen MediaPlayer. Es gibt zwei Möglichkeiten, Medien zu laden und wiederzugeben. Sie können entweder einen MediaPlayer und eine VideoDrawing alleine verwenden, oder Sie erstellen eine eigene MediaTimeline und setzen diese zusammen mit dem MediaPlayer und der VideoDrawing ein.

HinweisHinweis

Wenn Sie Medien mit der Anwendung verteilen, können Sie eine Mediendatei, im Gegensatz zu einem Bild, nicht als Projektressource verwenden.Sie müssen stattdessen in der Projektdatei den Medientyp auf Content und CopyToOutputDirectory auf PreserveNewest oder Always festlegen.

Um Medien wiederzugeben, ohne eine eigene MediaTimeline zu erstellen, führen Sie die folgenden Schritte aus.

  1. Erstellen eines MediaPlayer-Objekts

    MediaPlayer player = new MediaPlayer();
    
  2. Laden Sie die Mediendatei mithilfe der Open-Methode.

    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 den Speicherort zum Zeichnen der Medien 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 mit dem MediaPlayer, den Sie erstellt haben, fest.

    aVideoDrawing.Player = player;
    
  6. Beginnen Sie die Medienwiedergabe mithilfe der Play-Methode des MediaPlayer.

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

Im folgenden Beispiel wird eine Videodatei mit einer VideoDrawing und einem MediaPlayer einmal wiedergegeben.

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

Um eine zusätzliche Zeitsteuerungskontrolle über die Medien zu erhalten, verwenden Sie eine MediaTimeline mit dem MediaPlayer-Objekt und dem VideoDrawing-Objekt. Mit der MediaTimeline können Sie angeben, ob das Video erneut wiedergegeben werden soll. Um eine MediaTimeline mit einer VideoDrawing zu verwenden, führen Sie die folgenden Schritte aus:

  1. Deklarieren Sie die MediaTimeline, und legen Sie das Zeitsteuerungsverhalten 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 legen Sie dessen Clock-Eigenschaft mithilfe der MediaClock fest.

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

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

Im folgenden Beispiel wird mithilfe einer MediaTimeline, einem MediaPlayer und einer VideoDrawing ein Video wiederholt abgespielt.

//
// 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 bei der Verwendung einer MediaTimeline statt der interaktiven Methoden von MediaPlayer den interaktiven ClockController verwenden, der von der Controller-Eigenschaft der MediaClock zurückgegeben wird, um die Medienwiedergabe zu steuern.

Zeichnen von Text

Um Text zu zeichnen, verwenden Sie GlyphRunDrawing und GlyphRun. Im folgenden Beispiel wird mithilfe von GlyphRunDrawing der Text "Hello World" gezeichnet.

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 für die Darstellung von Dokumenten mit festem Format und für Druckszenarios. Eine einfachere Möglichkeit zum Zeichnen von Text auf dem Bildschirm ist die Verwendung eines Label-Elements oder eines TextBlock-Elements. Weitere Informationen über 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 zu einer einzigen zusammengesetzten Zeichnung zusammenfassen. Mit einer DrawingGroup können Sie Formen, Bilder und Text zu einem einzigen Drawing-Objekt zusammenfassen.

Im folgenden Beispiel werden mit einer DrawingGroup zwei GeometryDrawing-Objekte und ein ImageDrawing-Objekt zusammengefasst. Folgende Ergebnisse werden zurückgegeben:

Eine zusammengesetzte Zeichnung

Eine DrawingGroup mit mehreren Zeichnungen

            //
            // 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 außerdem Durchlässigkeitsmasken, Transformationen, 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 angewendet werden.

Reihenfolge von DrawingGroup-Vorgängen

DrawingGroup-Reihenfolge der Vorgänge

In der folgenden Tabelle werden die Eigenschaften beschrieben, mit denen Sie die Inhalte eines DrawingGroup-Objekts bearbeiten können.

Eigenschaft

Beschreibung

Darstellung

OpacityMask

Ändert die Durchlässigkeit von ausgewählten Teilen der DrawingGroup-Inhalte. Ein Beispiel finden Sie unter Gewusst wie: Steuern der Durchlässigkeit einer Zeichnung.

Eine DrawingGroup mit einer Deckkraftmaske

Opacity

Ändert die Durchlässigkeit der DrawingGroup-Inhalte gleichmäßig. Mit dieser Eigenschaft können Sie eine Drawing transparent oder teilweise transparent erscheinen lassen. Ein Beispiel finden Sie unter Gewusst wie: Anwenden einer Durchlässigkeitsmaske auf eine Zeichnung.

DrawingGroups mit unterschiedlichen Deckkrafteinstellungen

BitmapEffect

Wendet einen BitmapEffect auf die DrawingGroup-Inhalte an. Ein Beispiel finden Sie unter Gewusst wie: Anwenden von Bitmapeffekten auf eine Zeichnung.

DrawingGroup mit einem BlurBitmapEffect

ClipGeometry

Schneidet die DrawingGroup-Inhalte für einen Bereich aus, den Sie mit einer Geometry beschreiben. Ein Beispiel finden Sie unter Gewusst wie: Beschneiden einer Zeichnung.

DrawingGroup mit einem definierten Clip-Bereich

GuidelineSet

Richtet geräteunabhängige Pixel anhand der angegebenen Richtlinien an Gerätepixeln aus. Diese Eigenschaft ist hilfreich, um sicherzustellen, dass detailreiche Grafiken auf niedrigauflösenden Bildschirmen scharf gerendert werden. Ein Beispiel finden Sie unter Gewusst wie: Anwenden eines Führungsliniensatzes auf eine Zeichnung.

Eine DrawingGroup mit und ohne ein GuidelineSet

Transform

Transformiert die DrawingGroup-Inhalte. Ein Beispiel finden Sie unter Gewusst wie: Anwenden einer Transformation auf eine Zeichnung.

Eine gedrehte DrawingGroup

Anzeigen einer Zeichnung als Bild

Um eine Drawing mit einem Image-Steuerelement anzuzeigen, verwenden Sie ein DrawingImage als Source für das Image-Steuerelement, und legen Sie die DrawingImage.Drawing-Eigenschaft des DrawingImage-Objekts auf die anzuzeigende Zeichnung fest.

Im folgenden Beispiel wird mit einem DrawingImage und einem Image-Steuerelement eine GeometryDrawing angezeigt. Folgende Ergebnisse werden zurückgegeben:

Ein DrawingImage

Eine GeometryDrawing von zwei Ellipsen

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>

Zeichnen eines Objekts mithilfe einer Zeichnung

Ein DrawingBrush ist ein Pinseltyp, der einen Bereich mithilfe eines Zeichnungsobjekts zeichnet. Sie können ihn verwenden, um so gut wie jedes grafische Objekt mithilfe einer Zeichnung zu zeichnen. Die Drawing-Eigenschaft von einem DrawingBrush beschreibt dessen Drawing. Um eine Drawing mit einem DrawingBrush zu rendern, fügen Sie sie dem Pinsel mithilfe dessen Drawing-Eigenschaft hinzu, und zeichnen Sie mit dem Pinsel ein grafisches Objekt, z. B. ein Steuerelement oder einen Bereich.

Im folgenden Beispiel wird mit einem DrawingBrush die Fill für ein Rectangle mit einem Muster gezeichnet, das aus einer GeometryDrawing erstellt wurde. Folgende Ergebnisse werden zurückgegeben:

Eine mit einem DrawingBrush verwendete GeometryDrawing

Ein gekachelter 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>

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

Rendern einer Zeichnung mit einem visuellen Element

Ein DrawingVisual ist ein visueller Objekttyp, der dazu dient, eine Zeichnung zu rendern. Das direkte Arbeiten auf der visuellen Ebene ist eine Option für Entwickler, die eine stark angepasste grafische Umgebung erstellen möchten. Diese Option wird in dieser Übersicht nicht beschrieben. Weitere Informationen finden Sie in der Übersicht über Verwenden von DrawingVisual-Objekten.

DrawingContext-Objekte

Mit der DrawingContext-Klasse können Sie ein Visual-Element oder eine Drawing mit visuellem Inhalt auffüllen. Viele solcher Grafikobjekte auf niedrigerer Ebene verwenden einen DrawingContext, da hiermit grafische Inhalte sehr effizient beschrieben werden.

Auch wenn die DrawingContext-Zeichnungsmethoden den Zeichnungsmethoden vom Typ System.Drawing.Graphics zu ähneln scheinen, sind sie doch sehr verschieden. DrawingContext wird in einem Grafiksystem mit Speichermodus verwendet, während der System.Drawing.Graphics-Typ in einem Grafiksystem mit unmittelbarem Modus verwendet wird. Wenn Sie die Zeichnungsbefehle des DrawingContext-Objekts verwenden, speichern Sie einen Satz von Renderinganweisungen (wenn auch 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 dem Bildschirm. Weitere Informationen über die Funktionsweise des Windows Presentation Foundation (WPF)-Grafiksystems finden Sie unter Übersicht über das WPF-Grafikrendering.

Ein DrawingContext wird niemals direkt instanziiert. Sie können jedoch mit bestimmten Methoden, z. B. DrawingGroup.Open und DrawingVisual.RenderOpen, einen Zeichnungskontext abrufen.

Auflisten der Inhalte eines visuellen Objekts

Neben ihren anderen Verwendungszwecken stellen die Drawing-Objekte auch ein Objektmodell für die Auflistung der Inhalte von einem Visual bereit.

Im folgenden Beispiel wird mit der GetDrawing-Methode der DrawingGroup-Wert von einem Visual abgerufen und aufgelistet.

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

Siehe auch

Referenz

Drawing

DrawingGroup

Konzepte

Optimieren der Leistung: 2D-Grafiken und Bildverarbeitung

Zeichnen mit Bildern, Zeichnungen und visuellen Elementen

Übersicht über die Geometrie

Übersicht über Formen und die grundlegenden Funktionen zum Zeichnen in WPF

Übersicht über das WPF-Grafikrendering

Übersicht über Freezable-Objekte

Weitere Ressourcen

Gewusst-wie-Themen zu Zeichnungen