Creación de aplicaciones universales de Windows diseñadas para Windows y Windows Phone

Applies to Windows and Windows Phone

Puedes crear una aplicación para Windows y Windows Phone a la vez y compartir código, controles del usuario, estilos, cadenas y otros activos entre los dos proyectos en Visual Studio. De este modo se reduce el tiempo y el gasto asociados a la creación y el mantenimiento de una aplicación para cada tipo de dispositivo.

Si ya tienes una aplicación de la Tienda Windows, es muy rápido agregar una aplicación para la Tienda de Windows Phone a la misma solución. Del mismo modo, si ya tienes una aplicación de Windows Phone, puedes agregar fácilmente una aplicación de la Tienda Windows.

Las plantillas de proyecto de aplicaciones universales se instalan en el momento en que instalas Visual Studio 2013 con Update 2 o superior.

Desarrollar una aplicación universal de Windows diseñada para Windows y Windows Phone

Para empezar, selecciona una plantilla de proyecto para una aplicación universal del cuadro de diálogo Nuevo proyecto.

En la captura de pantalla siguiente se muestran las plantillas de proyecto de aplicaciones universales que están disponibles actualmente para C#. Visual C++ tiene un conjunto similar de plantillas para aplicaciones universales.

Plantillas de proyecto universal en Visual Studio

Después de seleccionar una plantilla para una aplicación universal y de crear una solución, aparecen tres proyectos en el Explorador de soluciones.

  1. Un proyecto para Windows.
  2. Un proyecto para Windows Phone.
  3. Un proyecto compartido.

En la captura de pantalla siguiente se muestra la solución que Visual Studio crea cuando seleccionas la plantilla de proyecto para una Aplicación vacía (aplicaciones universales).

Proyecto convergido en el Explorador de soluciones.

  • El proyecto de la Tienda Windows contiene páginas XAML y código destinados a Windows.

  • El proyecto de Windows Phone contiene páginas XAML y código destinado a Windows Phone.

  • El proyecto compartido es un contenedor para código que se ejecuta en ambas plataformas. El contenido del proyecto compartido se incluye automáticamente tanto en los proyectos de Windows Phone y de la Tienda Windows como en su resultado de creación.

Crear. Al crear la solución, Microsoft Visual Studio crea una aplicación para la Tienda de Windows Phone y una aplicación de la Tienda Windows. No hay ningún resultado de la creación del proyecto compartido.

Proyecto de inicio. Cuando ejecutas la solución (por ejemplo, si presionas F5), el proyecto que se ejecuta es el seleccionado como proyecto de inicio. Para establecer el proyecto de inicio, haz clic con el botón derecho en el nodo del proyecto en el Explorador de soluciones y selecciona Establecer como proyecto de inicio. El proyecto que elijas se muestra en negrita en el Explorador de soluciones. En la captura de pantalla anterior, el proyecto de inicio es App1.Windows (Windows 8.1).

Depurar destino.

  • Si el proyecto de Windows es el proyecto de inicio, en la lista desplegable Depurar destino se muestran opciones para el Simulador o Equipo local de Windows.
  • Si el proyecto de inicio es el proyecto de Windows Phone, la lista desplegable muestra opciones para el Dispositivo, así como varios emuladores de teléfono.
  • En un proyecto realizado en C++, debes definir manualmente la configuración de compilación en la plataforma ARM para ver la opción Dispositivo e implementar la aplicación en un dispositivo físico. La configuración de Win32 se utiliza únicamente para los emuladores de teléfono. Define la plataforma para navegar hasta Proyecto | Propiedades | Administrador de configuración | Plataforma.

Comenzar a escribir una aplicación universal

Considera la posibilidad de comenzar con la plantilla denominada Aplicación Hub (aplicaciones universales) en lugar de una Aplicación vacía. (Hub es el equivalente a Panorama en versiones anteriores de Windows Phone). La plantilla Aplicación Hub crea una aplicación que tiene tres páginas. Encontrarás la plantilla Aplicación Hub en la categoría Aplicaciones universales. Para obtener más información acerca de la plantilla de proyecto Aplicación Hub, consulta Plantillas de Visual Studio.

En la captura de pantalla siguiente se muestra la plantilla de proyecto Aplicación Hub seleccionada en el cuadro de diálogo Nuevo proyecto.

Plantilla Aplicación Hub en Visual Studio

Escribir código multiplataforma en el proyecto compartido

En el proyecto compartido, generalmente se escribe código que se ejecuta en ambas plataformas.

Para aislar las secciones de código que son específicas de cada plataforma, utiliza la directiva #ifdef. Las constantes WINDOWS_APP y WINDOWS_PHONE_APP vienen predefinidas para tu comodidad. (En C++, utiliza la directiva para aislar el código específico para Phone: #if WINAPI_FAMILY==WINAPI_FAMILY_PHONE_APP...#endif.)

Puedes arrastrar y colocar archivos de uno de los proyectos específicos para una plataforma al proyecto compartido o viceversa para cambiar el ámbito del código.

Identificar y aislar código específico para una plataforma

Al escribir código en el proyecto compartido, el editor de código de Visual Studio usa un contexto destinado a una de las dos plataformas. En C#, el IntelliSense que ves cuando escribes código es específico del contexto del editor de código, es decir, específico de Windows o de Windows Phone.

En la captura de pantalla siguiente se muestra la lista desplegable del selector de contexto en el editor de código de Visual Studio.

Lista desplegable del selector de contexto en el editor de código

