Gráficos y multimedia

2025-05-07

Windows Presentation Foundation (WPF) proporciona compatibilidad con elementos multimedia, gráficos vectoriales, animación y composición de contenido, lo que facilita a los desarrolladores crear interesantes interfaces de usuario y contenido. Con Visual Studio, puede crear gráficos vectoriales o animaciones complejas e integrar elementos multimedia en las aplicaciones.

En este tema se presentan las características gráficas, de animación y multimedia de WPF, que permiten agregar gráficos, efectos de transición, sonido y vídeo a las aplicaciones.

Nota:

No se recomienda encarecidamente usar tipos de WPF en un servicio de Windows. Si intenta usar tipos de WPF en un servicio de Windows, es posible que el servicio no funcione según lo previsto.

Novedades de gráficos y multimedia en WPF 4

Se han realizado varios cambios relacionados con gráficos y animaciones.

Redondeo de maquetación

Cuando el borde de un objeto cae en medio de un píxel, el sistema de gráficos independiente de la resolución puede crear artefactos de renderizado, como bordes borrosos o semitransparentes. Las versiones anteriores de WPF incluían el ajuste de píxeles para ayudar a manejar este caso. Silverlight 2 introdujo el redondeo de diseño, que es otra manera de mover elementos para que los bordes caigan en límites de píxeles enteros. WPF ahora admite el redondeo de los diseños con la propiedad adjunta UseLayoutRounding en FrameworkElement.
Composición almacenada en caché

Mediante el uso de las nuevas BitmapCache clases y BitmapCacheBrush , puede almacenar en caché una parte compleja del árbol visual como mapa de bits y mejorar considerablemente el tiempo de representación. El mapa de bits sigue respondiendo a las interacciones del usuario, como los clics del ratón, y se puede pintar en otros elementos de la misma manera que con cualquier pincel.
Compatibilidad con sombreador de píxeles 3

WPF 4 se basa en la ShaderEffect compatibilidad introducida en WPF 3.5 SP1 al permitir que las aplicaciones escriban efectos mediante sombreador de píxeles (PS) versión 3.0. El modelo de sombreador PS 3.0 es más sofisticado que PS 2.0, lo que permite incluso más efectos en el hardware compatible.
Funciones de aceleración

Puedes mejorar las animaciones con funciones de aceleración, lo que proporciona control adicional sobre el comportamiento de las animaciones. Por ejemplo, puede aplicar un ElasticEase objeto a una animación para dar a la animación un comportamiento de primavera. Para obtener más información, consulte los tipos de aceleración en el System.Windows.Media.Animation espacio de nombres.

Gráficos y representación

WPF incluye compatibilidad con gráficos 2D de alta calidad. La funcionalidad incluye pinceles, geometrías, imágenes, formas y transformaciones. Para obtener más información, vea Gráficos. La representación de elementos gráficos se basa en la Visual clase . El árbol visual describe la estructura de los objetos visuales en la pantalla. Para obtener más información, vea Información general sobre la representación de gráficos de WPF.

Formas 2D

WPF proporciona una biblioteca de formas 2D usadas habitualmente, dibujadas por vectores, como rectángulos y elipses, que se muestran en la ilustración siguiente.

Diagrama que muestra puntos suspensivos y rectángulos.

Estas formas intrínsecas de WPF no son solo formas: son elementos programables que implementan muchas de las características que espera de los controles más comunes, que incluyen teclado y entrada del mouse. En el ejemplo siguiente se muestra cómo controlar el MouseUp evento generado haciendo clic en un Ellipse elemento.

<Window
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  x:Class="Window1" >
  <Ellipse Fill="LightBlue" MouseUp="ellipseButton_MouseUp" />
</Window>

public partial class Window1  : Window
{
    void ellipseButton_MouseUp(object sender, MouseButtonEventArgs e)
    {
        MessageBox.Show("You clicked the ellipse!");
    }
}

