Información general sobre objetos DrawingDrawing Objects Overview

En este tema se presentan Drawing objetos y se describe cómo usarlos para dibujar eficazmente formas, mapas de bits, texto y elementos multimedia.This topic introduces Drawing objects and describes how to use them to efficiently draw shapes, bitmaps, text, and media. Utilice Drawing objetos al crear imágenes prediseñadas, pintar con un DrawingBrusho usar Visual objetos.Use Drawing objects when you create clip art, paint with a DrawingBrush, or use Visual objects.

¿Qué es un objeto Drawing?What Is a Drawing Object?

Un objeto Drawing describe el contenido visible, como una forma, un mapa de bits, un vídeo o una línea de texto.A Drawing object describes visible content, such as a shape, bitmap, video, or a line of text. Distintos tipos de dibujo describen tipos de contenido diferentes.Different types of drawings describe different types of content. La siguiente lista muestra los distintos tipos de objetos de dibujo.The following is a list of the different types of drawing objects.

Drawing objetos son versátiles; Hay muchas maneras de utilizar un objeto de Drawing.Drawing objects are versatile; there are many ways you can use a Drawing object.

WPF ofrece otros tipos de objetos capaces de dibujar formas, mapas de bits, texto y elementos multimedia.WPF provides other types of objects that are capable of drawing shapes, bitmaps, text, and media. Por ejemplo, también puede usar objetos Shape para dibujar formas y el control MediaElement proporciona otra manera de agregar vídeo a la aplicación.For example, you can also use Shape objects to draw shapes, and the MediaElement control provides another way to add video to your application. ¿Cuándo se debe usar Drawing objetos?So when should you use Drawing objects? Cuando se pueden sacrificar características de nivel de marco para obtener ventajas de rendimiento o cuando se necesitan Freezable características.When you can sacrifice framework level features to gain performance benefits or when you need Freezable features. Dado que Drawing objetos no admiten el diseño, la entrada y el foco, proporcionan ventajas de rendimiento que hacen que sean ideales para describir los terrenos, imágenes prediseñadas y dibujos de bajo nivel con objetos Visual.Because Drawing objects lack support for Layout, input, and focus, they provide performance benefits that make them ideal for describing backgrounds, clip art, and for low-level drawing with Visual objects.

Dado que son un tipo Freezable objeto, Drawing objetos obtienen varias características especiales, entre las que se incluyen las siguientes: se pueden declarar como recursos, compartirse entre varios objetos, convertirse en de solo lectura para mejorar el rendimiento, clonarse y realizarse seguro para subprocesos.Because they are a type Freezable object, Drawing objects gain several special features, which include the following: they can be declared as resources, shared among multiple objects, made read-only to improve performance, cloned, and made thread-safe. Para obtener más información sobre las diferentes características proporcionadas por los objetos Freezable, consulte la información general sobre objetos Freezable.For more information about the different features provided by Freezable objects, see the Freezable Objects Overview.

Dibujar una formaDraw a Shape

Para dibujar una forma, se usa un GeometryDrawing.To draw a shape, you use a GeometryDrawing. La propiedad Geometry de un dibujo de geometría describe la forma que se va a dibujar, su propiedad Brush describe cómo se debe pintar el interior de la forma y su propiedad Pen describe cómo debe dibujarse su contorno.A geometry drawing's Geometry property describes the shape to draw, its Brush property describes how the interior of the shape should be painted, and its Pen property describes how its outline should be drawn.

En el ejemplo siguiente se usa un GeometryDrawing para dibujar una forma.The following example uses a GeometryDrawing to draw a shape. La forma se describe mediante un GeometryGroup y dos objetos EllipseGeometry.The shape is described by a GeometryGroup and two EllipseGeometry objects. El interior de la forma se pinta con un LinearGradientBrush y su contorno se dibuja con un PenBlack.The shape's interior is painted with a LinearGradientBrush and its outline is drawn with a Black Pen.

En este ejemplo se crea el siguiente GeometryDrawing.This example creates the following GeometryDrawing.

GeometryDrawing de dos elipsesA GeometryDrawing of two ellipses
GeometryDrawingA 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>

Para obtener el ejemplo completo, vea Create a GeometryDrawing (Cómo: Crear un objeto GeometryDrawing).For the complete example, see Create a GeometryDrawing.

Otras clases de Geometry, como PathGeometry permiten crear formas más complejas creando curvas y arcos.Other Geometry classes, such as PathGeometry enable you to create more complex shapes by creating curves and arcs. Para obtener más información sobre los objetos de Geometry, consulte la información general sobre geometría.For more information about Geometry objects, see the Geometry Overview.

