Tutorial de WPF para principiantes

⚡ Resumen inteligente

WPF (Windows Presentación Foundation) es Microsoftmarco de trabajo para construir riqueza Windows Aplicaciones de escritorio. Los principiantes aprenderán cómo XAML, el enlace de datos y los gráficos acelerados por hardware se combinan para crear interfaces de usuario escalables y visualmente atractivas con menos código.

  • 🧭 Zapata: WPF es un marco de interfaz de usuario basado en vectores y con tecnología DirectX dentro de la plataforma .NET.
  • ???? Marcado XAML: La sintaxis XML declarativa separa el diseño de la interfaz de la lógica de negocio de C#.
  • 🧱 Architectura: PresentationFramework, PresentationCore y Milcore cooperan por encima de DirectX para la renderización.
  • 🔗 El enlace de datos: El enlace integrado conecta los controles con las fuentes de datos y potencia el patrón MVVM.
  • 🛠️ Inicio práctico: Las plantillas de Visual Studio te permiten crear y ejecutar tu primera aplicación WPF en siete pasos.
  • 🚀 Relevancia moderna: WPF es de código abierto y viene incluido con .NET 10 bajo soporte a largo plazo.

Tutorial de WPF para principiantes

¿Qué es WPF?

WPF es un marco para construir Windows aplicaciones que permiten a los desarrolladores crear interfaces de usuario ricas con animaciones 3D y colores intensos utilizando una menor complejidad de código. Es un motor de renderizado basado en vectores que utiliza la aceleración de hardware de las tarjetas gráficas modernas, lo que hace que la interfaz de usuario sea más rápida y altamente escalable. WPF significa Windows Presentación Foundation.

WPF puede considerarse una evolución de WinForms. Proporciona un sistema de visualización gráfica fácil de usar para Windows y ofrece una clara separación entre la interfaz de usuario y la lógica de negocio.

Las aplicaciones WPF se suelen implementar como programas de escritorio independientes, y también pueden alojarse como objetos integrados en otras aplicaciones.

¿Por qué WPF?

Existen muchas razones para utilizar la plataforma WPF. Algunas de las más destacadas son:

  • Una plataforma ideal para usar si necesita trabajar con varios tipos de medios
  • WPF te permite crear una interfaz de usuario con temas personalizados. También te ayuda cuando necesitas cargar una parte de la interfaz de usuario o quieres vincular datos XML.
  • Le permite aprovechar la gran biblioteca de clases .NET tal como está construida .NET
  • Independencia de la resolución, por lo que las aplicaciones desarrolladas con WPF pueden ejecutarse en pantallas pequeñas de tabletas o en un monitor de 20 pulgadas.
  • WPF se basa en DirectX en lugar de WinAPI. Utiliza el sistema gráfico del equipo cliente, ofreciendo así una mayor potencia de renderizado gráfico.
  • Admite un modelo de documento de flujo que permite una calidad de maquetación propia de la autoedición.
  • La apariencia y el comportamiento están débilmente acoplados. Esto permite a los diseñadores y desarrolladores trabajar en dos modelos separados.
  • En el entorno WPF, puedes diseñar herramientas gráficamente utilizando documentos XML sencillos en lugar de analizar código.
  • Le permite utilizar la aceleración de hardware para dibujar la GUI, para un mejor rendimiento

A continuación, veamos cómo ha evolucionado el marco a lo largo del tiempo.

Historia de WPF

Windows 1.0 fue el primer entorno GUI de MicrosoftFuncionaba como una capa superpuesta a DOS, utilizando los sistemas GDI y USER para los gráficos y la interfaz de usuario.

DirectX se presentó en 1995 como un sistema gráfico de alto rendimiento destinado a juegos y otros entornos relacionados con los gráficos. A lo largo de los años, se lanzaron muchas versiones, y DirectX 9 proporcionó una biblioteca que podía utilizarse con código .NET administrado.