Si utilizas una API en código compartido que no es compatible con ambas plataformas, un mensaje de error identificará dicha API cuando crees el proyecto. Sin embargo, no tienes que crear el proyecto para confirmar que estás usando API para ambas plataformas. Comprueba si se da una de las situaciones siguientes en el editor de código.

  • Echa un vistazo a los iconos de advertencia y al texto de IntelliSense.

    En la captura de pantalla siguiente se muestra un ejemplo de los iconos de advertencia y de IntelliSense para un tipo que solo se admite en aplicaciones para la Tienda de Windows Phone.

    Iconos de advertencia e IntelliSense

  • Cambia el contexto del editor en la lista desplegable a la otra plataforma. Así se muestran líneas onduladas debajo de las API que no se admiten en la plataforma seleccionada. En C++, unas ondulaciones moradas te informan de si una API no se admite en la otra plataforma, sin tener que cambiar el contexto ni crear el proyecto.

Después de identificar API específicas para una plataforma, utiliza la directiva #ifdef para aislarlas en el código compartido.

Agregar compatibilidad para Windows o Windows Phone

Si ya has publicado una aplicación de la Tienda Windows, es sencillo reutilizar parte del código y publicar una versión de la aplicación para Windows Phone. Del mismo modo, si has comenzado creando una aplicación de Windows Phone, puedes modificar la solución para crearla también para tabletas y equipos de escritorio de Windows. Para agregar compatibilidad para un tipo de dispositivo u otro, ve al Explorador de soluciones, haz clic con el botón derecho en el proyecto y elige Agregar Windows Phone 8.1 o Agregar Windows 8.1.

Agregar un proyecto de Windows Phone 8.1

Visual Studio agrega un nuevo proyecto de Windows Phone o de la Tienda Windows a la solución. Visual Studio también agrega un proyecto compartido.

En la captura de pantalla siguiente se muestra una solución después de agregar un proyecto de Windows Phone a un proyecto existente de la Tienda Windows.

Proyecto de Windows Phone agregado a una solución.

Mover archivos al proyecto compartido

Puedes mover al proyecto compartido cualquier código que quieras compartir entre aplicaciones. Por ejemplo, si has creado la aplicación mediante una plantilla de Visual Studio, considera la posibilidad de mover las carpetas Common, DataModel y Strings al proyecto compartido. También puedes mover App.xaml al proyecto compartido, tal como se explica más adelante en este artículo.

Nota  En C++, al mover archivos de un proyecto a otro no se mueven físicamente en el sistema de archivos.

En la captura de pantalla siguiente se muestra una solución después de mover las carpetas y los archivos sugeridos al proyecto compartido.

Archivos movidos al proyecto compartido.

Puede que recibas algunos errores del compilador sobre el código que muevas al proyecto compartido. En muchos casos, los puedes resolver con tan solo configurar que el nuevo proyecto de aplicación tenga el mismo conjunto de referencias que el proyecto inicial. Por ejemplo, si tu aplicación de la Tienda Windows contiene una referencia de ensamblado para una biblioteca de terceros y mueves el código asociado a la carpeta compartida, en el proyecto para Windows Phone también tienes que hacer referencia a la biblioteca de terceros.

En la captura de pantalla siguiente se muestra la misma referencia de ensamblado agregada a ambos proyectos.

Referencias de ensamblado agregadas a ambos proyectos

Si tu código compartido usa las API específicas de Windows, usa la directiva #ifdef con la constante WINDOWS_APP para aislar esa sección de código. Utiliza la constante WINDOWS_PHONE_APP para aislar secciones de código específicas de Windows Phone 8.1. En la siguiente sección se muestra cómo aplicar estas constantes y también se mencionan las constantes utilizadas en C++.

Compartir el archivo App.xaml

Cuando se crea una nueva solución para una aplicación universal, Visual Studio coloca App.xaml en el proyecto compartido. Cuando se convierte un proyecto existente en una aplicación universal, se puede mover App.xaml manualmente al proyecto compartido. Después de mover el archivo, tienes que establecer la propiedad Acción de generación de la página como ApplicationDefinition.

  1. En el Explorador de soluciones, en el proyecto compartido, selecciona el archivo App.xaml.
  2. Selecciona Ver > ventana Propiedades.
  3. En la ventana Propiedades, en la lista desplegable Acción de generación, selecciona ApplicationDefinition.

También deberás decidir cómo quieres abrir la primera página de tu aplicación. Por ejemplo, la página App.xaml de una aplicación universal puede utilizar el siguiente código para abrir una página llamada HubPage. Este código solo funciona si ambos proyectos contienen una página llamada HubPage.



if (!rootFrame.Navigate(typeof(HubPage)))
{
    throw new Exception(“Failed to create initial page”);
}

Si quieres usar una página de inicio diferente para cada aplicación, tienes que agregar directivas #ifdef como se muestra a continuación:


#if WINDOWS_APP
                if (!rootFrame.Navigate(typeof(HubPage)))
#endif
#if WINDOWS_PHONE_APP
                if (!rootFrame.Navigate(typeof(WindowsPhoneStartPage)))
#endif
                {
                    throw new Exception("Failed to create initial page");
                }


Por último, asegúrate de que cualquier estilo definido en tu archivo App.xaml use recursos que estén disponibles en ambos tipos de aplicación. En caso contrario, mueve esas definiciones de estilo al proyecto de la Tienda Windows o Windows Phone.

Temas relacionados

Compilación de aplicaciones universales con Visual Studio
Aplicación universal de Windows que consume datos de Azure Marketplace
Compartir código con varias plataformas
Plantillas de proyecto de C#, VB y C++

 

 

Mostrar:
© 2015 Microsoft