Para obtener más información sobre otras formas de dibujar formas que no usan Drawing objetos, vea información general sobre formas y dibujo básico en WPF.For more information about other ways to draw shapes that don't use Drawing objects, see Shapes and Basic Drawing in WPF Overview.

Dibujar un objeto ImageDraw an Image

Para dibujar una imagen, use un ImageDrawing.To draw an image, you use an ImageDrawing. La propiedad ImageSource de un objeto ImageDrawing describe la imagen que se va a dibujar y su propiedad Rect define la región donde se dibuja la imagen.An ImageDrawing object's ImageSource property describes the image to draw, and its Rect property defines the region where the image is drawn.

En el ejemplo siguiente se dibuja una imagen en un rectángulo situado en (75,75) que ocupa 100 por 100 píxeles.The following example draws an image into a rectangle located at (75,75) that is 100 by 100 pixel. En la ilustración siguiente se muestra el ImageDrawing creado en el ejemplo.The following illustration shows the ImageDrawing created by the example. Se ha agregado un borde gris para mostrar los límites del ImageDrawing.A gray border was added to show the bounds of the ImageDrawing.

Objeto ImageDrawing de 100 por 100 dibujado en (75,75)A 100 by 100 ImageDrawing drawn at (75,75)
ImageDrawing de 100 por 100A 100 by 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"/>

Para más información sobre las imágenes, Información general sobre imágenes.For more information about images, see the Imaging Overview.

Reproducir elementos multimedia (solo código)Play Media (Code Only)

Nota

Aunque puede declarar un VideoDrawing en Lenguaje XAML (Extensible Application Markup Language)Extensible Application Markup Language (XAML), solo puede cargar y reproducir sus medios mediante código.Although you can declare a VideoDrawing in Lenguaje XAML (Extensible Application Markup Language)Extensible Application Markup Language (XAML), you can only load and play its media using code. Para reproducir vídeo en Lenguaje XAML (Extensible Application Markup Language)Extensible Application Markup Language (XAML), use un MediaElement en su lugar.To play video in Lenguaje XAML (Extensible Application Markup Language)Extensible Application Markup Language (XAML), use a MediaElement instead.

Para reproducir un archivo de audio o vídeo, se usa un VideoDrawing y un MediaPlayer.To play an audio or video file, you use a VideoDrawing and a MediaPlayer. Hay dos maneras de cargar y reproducir elementos multimedia.There are two ways to load and play media. La primera es usar una MediaPlayer y una VideoDrawing por sí misma, y la segunda consiste en crear su propio MediaTimeline para usarlo con los MediaPlayer y VideoDrawing.The first is to use a MediaPlayer and a VideoDrawing by themselves, and the second way is to create your own MediaTimeline to use with the MediaPlayer and VideoDrawing.

Nota

Al distribuir elementos multimedia con la aplicación, no puede utilizar un archivo multimedia como recurso del proyecto, como haría con una imagen.When distributing media with your application, you cannot use a media file as a project resource, like you would an image. En el archivo de proyecto, debe establecer en su lugar el tipo de elemento multimedia en Content y establecer CopyToOutputDirectory en PreserveNewest o Always.In your project file, you must instead set the media type to Content and set CopyToOutputDirectory to PreserveNewest or Always.

Para reproducir archivos multimedia sin crear su propio MediaTimeline, realice los pasos siguientes.To play media without creating your own MediaTimeline, you perform the following steps.

  1. Crear un objeto MediaPlayer.Create a MediaPlayer object.

    MediaPlayer player = new MediaPlayer();
    
  2. Use el método Open para cargar el archivo multimedia.Use the Open method to load the media file.

    player.Open(new Uri(@"sampleMedia\xbox.wmv", UriKind.Relative));
    
  3. Creará un control VideoDrawing.Create a VideoDrawing.

    VideoDrawing aVideoDrawing = new VideoDrawing();
    
  4. Especifique el tamaño y la ubicación para dibujar el medio estableciendo la propiedad Rect de la VideoDrawing.Specify the size and location to draw the media by setting the Rect property of the VideoDrawing.

    aVideoDrawing.Rect = new Rect(0, 0, 100, 100);
    
  5. Establezca la propiedad Player de la VideoDrawing con el MediaPlayer que creó.Set the Player property of the VideoDrawing with the MediaPlayer you created.

    aVideoDrawing.Player = player;
    
  6. Use el método Play del MediaPlayer para empezar a reproducir el medio.Use the Play method of the MediaPlayer to start playing the media.

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

En el ejemplo siguiente se usa un VideoDrawing y un MediaPlayer para reproducir un archivo de vídeo una vez.The following example uses a VideoDrawing and a MediaPlayer to play a video file once.

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