versión WPF Año de lanzamiento Versión .Net Versión de Visual Studio Caracteristicas
3.0 2006 3.0 N/A Versión inicial.
Sin embargo, el desarrollo de WPF se puede realizar con VS 2005.
3.5 2007 3.5 contra 2008 Modificación y mejoras en:
Modelo de aplicación, vinculación, controles, documentos, anotaciones y elementos de interfaz de usuario 3D.
3.5 SP1 2008 3.5 SP1 N/A Soporte de pantalla de presentación nativa. Nuevo control del navegador web, compatibilidad con sombreadores de píxeles DirectX.
4.0 2010 4.0 contra 2010 Nuevos controles: Calendario, DataGrid, DatePicker. Compatibilidad con multitáctil y manipulación.
4.5 2012 4.5 contra 2012 Inicio más rápido, rendimiento mejorado al mostrar grandes conjuntos de datos.
Nuevo control Ribbon e interfaz INotifyDataErrorInfo para la validación de datos.
4.5.1 2013 4.5.1 contra 2013 Pequeñas mejoras en el rendimiento y la fiabilidad.
4.5.2 2014 4.5.2 NA Sin cambios importantes
4.6 2015 4.6 contra 2015 Soporte de ventana infantil transparente
Mejoras HDPI y táctiles
4.8 2019 4.8 contra 2019 Última versión principal de .NET Framework, con correcciones para pantallas de alta resolución y mejoras de accesibilidad.
.NET Core 3.0 en adelante 2019-presente .NET Core 3.0 a .NET 10 VS 2019/2022 WPF se convierte en código abierto y se incluye con .NET moderno (las aplicaciones permanecen Windows-solo).

WPF ya no se versiona por separado de .NET. Desde 2019, se distribuye como un componente de código abierto de la plataforma .NET moderna, y la versión actual está incluida en .NET 10, que se lanzó en noviembre de 2025 como una versión de soporte a largo plazo (LTS).

Características de WPF

El diagrama que aparece a continuación agrupa las principales funcionalidades de WPF, que se detallan más adelante.

Características de WPF
Características de WPF
  • Documentos e impresión
  • Seguridad, accesibilidad y localización
  • Ofrece interoperabilidad con Windows Controles de formularios
  • Direct3D se utiliza en aplicaciones gráficas donde el rendimiento es importante
  • Utiliza el hardware de la tarjeta de video para renderizar.
  • Los gráficos vectoriales permiten escalar la aplicación sin pérdida de calidad.
  • WPF admite un sistema de píxeles lógicos de punto flotante y color ARGB de 32 bits.
  • Redefinir estilos y plantillas de control
  • Creación de fuentes internacionales a partir de fuentes compuestas
  • La representación de texto en WPF aprovecha la tecnología ClearType.
  • Le permite utilizar la técnica de almacenamiento en caché de texto pre-renderizado en la memoria de video.
  • Enfoque basado en recursos para cada control.
  • Los temporizadores de presentación son inicializados y administrados por WPF
  • También se admite la relación entre vídeo y animación.
  • En WPF, un estilo es un conjunto de propiedades que deben aplicarse al contenido utilizado para la representación visual.
  • Las plantillas en WPF te ayudan a cambiar la interfaz de usuario de tu documento.
  • Los comandos son más absolutostract y versión débilmente acoplada de eventos
  • La compatibilidad con comandos de WPF reduce la cantidad de código que necesitamos escribir

Siguiente en este WPF Tutorial de C #Aprenderemos sobre los tipos principales y la infraestructura de WPF.

Tipos de núcleos e infraestructuras de WPF

Las clases en WPF se dividen en cuatro tipos diferentes:

  • Elemento de interfaz de usuario
  • MarcoElemento
  • elemento de contenido
  • Elemento de contenido del marco

Estas clases se conocen como clases de elementos base. Proporcionan la base para un modelo de composición de interfaces de usuario.

Las interfaces de usuario de WPF se componen de elementos que se organizan en una jerarquía de árbol denominada árbol de elementos. El árbol de elementos es una forma intuitiva de diseñar interfaces de usuario y es la estructura que permite obtener potentes servicios de interfaz de usuario.

XAML

El lenguaje de marcado de aplicaciones extensible, también conocido como "XAML" (que se pronuncia "zammel"), es una forma declarativa de definir interfaces de usuario.

Aquí está la definición XAML de un botón simple:

<Button
FontSize="16"
HorizontalAlignment="Center"
VerticalAlignment="Center"
>
Say Hello Guru99</Button>

Ventajas de utilizar el lenguaje XAML:

  • XAML separa la apariencia del front-end de la lógica del back-end.
  • XAML es el método más sencillo para representar interfaces de usuario
  • XAML funciona eficazmente con herramientas de diseño.

Controla

El marco de trabajo WPF admite muchos controles útiles como:

  • Editar controles como TextoBox, ChequeBox, Boton de radio
  • Controles de lista como ListaBox, Vista de lista, Vista de árbol
  • Información de usuario como etiqueta, WPF ProgressBar, información sobre herramientas
  • Acciones como menú, botón y barra de herramientas
  • Apariencias como borde, imagen WPF y cuadro de visualización
  • Cuadros de diálogo comunes como OpenFileDialog e PrintDialog.
  • Contenedores como TabControl, ScrollBar y GroupBox
  • Diseños como DockPanel, StackPanel y Grid
  • Navegación como marco e hipervínculo

La apariencia de los controles se puede personalizar con estilos y plantillas sin programación. También puede crear un control personalizado derivando una nueva clase a partir de una clase base adecuada.

Apariencia

WPF proporciona una función para personalizar la apariencia de su aplicación. Le permite configurar objetos y valores para cosas como fuentes, fondos, etc.

La función de estilos le permite estandarizar una apariencia específica para todo el producto. Le permite reemplazar la apariencia predeterminada manteniendo su comportamiento predeterminado.

Una plantilla de datos permite controlar la visualización predeterminada de los datos vinculados. Mediante temas, se pueden aplicar fácilmente los estilos visuales del sistema operativo.

Diseño y paneles

El diseño ayuda a posicionar y dimensionar correctamente los controles. Forma parte del proceso de creación de la presentación para el usuario. El framework WPF facilita el proceso de diseño y ofrece una mayor adaptabilidad a la apariencia de la interfaz de usuario.

La infraestructura de diseño se ofrece mediante cinco clases principales: 1) StackPanel 2) DockPanel 3) WrapPanel 4) Grid y 5) Canvas

DISEÑO

WPF proporciona un sistema gráfico mejorado:

  • WPF utiliza unidades independientes del dispositivo, lo que permite la independencia de la resolución y del dispositivo. Cada píxel independiente del dispositivo se escala automáticamente con la configuración de puntos por pulgada del sistema.
  • WPF utiliza double en lugar de float y admite una gama más amplia de colores
  • El motor de gráficos WPF está diseñado de tal manera que puede aprovechar el hardware de gráficos cuando esté disponible.

Documentos e impresión

El marco WPF ofrece tres tipos de documentos:

  • Documentos fijos: Este tipo de documento admite WYSIWPresentación de YG.
  • Documentos de flujo: Le permite ajustar y redistribuir el contenido en función de variables de tiempo de ejecución, como el tamaño de la ventana y la resolución del dispositivo.
  • Documentos XPS: Representación paginada de un documento electrónico en formato XML. XPS es un formato de documento abierto y estandarizado.

WPF permite un mejor control del sistema de impresión, incluyendo la impresión remota y las colas de impresión. Además, los documentos XPS se pueden imprimir directamente sin necesidad de convertirlos a un formato de impresión.

Una vez explicados los elementos básicos, veamos cómo encajan estas piezas internamente.

WPF Architectura

WPF forma parte del framework .NET. Contiene código tanto administrado como no administrado. Los componentes importantes de la arquitectura WPF se explican en la siguiente figura:

WPF Architectura

WPF Architectura

Componentes de la arquitectura WPF

  • PresentaciónMarco: Te ayuda a crear elementos de nivel superior como controles, estilos, diseño, ventanas, etc.
  • PresentaciónCoreContiene tipos base como UIElement y Visual, de los cuales se derivan todos los controles y formas en PresentationFramework.dll.
  • CLR: Hace que el proceso de desarrollo sea productivo al ofrecer características como gestión de la memoria, manejo de errores, etc.
  • Milcore: Milcore es parte del código no administrado que ofrece una estrecha integración con DirectX.
  • DirectX: Es la API de bajo nivel la que renderiza los gráficos de WPF. DirectX interactúa con los controladores y renderiza el contenido.
  • Usuario32: Es una API fundamental ampliamente utilizada por muchos programas. Gestiona la memoria y la separación de procesos. User32 te ayuda a decidir qué elemento se colocará en qué lugar de la pantalla.
  • kernel: La entrada se origina como una señal en un controlador de dispositivo en modo kernel y se enruta al proceso correcto conectándose con el Windows kernel y Usuario32.