Partial Public Class Window1
    Inherits Window
    Private Sub ellipseButton_MouseUp(ByVal sender As Object, ByVal e As MouseButtonEventArgs)
        MessageBox.Show("You clicked the ellipse!")
    End Sub
End Class

En la ilustración siguiente se muestra la salida del código XAML anterior y el código subyacente.

Un cuadro de mensaje que dice

Para obtener más información, vea Formas y dibujo básico en información general de WPF. Para obtener un ejemplo introductorio, vea Ejemplo de elementos de forma.

Geometrías 2D

Cuando las formas 2D que proporciona WPF no son suficientes, puede usar la compatibilidad de WPF con geometrías y rutas de acceso para crear las suyas propias. En la ilustración siguiente se muestra cómo se pueden usar geometrías para crear formas, como pincel de dibujo y para recortar otros elementos de WPF.

Captura de pantalla que muestra cómo puede usar geometrías para crear formas.

Para obtener más información, vea Información general sobre geometría. Para obtener un ejemplo introductorio, vea Ejemplo de geometrías.

Efectos 2D

WPF proporciona una biblioteca de clases 2D que puede usar para crear una variedad de efectos. La capacidad de representación 2D de WPF permite pintar elementos de la interfaz de usuario que tienen degradados, mapas de bits, dibujos y vídeos; y manipularlos mediante giro, escalado y sesgo. En la ilustración siguiente se proporciona un ejemplo de los muchos efectos que se pueden lograr mediante pinceles WPF.

Ilustración en la que se muestran los diferentes pinceles y elementos de pintura de WPF.

Para obtener más información, vea Descripción general de pinceles de WPF. Para obtener un ejemplo introductorio, vea Ejemplo de pinceles.

Representación 3D

WPF proporciona un conjunto de funcionalidades de representación 3D que se integran con la compatibilidad con gráficos 2D en WPF para que pueda crear un diseño, una interfaz de usuario y una visualización de datos más emocionantes. Al final del espectro, WPF le permite representar imágenes 2D en las superficies de formas 3D, que se muestran en la ilustración siguiente.

Captura de pantalla de un ejemplo que muestra formas 3D con diferentes texturas.

Para obtener más información, consulte Información general sobre gráficos 3D. Para ver un ejemplo introductorio, consulte Ejemplo de sólidos 3D.

Animación

Usa animación para hacer que los controles y elementos crezcan, agitan, giran y se desvanezcan; y para crear transiciones de página interesantes, etc. Dado que WPF le permite animar la mayoría de las propiedades, no solo puede animar la mayoría de los objetos WPF, también puede usar WPF para animar objetos personalizados que cree.

Captura de pantalla de un cubo animado.

Para obtener más información, vea Información general sobre animaciones. Para ver un ejemplo introductorio, vea Galería de ejemplos de animación.

Medios de comunicación

Las imágenes, el vídeo y el audio son formas enriquecidas de transmitir información y experiencias de usuario.

Imágenes

Las imágenes, que incluyen iconos, fondos e incluso partes de animaciones, son una parte fundamental de la mayoría de las aplicaciones. Dado que con frecuencia necesita usar imágenes, WPF expone la capacidad de trabajar con ellas de varias maneras. En la ilustración siguiente se muestra solo una de esas maneras.

Captura de pantalla de ejemplo de estilo

Para obtener más información, consulte Información general sobre la creación de imágenes.

Vídeo y audio

Una característica principal de las funcionalidades gráficas de WPF es proporcionar compatibilidad nativa para trabajar con multimedia, que incluye vídeo y audio. En el ejemplo siguiente se muestra cómo insertar un reproductor multimedia en una aplicación.

<MediaElement Source="media\numbers.wmv" Width="450" Height="250" />

MediaElement es capaz de reproducir tanto vídeo como audio, y es lo suficientemente extensible como para permitir la creación sencilla de interfaces de usuario personalizadas.

Para obtener más información, consulta Información general sobre multimedia.