Para obtener un control de tiempo adicional sobre los medios, utilice un MediaTimeline con los objetos MediaPlayer y VideoDrawing.To gain additional timing control over the media, use a MediaTimeline with the MediaPlayer and VideoDrawing objects. El MediaTimeline le permite especificar si el vídeo debe repetirse.The MediaTimeline enables you to specify whether the video should repeat. Para usar un MediaTimeline con un VideoDrawing, realice los pasos siguientes:To use a MediaTimeline with a VideoDrawing, you perform the following steps:

  1. Declare el MediaTimeline y establezca sus comportamientos de control de tiempo.Declare the MediaTimeline and set its timing behaviors.

    // Create a MediaTimeline.
    MediaTimeline mTimeline = 
        new MediaTimeline(new Uri(@"sampleMedia\xbox.wmv", UriKind.Relative)); 
    
    // Set the timeline to repeat.
    mTimeline.RepeatBehavior = RepeatBehavior.Forever;
    
  2. Cree una MediaClock a partir de la MediaTimeline.Create a MediaClock from the MediaTimeline.

    // Create a clock from the MediaTimeline.
    MediaClock mClock = mTimeline.CreateClock();
    
  3. Cree una MediaPlayer y utilice el MediaClock para establecer su propiedad Clock.Create a MediaPlayer and use the MediaClock to set its Clock property.

    MediaPlayer repeatingVideoDrawingPlayer = new MediaPlayer();
    repeatingVideoDrawingPlayer.Clock = mClock;
    
  4. Cree un VideoDrawing y asigne el MediaPlayer a la propiedad Player del VideoDrawing.Create a VideoDrawing and assign the MediaPlayer to the Player property of the VideoDrawing.

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

En el ejemplo siguiente se usa un MediaTimeline con un MediaPlayer y un VideoDrawing para reproducir un vídeo repetidamente.The following example uses a MediaTimeline with a MediaPlayer and a VideoDrawing to play a video repeatedly.

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

Tenga en cuenta que, cuando se usa un MediaTimeline, se usa la ClockController interactiva devuelta desde la propiedad Controller del MediaClock para controlar la reproducción multimedia en lugar de los métodos interactivos de MediaPlayer.Note that, when you use a MediaTimeline, you use the interactive ClockController returned from the Controller property of the MediaClock to control media playback instead of the interactive methods of MediaPlayer.

Dibujar textoDraw Text

Para dibujar texto, se usa un GlyphRunDrawing y un GlyphRun.To draw text, you use a GlyphRunDrawing and a GlyphRun. En el ejemplo siguiente se usa un GlyphRunDrawing para dibujar el texto "Hola mundo".The following example uses a GlyphRunDrawing to draw the text "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>

Un GlyphRun es un objeto de bajo nivel diseñado para su uso con escenarios de impresión y presentación de documentos de formato fijo.A GlyphRun is a low-level object intended for use with fixed-format document presentation and print scenarios. Una manera más sencilla de dibujar texto en la pantalla es usar un Label o un TextBlock.A simpler way to draw text to the screen is to use a Label or a TextBlock. Para obtener más información acerca de GlyphRun, vea la Introducción al objeto GlyphRun y al elemento glyphs .For more information about GlyphRun, see the Introduction to the GlyphRun Object and Glyphs Element overview.

Dibujos compuestosComposite Drawings

Un DrawingGroup permite combinar varios dibujos en un solo dibujo compuesto.A DrawingGroup enables you to combine multiple drawings into a single composite drawing. Mediante el uso de un DrawingGroup, puede combinar formas, imágenes y texto en un solo Drawing objeto.By using a DrawingGroup, you can combine shapes, images, and text into a single Drawing object.

En el ejemplo siguiente se usa un DrawingGroup para combinar dos objetos GeometryDrawing y un objeto ImageDrawing.The following example uses a DrawingGroup to combine two GeometryDrawing objects and an ImageDrawing object. Este ejemplo produce el siguiente resultado:This example produces the following output.

DrawingGroup con varios dibujosA DrawingGroup with multiple drawings
Un dibujo compuestoA composite drawing

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

Un DrawingGroup también le permite aplicar máscaras de opacidad, transformaciones, efectos de imagen y otras operaciones a su contenido.A DrawingGroup also enables you to apply opacity masks, transforms, bitmap effects, and other operations to its contents. las operaciones de DrawingGroup se aplican en el orden siguiente: OpacityMask, Opacity, BitmapEffect, ClipGeometry, GuidelineSety Transform.DrawingGroup operations are applied in the following order: OpacityMask, Opacity, BitmapEffect, ClipGeometry, GuidelineSet, and then Transform.