Enlace de datos WPF

El enlace de datos es uno de los conceptos más potentes de WPF. En lugar de escribir código que copie manualmente valores entre controles y objetos, se declara una conexión en XAML y WPF mantiene ambos lados sincronizados automáticamente. Por ejemplo:

<TextBox Text="{Binding Path=StudentName, Mode=TwoWay}" />

WPF admite cuatro modos de enlace:

  • De una sola mano: El control se actualiza cuando cambian los datos de origen.
  • Bidireccional: Los cambios fluyen en ambas direcciones entre el control y la fuente.
  • Una sola vez: El control lee el valor de origen solo una vez, en el momento de la carga.
  • Una forma de obtener la fuente: El control envía su valor a la fuente, nunca al revés.

El enlace de datos es también el motor que impulsa el patrón MVVM (Modelo-Vista-ViewModel), la arquitectura más común para aplicaciones WPF profesionales, porque permite que la vista permanezca en XAML mientras que la lógica reside en clases C# que se pueden probar.

💡 Consejo: Implementa la interfaz INotifyPropertyChanged en tus clases de datos. Sin ella, la interfaz de usuario no se actualizará cuando cambien los valores de las propiedades en el código.

Instalación de WPF

Consulte este enlace para instalar WPF: https://www.guru99.com/download-install-visual-studio.html

A continuación, en este tutorial sobre aplicaciones WPF, crearemos nuestra primera aplicación WPF.

¿Cómo crear su primera aplicación WPF?

En este ejemplo de WPF, desarrollaremos una aplicación básica. Para ello, comencemos con la implementación siguiendo los pasos que se muestran en el ejemplo de aplicación WPF a continuación.

Paso 1) En Visual Studio, ve a Archivo > Nuevo > Proyecto

Menú Archivo de Visual Studio que muestra la opción Nuevo proyecto

Paso 2) En la ventana del nuevo proyecto

  1. Seleccione la aplicación WPF
  2. Ingrese el nombre como "MyWPF"
  3. haga clic en Aceptar

Nueva ventana de proyecto con la plantilla de aplicación WPF seleccionada.

Paso 3) Visual Studio crea dos archivos de forma predeterminada

  • Archivo XAML (MainWindow.xaml)
  • Archivo CS (MainWindow.xaml.cs)

Explorador de soluciones que muestra los archivos MainWindow.xaml y MainWindow.xaml.cs

El MainWindow.xaml tiene

  1. Una ventana de diseño
  2. Archivo XAML

Ventana de diseño MainWindow.xaml y editor XAML en Visual Studio

En la ventana XAML, las siguientes etiquetas se escriben de forma predeterminada:

Etiquetas XAML predeterminadas generadas para una nueva ventana WPF

La Cuadrícula es el primer elemento por defecto.

El archivo MainWindow.xaml.cs contiene el código subyacente correspondiente al archivo de diseño XAML:

Archivo de código subyacente MainWindow.xaml.cs para la ventana WPF

Paso 4) En la caja de herramientas,

  1. Arrastra el textoBox elemento a la ventana de diseño
  2. Un textoBox aparecerá en la ventana de diseño
  3. Verás el código XAML para el texto.Box adicional

Arrastrar un textoBox desde la caja de herramientas a la ventana de diseño de WPF

Paso 5) Cambia el texto a “Primer programa WPF”.

Editar textoBox Propiedad de texto para el primer programa WPF

Paso 6) Haga clic en el botón de Inicio

Botón de inicio de Visual Studio para ejecutar la aplicación WPF.

Paso 7) Verás una ventana en la salida.

