Compartir a través de


Gráficos y multimedia

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

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

NotaNota

Se recomienda encarecidamente no usar los tipos WPF en un servicio de Windows.Si intenta utilizar los tipos WPF en un servicio de Windows, el servicio podría no funcionar como se espera.

Este tema contiene las secciones siguientes.

  • Novedades de gráficos y multimedia en WPF 4
  • Gráficos y representación
  • Representación 3D
  • Animación
  • Multimedia
  • Temas relacionados

Novedades de gráficos y multimedia en WPF 4

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

  • Redondeo del diseño

    Cuando el borde de un objeto cae en medio de un dispositivo de píxel, el sistema de gráficos independiente de los PPP puede crear artefactos de representación, como bordes borrosos o semitransparentes. Las versiones anteriores de WPF incluían el ajuste de píxeles para ayudar a controlar este caso. El redondeo del diseño apareció por primera vez en Silverlight 2 y constituye otra manera de mover los elementos para que los bordes estén dentro de los límites de píxeles completos. WPF proporciona ahora soporte técnico para el redondeo del diseño con la propiedad adjunta UseLayoutRounding en FrameworkElement.

  • Composición almacenada en caché

    Mediante las nuevas clases BitmapCacheBrush y BitmapCache, puede almacenar en memoria caché una parte compleja del árbol visual como un mapa de bits y mejorar considerablemente el tiempo de representación. El mapa de bits sigue siendo sensible a la entrada del usuario, como los clics del mouse, y se puede pintar en otros elementos, igual que cualquier pincel.

  • Compatibilidad con Pixel Shader 3

    WPF 4 aprovecha la compatibilidad con ShaderEffect introducida en WPF 3.5 SP1 y permite a las aplicaciones escribir efectos mediante Pixel Shader (PS) versión 3.0. El modelo del sombreador PS 3.0 es más sofisticado que PS 2.0, que permite realizar aun más efectos en el hardware compatible.

  • Funciones de aceleración

    Puede mejorar las animaciones con funciones de aceleración, que le dan un control adicional sobre el comportamiento de las animaciones. Por ejemplo, puede aplicar ElasticEase a una animación para darle un comportamiento elástico. Para obtener más información, consulte los tipos de aceleración en el espacio de nombres System.Windows.Media.Animation.

Gráficos y representación

WPF incluye compatibilidad con gráficos 2-D de gran 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 los elementos gráficos se basa en la clase Visual. La estructura de los objetos visuales de la pantalla se describe mediante el árbol visual. Para obtener más información, vea Información general sobre la representación de gráficos en WPF.

Formas 2D

WPF proporciona una biblioteca de formas 2-D de uso común, dibujadas mediante vectores, tales como rectángulos y elipses que se muestran en la ilustración siguiente.

Elipses y rectángulos

Estas formas intrínsecas de WPF no son solamente formas: son elementos programables que implementan muchas de las características que se esperan de la mayoría de los controles comunes, incluida la entrada de teclado y mouse. En el siguiente ejemplo se muestra cómo controlar el evento MouseUp generado al hacer clic en un elemento Ellipse.

<Window
  xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="https://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

La ilustración siguiente muestra el resultado del marcado XAML y del código subyacente anterior.

Ventana con el texto "ha hecho clic en la elipse"

Para obtener más información, vea Información general sobre formas y dibujo básico en WPF. Para obtener un ejemplo introductorio, vea Shape Elements Sample.

Geometrías 2D

Cuando las formas 2-D que proporciona WPF no sean suficientes, puede utilizar la compatibilidad de WPF con geometrías y trayectorias para crear formas propias. La ilustración siguiente muestra cómo puede utilizar geometrías para crear formas, como un pincel de dibujo, y para recortar otros elementos de WPF.

Diversos usos de un trayecto

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

Efectos 2D

WPF proporciona una biblioteca de clases 2-D que puede utilizar para crear diversos efectos. La capacidad de presentación 2-D de WPF ofrece la capacidad de dibujar elementos UI con degradados, mapas de bits, dibujos y vídeos; también de manipularlos utilizando giro, escalado y sesgado. La ilustración siguiente proporciona un ejemplo de los muchos efectos que puede lograr utilizando los pinceles de WPF.

Ilustración de diferentes pinceles

Para obtener más información, vea Información general sobre pinceles de WPF. Para obtener un ejemplo introductorio, vea Brushes Sample.

Representación 3D

WPF proporciona un conjunto de capacidades de representación 3-D que se integran con la compatibilidad con gráficos 2-D en WPF para crear interesantes diseños, UI y visualizaciones de datos. En un extremo del espectro, WPF permite representar imágenes 2-D en las superficies de formas 3-D, que se muestran en la siguiente ilustración.

Captura de pantalla de ejemplo Visual3D

Para obtener más información, vea Información general sobre gráficos 3D. Para obtener un ejemplo introductorio, vea 3-D Solids Sample.

Animación

Utilice animaciones para hacer que los controles y los elementos crezcan, se agiten, giren y se desvanezcan, para crear interesantes transiciones de página y para otros efectos. Dado que WPF permite animar la mayoría de las propiedades, no solamente podrá animar la mayoría de los objetos de WPF, sino que también puede utilizar WPF para animar los objetos personalizados que cree.

Imágenes de un cubo animado

Para obtener más información, vea Información general sobre animaciones. Para obtener un ejemplo introductorio, vea Animation Example Gallery.

Multimedia

Las imágenes, el vídeo y el audio son medios multimedia para la difusión de información y experiencias de usuario.

Imágenes

Las imágenes, entre las que se incluyen iconos, fondos e incluso partes de animaciones, son una parte básica de la mayoría de las aplicaciones. Dado que frecuentemente necesitará utilizar imágenes, WPF expone la capacidad de trabajar con ellas de diversas maneras. La ilustración siguiente muestra solamente una de esas maneras.

Captura de pantalla de ejemplo de aplicación de estilos

Para obtener más información, vea Información general sobre imágenes.

Vídeo y audio

Una característica básica de las capacidades gráficas de WPF es la compatibilidad nativa para el trabajo con multimedia, lo que incluye vídeo y audio. El ejemplo siguiente 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 fácil de UIs personalizadas.

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

Vea también

Referencia

System.Windows.Media

System.Windows.Media.Animation

System.Windows.Media.Media3D

Conceptos

Optimizar el rendimiento: Imágenes y gráficos 2D

Información general sobre formas y dibujo básico en WPF

Información general sobre el dibujo con colores sólidos y degradados

Pintar con imágenes, dibujos y elementos visuales

Otros recursos

Animación y temporización

Gráficos 3D

Multimedia

Historial de cambios

Fecha

Historial

Motivo

Diciembre de 2010

Se ha agregado el ejemplo de Visual Basic que faltaba.

Corrección de errores de contenido.