En la ilustración siguiente se muestra el orden en que se aplican las operaciones de DrawingGroup.The following illustration shows the order in which DrawingGroup operations are applied.

Orden de las operaciones de DrawingGroupDrawingGroup order of operations
Orden de las operaciones de DrawingGroupOrder of DrawingGroup operations

En la tabla siguiente se describen las propiedades que se pueden utilizar para manipular el contenido de un objeto DrawingGroup.The following table describes the properties you can use to manipulate a DrawingGroup object's contents.

Propiedad.Property DescripciónDescription IlustraciónIllustration
OpacityMask Modifica la opacidad de las partes seleccionadas del contenido del DrawingGroup.Alters the opacity of selected portions of the DrawingGroup contents. Para obtener un ejemplo, vea How to: Control the Opacity of a Drawing (Cómo: Controlar la opacidad de un dibujo).For an example, see How to: Control the Opacity of a Drawing. DrawingGroup con una máscara de opacidadA DrawingGroup with an opacity mask
Opacity Cambia uniformemente la opacidad del contenido del DrawingGroup.Uniformly changes the opacity of the DrawingGroup contents. Utilice esta propiedad para hacer que un Drawing sea transparente o parcialmente transparente.Use this property to make a Drawing transparent or partially transparent. Para obtener un ejemplo, vea How to: Apply an Opacity Mask to a Drawing (Cómo: Aplicar una máscara de opacidad a un dibujo).For an example, see How to: Apply an Opacity Mask to a Drawing. DrawingGroups con diferentes valores de opacidadDrawingGroups with different opacity settings
BitmapEffect Aplica un BitmapEffect al contenido del DrawingGroup.Applies a BitmapEffect to the DrawingGroup contents. Para obtener un ejemplo, vea How to: Apply a BitmapEffect to a Drawing (Cómo: Aplicar un objeto BitmapEffect a un dibujo).For an example, see How to: Apply a BitmapEffect to a Drawing. DrawingGroup con un BlurBitmapEffectDrawingGroup with a BlurBitmapEffect
ClipGeometry Recorta el contenido de la DrawingGroup a una región que se describe mediante un Geometry.Clips the DrawingGroup contents to a region you describe using a Geometry. Para obtener un ejemplo, vea How to: Clip a Drawing (Cómo: Recortar un dibujo).For an example, see How to: Clip a Drawing . DrawingGroup con una región de recorte definidaDrawingGroup with a defined clip region
GuidelineSet Ajusta los píxeles independientes del dispositivo a los píxeles del dispositivo según las directrices especificadas.Snaps device independent pixels to device pixels along the specified guidelines. Esta propiedad resulta útil para garantizar que los gráficos muy detallados se representan nítidamente en pantallas de baja resolución.This property is useful for ensuring that finely detailed graphics render sharply on low-DPI displays. Para obtener un ejemplo, vea Apply a GuidelineSet to a Drawing (Aplicar un objeto GuidelineSet a un dibujo).For an example, see Apply a GuidelineSet to a Drawing. DrawingGroup con y sin objeto GuidelineSetA DrawingGroup with and without a GuidelineSet
Transform Transforma el contenido de la DrawingGroup.Transforms the DrawingGroup contents. Para obtener un ejemplo, vea How to: Apply a Transform to a Drawing (Cómo: Aplicar una transformación a un dibujo).For an example, see How to: Apply a Transform to a Drawing. DrawingGroup giradoA rotated DrawingGroup

Mostrar un dibujo como imagenDisplay a Drawing as an Image

Para mostrar un Drawing con un control Image, utilice un DrawingImage como Source del control Image y establezca la propiedad DrawingImage del objeto DrawingImage.Drawing en el dibujo que desea mostrar.To display a Drawing with an Image control, use a DrawingImage as the Image control's Source and set the DrawingImage object's DrawingImage.Drawing property to the drawing you want to display.

En el ejemplo siguiente se usa un DrawingImage y un control Image para mostrar un GeometryDrawing.The following example uses a DrawingImage and an Image control to display a GeometryDrawing. Este ejemplo produce el siguiente resultado:This example produces the following output.

GeometryDrawing de dos elipsesA GeometryDrawing of two ellipses
DrawingImageA 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>

Pintar un objeto con un dibujoPaint an Object with a Drawing