Se está ejecutando la ventana de la aplicación WPF mostrando el texto del primer programa WPF.

¡Felicidades! Ha diseñado y creado su primera aplicación WPF. A continuación, en este tutorial de WPF para principiantes, veremos la diferencia entre WPF y WinForms.

WPF frente a WinForms

WPF WinForms
Es un marco más nuevo, por lo que está más en sintonía con los estándares actuales. Es más antiguo, por lo que está más probado y comprobado.
Es flexible y cuenta con numerosas funciones. Permite diseñar aplicaciones muy completas sin necesidad de programar ni comprar controles. No es muy completo en cuanto a funciones.
Desarrolladores de 3rd Los controles para fiestas se centran en la compatibilidad con WPF, ya que es el futuro. Hay muchos controles de terceros que puedes comprar u obtener de forma gratuita.
XAML permite crear y editar interfaces gráficas de usuario fácilmente. Permite dividir el trabajo entre un diseñador (XAML) y un programador (C#, VB.NET, etc.). In Windows En los formularios, todo el código está escrito en un solo lugar.
Las habilidades adquiridas con XAML se transfieren directamente a marcos de trabajo más recientes, como WinUI 3, .NET MAUI y Avalonia UI. Las habilidades de WinForms se aplican principalmente a la versión clásica. Windows desarrollo de escritorio.
El conjunto de controles integrados de WPF es limitado Los controles integrados son muy potentes

Tipo de aplicaciones creadas con WPF

  • WPF se utiliza para aplicaciones independientes. Windows aplicaciones de escritorio como herramientas empresariales para líneas de negocio, paneles de control, terminales de negociación y software de diseño
  • Windows Los formularios y las páginas WPF pueden coexistir en la misma aplicación
  • Puedes desarrollar aplicaciones con navegación de página/ventana.

WPF en .NET moderno

Microsoft WPF se convirtió en código abierto en diciembre de 2018, y desde .NET Core 3.0 (2019), el framework se ha incluido en todas las versiones modernas de .NET, hasta .NET 10 inclusive. Migrar una aplicación a una versión moderna de .NET ofrece un inicio más rápido, una implementación más sencilla mediante la publicación autónoma y acceso a las características actuales del lenguaje C#, mientras que el modelo de programación de WPF permanece inalterado.

WPF permanece Windows-solamente. Si estás eligiendo un framework de escritorio hoy, esta comparación te será útil:

Marco conceptual Mejores para
WPF Maduro y con muchas funciones Windows aplicaciones de escritorio con un enorme ecosistema
Interfaz de usuario de Windows 3 Nuevas aplicaciones dirigidas a los usuarios modernos Windows 11 aspecto y sensación
.NET MAUI Aplicaciones multiplataforma que abarcan Windows, macOS, Androidy iOS

Debido a que WPF se mantiene activamente y está profundamente integrado en el software empresarial, aprenderlo sigue siendo una inversión práctica. Una vez que te sientas cómodo creando estas aplicaciones, vale la pena practicar las más comunes. Preguntas de entrevista sobre WPF para consolidar conceptos como XAML, el enlace de datos y el árbol visual.

Preguntas Frecuentes

Necesitas XAML para diseñar la interfaz y C# (o VB.NET) para la lógica de la aplicación. Un conocimiento básico de la programación orientada a objetos y de la biblioteca de clases .NET facilita enormemente el aprendizaje de WPF.

No. WPF depende de DirectX y Windows API, por lo que solo se ejecuta en WindowsPara el desarrollo de XAML multiplataforma, considere Interfaz de usuario de Avalonia or .NET MAUI.

Sí. Herramientas como Copiloto de GitHub Puede generar diseños XAML, expresiones de enlace y estilos a partir de comentarios, lo que acelera el aprendizaje y reduce el marcado repetitivo para los principiantes.

Puede integrar ML.NET para el aprendizaje automático local o llamar a servicios de IA en la nube como Azure Abra OpenAI desde su código C# y luego muestre los resultados a través del enlace de datos estándar de WPF.

Sí. WPF es de código abierto bajo la licencia MIT, y puedes crear aplicaciones de forma gratuita con Visual Studio Community Edition.

Resumir este post con: