Compartir a través de

Creación de una aplicación WinUI

En esta serie de tutoriales se muestra cómo crear una aplicación WinUI 3 mediante XAML y C#. La aplicación que va a crear es una aplicación de nota, donde el usuario puede crear, guardar y cargar varias notas. Puede descargar o ver el código de este tutorial desde el repositorio de GitHub.

En este tutorial, aprenderá a:

  • Use el marcado XAML para definir la interfaz de usuario de la aplicación.
  • Interactúe con elementos XAML a través del código de C#.
  • Guarde y cargue archivos desde el sistema de archivos local.
  • Crear vistas y enlazarlas a datos.
  • Use la navegación para desplazarse hacia y desde las páginas de la aplicación.
  • Use recursos como documentación y aplicaciones de ejemplo para crear su propia aplicación.

Usará Visual Studio 2022 para crear una aplicación que pueda usar para escribir una nota y guardarla en el almacenamiento de aplicaciones local. Puede encontrar el código fuente de esta aplicación aquí. La aplicación tendrá dos páginas:

  • NotePage - una página para editar una sola nota.
  • AllNotesPage : una página para mostrar todas las notas guardadas.

A continuación se muestra la aplicación final:

AllNotesPage

Captura de pantalla final de la aplicación de notas, en la que se muestran tres notas guardadas.

NotePage

Captura de pantalla final de la aplicación de notas, que muestra una nueva nota en blanco.

Creación del proyecto de Visual Studio

Para comenzar este tutorial, debe crear un proyecto de aplicación winUI 3 en Visual Studio mediante la plantilla de Blank App, Packaged (WinUI 3 in Desktop) proyecto de C#. Al crear el proyecto, use la siguiente configuración:

  • Nombre del proyecto

    Debe establecerse en WinUINotes. Si das al proyecto un nombre diferente, el código que copias y pegas de este tutorial puede producir errores de compilación. Esto se debe a que Visual Studio usa el nombre del proyecto como espacio de nombres predeterminado para el código de la aplicación.

  • SDK para aplicaciones de Windows

    En este tutorial se usan características nuevas en Windows App SDK 1.7. Debe asegurarse de que el paquete NuGet de Windows App SDK se actualiza a la versión 1.7 o posterior.

Importante

Si no ha creado un proyecto de WinUI 3 antes, siga los pasos descritos en Inicio del desarrollo de aplicaciones de Windows para asegurarse de que el entorno de desarrollo y el proyecto de Visual Studio estén configurados correctamente.

Al ejecutar el proyecto de aplicación en blanco (como se describe en Inicio del desarrollo de aplicaciones de Windows), debería ver una ventana vacía que tenga este aspecto:

Ventana de la aplicación de notas con una barra de título y un área de contenido vacía.

Sugerencia

Con frecuencia, hará referencia a documentos de referencia de API y documentos conceptuales al compilar aplicaciones de Windows. En este tutorial, verá vínculos insertados en el texto y, en grupos etiquetados, "Más información en docs:". Estos vínculos son opcionales; No es necesario seguirlos para completar el tutorial. Se proporcionan en caso de que quieras anotar dónde encontrar la información que necesitarás al empezar a crear tus propias aplicaciones.

Continuar con el paso 1: Configuración del proyecto

  • Last updated on