Un DrawingBrush es un tipo de pincel que pinta un área con un objeto de dibujo.A DrawingBrush is a type of brush that paints an area with a drawing object. Puede usarlo para pintar casi cualquier objeto gráfico con un dibujo.You can use it to paint just about any graphical object with a drawing. La propiedad Drawing de una DrawingBrush describe su Drawing.The Drawing property of a DrawingBrush describes its Drawing. Para representar un Drawing con un DrawingBrush, agréguelo al pincel mediante la propiedad Drawing del pincel y use el pincel para pintar un objeto gráfico, como un control o un panel.To render a Drawing with a DrawingBrush, add it to the brush using the brush's Drawing property and use the brush to paint a graphical object, such as a control or panel.

En los ejemplos siguientes se usa un DrawingBrush para pintar el Fill de una Rectangle con un patrón creado a partir de un GeometryDrawing.The following examples uses a DrawingBrush to paint the Fill of a Rectangle with a pattern created from a GeometryDrawing. Este ejemplo produce el siguiente resultado:This example produces the following output.

DrawingBrush en mosaicoA tiled DrawingBrush
Uso de GeometryDrawing con un objeto DrawingBrushA GeometryDrawing used with a 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="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>

La clase DrawingBrush proporciona una variedad de opciones para ajustar y segmentar su contenido.The DrawingBrush class provides a variety of options for stretching and tiling its content. Para obtener más información sobre DrawingBrush, consulte la información general sobre el dibujo con imágenes, dibujos y objetos visuales .For more information about DrawingBrush, see the Painting with Images, Drawings, and Visuals overview.

Representar un dibujo con un objeto VisualRender a Drawing with a Visual

Un DrawingVisual es un tipo de objeto visual diseñado para representar un dibujo.A DrawingVisual is a type of visual object designed to render a drawing. Una posibilidad para los desarrolladores que quieran crear un entorno gráfico muy personalizado es trabajar directamente en la capa visual, que no se describe en esta información general.Working directly at the visual layer is an option for developers who want to build a highly customized graphical environment, and is not described in this overview. Para más información, consulte la página de información general Usar objetos DrawingVisual.For more information, see the Using DrawingVisual Objects overview.

Objetos DrawingContextDrawingContext Objects

La clase DrawingContext le permite rellenar un Visual o un Drawing con contenido visual.The DrawingContext class enables you to populate a Visual or a Drawing with visual content. Muchos objetos gráficos de nivel inferior usan una DrawingContext porque describe el contenido gráfico de forma muy eficaz.Many such lower-level graphics objects use a DrawingContext because it describes graphical content very efficiently.

Aunque los métodos de DrawingContext Draw parecen similares a los métodos de dibujo del tipo System.Drawing.Graphics, son realmente diferentes.Although the DrawingContext draw methods appear similar to the draw methods of the System.Drawing.Graphics type, they are actually very different. DrawingContext se usa con un sistema de gráficos de modo retenido, mientras que el tipo de System.Drawing.Graphics se usa con un sistema de gráficos de modo inmediato.DrawingContext is used with a retained mode graphics system, while the System.Drawing.Graphics type is used with an immediate mode graphics system. Cuando se usa el comando Draw de un objeto DrawingContext, en realidad se almacena un conjunto de instrucciones de representación (aunque el mecanismo de almacenamiento exacto depende del tipo de objeto que proporciona el DrawingContext) que se utilizará posteriormente en el sistema de gráficos. no está dibujando en la pantalla en tiempo real.When you use a DrawingContext object's draw commands, you are actually storing a set of rendering instructions (although the exact storage mechanism depends on the type of object that supplies the DrawingContext) that will later be used by the graphics system; you are not drawing to the screen in real-time. Para obtener más información sobre cómo funciona el sistema de gráficos de Windows Presentation Foundation (WPF), consulte información general sobre la representación de gráficos en WPF.For more information about how the Windows Presentation Foundation (WPF) graphics system works, see the WPF Graphics Rendering Overview.

Nunca se crean instancias de un DrawingContextdirectamente; sin embargo, puede adquirir un contexto de dibujo de determinados métodos, como DrawingGroup.Open y DrawingVisual.RenderOpen.You never directly instantiate a DrawingContext; you can, however, acquire a drawing context from certain methods, such as DrawingGroup.Open and DrawingVisual.RenderOpen.

Enumerar el contenido de un objeto VisualEnumerate the Contents of a Visual

Además de sus otros usos, los objetos Drawing también proporcionan un modelo de objetos para enumerar el contenido de un Visual.In addition to their other uses, Drawing objects also provide an object model for enumerating the contents of a Visual.

En el ejemplo siguiente se usa el método GetDrawing para recuperar el valor DrawingGroup de un Visual y enumerarlo.The following example uses the GetDrawing method to retrieve the DrawingGroup value of a Visual and enumerate it.

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

Vea tambiénSee also