Crear una aplicación de OpenGL ES en iOS y AndroidBuild an OpenGL ES Application on Android and iOS

Cuando se instala la opción Visual C++ para desarrollo móvil multiplataforma, puede crear soluciones de Visual Studio y proyectos de aplicaciones para iOS y Android que comparten código común.When you install the Visual C++ for Cross-Platform Mobile Development option, you can create Visual Studio solutions and projects for iOS apps and Android apps that share common code. Este tema le guía a través de una plantilla de solución que crea una aplicación iOS simple y una aplicación Android Native Activity.This topic guides you through a solution template that creates both a simple iOS app and an Android Native Activity app. Las aplicaciones tienen código de C++ en común que usa OpenGL ES para mostrar el mismo cubo giratorio animado en cada plataforma.The apps have C++ code in common that uses OpenGL ES to display the same animated rotating cube on each platform. OpenGL ES (OpenGL para sistemas incrustados o GLES) es una API de gráficos 2D y 3D compatible con muchos dispositivos móviles.OpenGL ES (OpenGL for Embedded Systems or GLES) is a 2D and 3D graphics API that is supported on many mobile devices.

Requisitos Requirements
Crear un nuevo proyecto de aplicación OpenGLES Create a new OpenGLES Application project
Compilar y ejecutar la aplicación Android Build and run the Android app
Compilar y ejecutar la aplicación iOS Build and run the iOS app
Personalizar las aplicacionesCustomize your apps

RequisitosRequirements

Antes de crear una aplicación de OpenGL ES para iOS y Android, debe asegurarse de que cumple todos los requisitos del sistema.Before you can create an OpenGL ES app for iOS and Android, you must make sure you've met all system requirements. Debe instalar la opción Visual C++ para desarrollo móvil multiplataforma en Visual Studio 2015.You must install the Visual C++ for Cross-Platform Mobile Development option in Visual Studio 2015. Asegúrese de que las herramientas de terceros y SDK necesarios estén incluidos en la instalación y que está instalado el emulador de Visual Studio para Android.Make sure that the required third-party tools and SDKs are included in the installation, and that the Visual Studio Emulator for Android is installed. Para obtener más información e instrucciones detalladas, vea Install Visual C++ for Cross-Platform Mobile Development.For more information and detailed instructions, see Install Visual C++ for Cross-Platform Mobile Development. Para compilar y probar la aplicación de iOS, necesitará un equipo Mac configurado de acuerdo con las instrucciones de instalación.To build and test the iOS app, you'll need a Mac computer, set up according to the installation instructions. Para más información sobre la configuración para el desarrollo en iOS, vea Install And Configure Tools to Build using iOSFor more information about how to set up for iOS development, see Install And Configure Tools to Build using iOS

Crear un nuevo proyecto de aplicación OpenGLESCreate a new OpenGLES Application project

En este tutorial, primero debe crear un nuevo proyecto de aplicación de OpenGL ES y, a continuación, compilar y ejecutar la aplicación predeterminada en el emulador de Visual Studio para Android.In this tutorial, you first create a new OpenGL ES Application project and then build and run the default app in the Visual Studio Emulator for Android. A continuación, compile la aplicación para iOS y ejecute la aplicación en el simulador de iOS.Next you build the app for iOS and run the app in the iOS Simulator.

Para crear un nuevo proyectoTo create a new project

  1. Abra Visual Studio.Open Visual Studio. En la barra de menús, elija Archivo, Nuevo, Proyecto.On the menu bar, choose File, New, Project.

  2. En el cuadro de diálogo Nuevo proyecto , debajo de Plantillas, elija Visual C++, Multiplataformay luego elija la plantilla Aplicación de OpenGLES (Android, iOS) .In the New Project dialog box, under Templates, choose Visual C++, Cross Platform, and then choose the OpenGLES Application (Android, iOS) template.

  3. Asigne a la aplicación un nombre como MyOpenGLESAppy luego elija Aceptar.Give the app a name like MyOpenGLESApp, and then choose OK.

    Nuevo proyecto de aplicación OpenGLESNew OpenGLES Application project

    Visual Studio crea la solución nueva y abre el Explorador de soluciones.Visual Studio creates the new solution and opens Solution Explorer.

    MyOpenGLESApp en el Explorador de solucionesMyOpenGLESApp in Solution Explorer

    La nueva solución de aplicación de OpenGL ES incluye tres proyectos de biblioteca y dos proyectos de aplicación.The new OpenGL ES Application solution includes three library projects and two application projects. La carpeta de bibliotecas incluye un proyecto de código compartido y dos proyectos para plataformas específicas que hacen referencia al código compartido:The Libraries folder includes a shared code project and two platform-specific projects that reference the shared code:

  • MyOpenGLESApp.Android.NativeActivity contiene las referencias y el código de adherencia que implementa su aplicación como Native Activity en Android.MyOpenGLESApp.Android.NativeActivity contains the references and glue code that implements your app as a Native Activity on Android. La implementación de los puntos de entrada desde el código de adherencia están en main.cpp, que incluye el código común compartido en MyOpenGLESApp.Shared.The implementation of the entry points from the glue code are in main.cpp, which includes the common shared code in MyOpenGLESApp.Shared. Los encabezados precompilados están en pch.h.Precompiled headers are in pch.h. Su proyecto de aplicación de Native Activity se compila en un archivo de biblioteca compartida (.so) que usa el proyecto MyOpenGLESApp.Android.Packaging.This Native Activity app project is compiled into a shared library (.so) file which is picked up by the MyOpenGLESApp.Android.Packaging project.

  • MyOpenGLESApp.iOS.StaticLibrary crea un archivo de biblioteca estática (.a) de iOS que contiene el código compartido en MyOpenGLESApp.Shared.MyOpenGLESApp.iOS.StaticLibrary creates an iOS static library (.a) file that contains the shared code in MyOpenGLESApp.Shared. Dicho archivo está vinculado a la aplicación creada por el proyecto MyOpenGLESApp.iOS.Application.It is linked to the app created by the MyOpenGLESApp.iOS.Application project.

  • MyOpenGLESApp.Shared contiene el código compartido que funciona en las distintas plataformas.MyOpenGLESApp.Shared contains the shared code that works across platforms. Dicho código usa macros de preprocesador para la compilación condicional de código específico de plataforma.It uses preprocessor macros for conditional compilation of platform-specific code. La referencia de proyecto toma el código compartido en MyOpenGLESApp.Android.NativeActivity y MyOpenGLESApp.iOS.StaticLibrary.The shared code is picked up by project reference in both MyOpenGLESApp.Android.NativeActivity and MyOpenGLESApp.iOS.StaticLibrary.

    La solución tiene dos proyectos para compilar las aplicaciones para las plataformas iOS y Android:The solution has two projects to build the apps for the Android and iOS platforms:

  • MyOpenGLESApp.Android.Packaging crea el archivo .apk para la implementación en un emulador o dispositivo Android.MyOpenGLESApp.Android.Packaging creates the .apk file for deployment on an Android device or emulator. Este contiene los recursos y el archivo AndroidManifest.xml donde se establecen las propiedades del manifiesto.This contains the resources and AndroidManifest.xml file where you set manifest properties. También contiene el archivo build.xml que controla el proceso de compilación de Ant.It also contains the build.xml file that controls the Ant build process. Se establece como proyecto de inicio de manera predeterminada para que se pueda implementar y ejecutar directamente desde Visual Studio.It's set as the startup project by default, so that it can be deployed and run directly from Visual Studio.

  • MyOpenGLESApp.iOS.Application contiene los recursos y el código de adherencia Objective-C para crear una aplicación de iOS que se vincula al código de biblioteca estática de C++ en MyOpenGLESApp.iOS.StaticLibrary.MyOpenGLESApp.iOS.Application contains the resources and Objective-C glue code to create an iOS app that links to the C++ static library code in MyOpenGLESApp.iOS.StaticLibrary. Este proyecto crea un paquete de compilación que Visual Studio y el agente remoto transfieren a su Mac.This project creates a build package that is transferred to your Mac by Visual Studio and the remote agent. Cuando se compila este proyecto, Visual Studio envía los archivos y comandos para compilar e implementar su aplicación en Mac.When you build this project, Visual Studio sends the files and commands to build and deploy your app on the Mac.

Compilar y ejecutar la aplicación AndroidBuild and run the Android app

La solución creada por la plantilla establece la aplicación Android como proyecto predeterminado.The solution created by the template sets the Android app as the default project. Puede compilar y ejecutar esta aplicación para comprobar la instalación y la configuración.You can build and run this app to verify your installation and setup. Para realizar una prueba inicial, ejecute la aplicación en uno de los perfiles de dispositivo que instala el emulador de Visual Studio para Android.For an initial test, run the app on one of the device profiles installed by the Visual Studio Emulator for Android. Si prefiere probar la aplicación en otro destino, cargue el emulador de destino o conecte el dispositivo a su equipo.If you prefer to test your app on another target, you can load the target emulator or connect the device to your computer.

Para compilar y ejecutar la aplicación Android Native ActivityTo build and run the Android Native Activity app

  1. Si aún no está seleccionada, elija la opción x86 en la lista desplegable Plataformas de solución .If it is not already selected, choose x86 from the Solution Platforms drop-down list.

    Establecer la plataforma de soluciones en x86Set the Solution Platform to x86

    Use x86 como destino del emulador de Android para Windows.Use x86 to target the Android Emulator for Windows. Si desea usar un dispositivo como destino, elija la plataforma de solución según el procesador del dispositivo.If you are targeting a device, choose the solution platform based on the device processor. Si no se muestra la lista Plataformas de solución , seleccione Plataformas de solución de la lista Agregar o quitar botones y luego seleccione la plataforma.If the Solution Platforms list isn't displayed, choose Solution Platforms from the Add/Remove Buttons list, and then choose your platform.

  2. En el Explorador de soluciones, abra el menú contextual del proyecto MyOpenGLESApp.Android.Packaging y elija Compilar.In Solution Explorer, open the shortcut menu for MyOpenGLESApp.Android.Packaging project and then choose Build.

    Compilar un proyecto de empaquetado de AndroidBuild Android Packaging Project

    La ventana Salida muestra la salida del proceso de compilación de la biblioteca compartida de Android y la aplicación Android.The Output window displays the output of the build process for the Android shared library and the Android app.

    Resultados de compilación para proyectos AndroidBuild Output for Android projects

  3. Elija como destino de la implementación uno de los perfiles de VS Emulator Android Phone (x86).Choose one of the VS Emulator Android Phone (x86) profiles as your deployment target.

    Seleccionar el destino de la implementaciónChoose deployment target

    Si ha instalado otros emuladores o ha conectado un dispositivo Android, puede elegirlos en la lista desplegable de destinos de implementación.If you have installed other emulators or connected an Android device, you can choose them in the deployment target drop-down list. Para ejecutar la aplicación, la plataforma de solución compilada debe coincidir con la plataforma del dispositivo de destino.To run the app, the built Solution Platform must match the platform of the target device.

  4. Presione F5 para iniciar la depuración o Mayús+F5 para iniciar sin depurar.Press F5 to start debugging, or Shift+F5 to start without debugging.

    Visual Studio inicia el emulador, que tarda varios segundos en cargarse e implementar el código.Visual Studio starts the emulator, which takes several seconds to load and deploy your code. Este es el aspecto que tendrá su aplicación en el emulador de Visual Studio para Android.Here's how the app appears in the Visual Studio emulator for Android.

    Aplicación que se ejecuta en el emulador de AndroidApp running in Android Emulator

    Cuando la aplicación se inicia, puede establecer puntos de interrupción y usar el depurador para ver el código, examinar los locales e inspeccionar los valores.Once your app has started, you can set breakpoints and use the debugger to step through code, examine locals, and watch values.

  5. Presione Mayús+F5 para detener la depuración.Press Shift + F5 to stop debugging.

    El emulador es un proceso independiente que sigue ejecutándose.The emulator is a separate process that continues to run. Puede editar, compilar e implementar el código varias veces en el mismo emulador.You can edit, compile, and deploy your code multiple times to the same emulator. La aplicación aparece en la colección de aplicaciones en el emulador y puede iniciarse desde allí directamente.Your app appears in the app collection on the emulator, and it can be started from there directly.

    La aplicación de Android Native Activity generada y los proyectos de biblioteca colocan el código C++ compartido en una biblioteca dinámica que incluye código de "adherencia" para interactuar con la plataforma Android.The generated Android Native Activity app and library projects put the C++ shared code in a dynamic library that includes "glue" code to interface with the Android platform. Esto significa que la mayoría del código de la aplicación está en la biblioteca y el manifiesto, recursos y las instrucciones de compilación están en el proyecto de empaquetado.This means most of the app code is in the library, and the manifest, resources, and build instructions are in the packaging project. El código compartido se llama desde main.cpp en el proyecto NativeActivity.The shared code is called from main.cpp in the NativeActivity project. Para más información sobre cómo programar Android Native Activity, vea la página Conceptos sobre Android Developer NDK .For more information about how to program an Android Native Activity, see the Android Developer NDK Concepts page.

    Visual Studio compila proyectos de Android Native Activity mediante el uso de Android NDK, que usa Clang como conjunto de herramientas de la plataforma.Visual Studio builds Android Native Activity projects by using the Android NDK, which uses Clang as the platform toolset. Visual Studio asigna las propiedades del proyecto NativeActivity a los modificadores de línea de comandos y las opciones que se usan para compilar, vincular y depurar en la plataforma de destino.Visual Studio maps the properties in the NativeActivity project to the command-line switches and options that are used to compile, link, and debug on the target platform. Para más información, abra el cuadro de diálogo Páginas de propiedades para el proyecto MyOpenGLESApp.Android.NativeActivity.For details, open the Property Pages dialog for the MyOpenGLESApp.Android.NativeActivity project. Para más información sobre los modificadores de la línea de comandos, vea el Manual del usuario del compilador de Clang.For more information about the command line switches, see the Clang Compiler User's Manual.

Compilar y ejecutar la aplicación iOSBuild and run the iOS app

El proyecto de aplicación iOS se crea y modifica en Visual Studio; sin embargo, debido a restricciones de licencia, debe compilarse e implementarse en un equipo MAC.The iOS app project is created and edited in Visual Studio, but because of licensing restrictions, it must be built and deployed from a Mac. Visual Studio se comunica con un agente remoto que se ejecuta en el equipo Mac para transferir archivos de proyecto y ejecutar la compilación, la implementación y los comandos de depuración.Visual Studio communicates with a remote agent running on the Mac to transfer project files and execute build, deployment, and debugging commands. Debe instalar y configurar su equipo Mac y Visual Studio para comunicarse antes de generar la aplicación iOS.You must set up and configure your Mac and Visual Studio to communicate before you can build the iOS app. Para obtener instrucciones detalladas, vea Install And Configure Tools to Build using iOS.For detailed instructions, see Install And Configure Tools to Build using iOS. Una vez que se ejecuta el agente remoto y Visual Studio se empareja con su equipo Mac, puede compilar y ejecutar la aplicación iOS para comprobar su instalación y configuración.Once the remote agent is running and Visual Studio is paired with your Mac, you can build and run the iOS app to verify your installation and setup.

Para compilar y ejecutar la aplicación iOSTo build and run the iOS app

  1. Compruebe que el agente remoto se está ejecutando en el equipo Mac y que Visual Studio está emparejado con el agente remoto.Verify that the remote agent is running on your Mac, and that Visual Studio is paired to the remote agent. Para iniciar el agente remoto, abra una ventana de aplicación de terminal y escriba vcremote.To start the remote agent, open a Terminal app window and enter vcremote. Para más información, vea Configurar el agente remoto en Visual Studio.For more information, see Configure the remote agent in Visual Studio.

    Ventana de terminal Mac que ejecuta vcremoteMac Terminal window running vcremote

  2. Si aún no está seleccionada, elija la opción x86 en la lista desplegable Plataformas de solución .If it is not already selected, choose x86 from the Solution Platforms drop-down list.

    Establecer la plataforma de soluciones en x86Set the Solution Platform to x86

    Use x 86 como destino del simulador de iOS.Use x86 to target the iOS Simulator. Si desea usar un dispositivo iOS como destino, elija la plataforma de solución según el procesador del dispositivo (normalmente un procesador ARM).If you are targeting an iOS device, choose the solution platform based on the device processor (usually an ARM processor). Si no se muestra la lista Plataformas de solución , seleccione Plataformas de solución de la lista Agregar o quitar botones y luego seleccione la plataforma.If the Solution Platforms list isn't displayed, choose Solution Platforms from the Add/Remove Buttons list, and then choose your platform.

  3. En el Explorador de soluciones, abra el menú contextual del proyecto MyOpenGLESApp.iOS.Application y elija Compilar.In Solution Explorer, open the shortcut menu for the MyOpenGLESApp.iOS.Application project and choose Build.

    Compilar un proyecto de aplicación para iOSBuild iOS Application project

    La ventana Salida muestra la salida del proceso de compilación de la biblioteca estática de iOS y la aplicación iOS.The Output window displays the output of the build process for the iOS static library and the iOS app. En el equipo Mac, la ventana de terminal que ejecuta el agente remoto muestra el comando y la actividad de transferencia de archivo.On the Mac, the Terminal window running the remote agent shows the command and file transfer activity.

    En el equipo Mac, es posible que se le pida que acepte una solicitud de firma de código.On your Mac computer, you may be prompted at accept a code signing request. Seleccione Permitir para continuar.Choose Allow to continue.

  4. Elija Simulador de iOS en la barra de herramientas para ejecutar la aplicación en el simulador de iOS en el equipo Mac.Choose iOS Simulator on the toolbar to run the app in the iOS Simulator on your Mac. El simulador puede tardar unos instantes en iniciarse.It may take a moment to start the simulator. Puede que tenga que poner el simulador en primer plano en el equipo Mac para ver el resultado.You may have to bring the simulator to the foreground on your Mac to see its output.

    Aplicación que se ejecuta en el simulador de iOSApp running on iOS Simulator

    Cuando la aplicación se inicia, puede establecer puntos de interrupción y usar el depurador de Visual Studio para examinar locales, ver la pila de llamadas e inspeccionar los valores.Once your app has started, you can set breakpoints and use the Visual Studio debugger to examine locals, see the call stack, and watch values.

    Depurador en un punto de interrupción en una aplicación para iOSDebugger at breakpoint in iOS app

  5. Presione Mayús+F5 para detener la depuración.Press Shift + F5 to stop debugging.

    El simulador de iOS es un proceso independiente que sigue ejecutándose en su equipo Mac.The iOS Simulator is a separate process that continues to run on your Mac. Puede editar, compilar e implementar el código varias veces en el mismo simulador de iOS.You can edit, compile, and deploy your code multiple times to the same iOS Simulator instance. También puede ejecutar el código directamente en el simulador después de que se haya implementado.You can also run your code directly in the simulator after it has been deployed.

    Los proyectos de biblioteca y aplicación iOS generados colocan el código C++ en una biblioteca estática que implementa solo el código compartido.The generated iOS app and library projects put the C++ code in a static library that implements only the shared code. La mayoría del código de aplicación está en el proyecto de aplicación.Most of the application code is in the Application project. Las llamadas al código de biblioteca compartida de este proyecto de plantilla se realizan en el archivo GameViewController.m.The calls to the shared library code in this template project are made in the GameViewController.m file. Para compilar la aplicación iOS, Visual Studio usa el conjunto de herramientas de la plataforma Xcode, que requiere comunicación con un cliente remoto que se ejecuta en un equipo MAC.To build your iOS app, Visual Studio uses the Xcode platform toolset, which requires communication with a remote client that is running on a Mac.

    Visual Studio transfiere los archivos del proyecto y envía comandos al cliente remoto para compilar la aplicación mediante Xcode.Visual Studio transfers the project files and sends commands to the remote client to build the app using Xcode. El cliente remoto envía información sobre el estado de la compilación de nuevo a Visual Studio.The remote client sends build status information back to Visual Studio. Cuando la aplicación se ha compilado correctamente, puede usar Visual Studio para enviar comandos para la ejecución y depurar la aplicación.When the app has built successfully, you can use Visual Studio to send commands to run and debug the app. El depurador de Visual Studio controla la aplicación en ejecución en el simulador de iOS que, a su vez, se ejecuta en el equipo Mac o en un dispositivo iOS adjunto.The debugger in Visual Studio controls the app running in the iOS Simulator running on your Mac, or on an attached iOS device. Visual Studio asigna las propiedades del proyecto StaticLibrary a los modificadores de línea de comandos y las opciones que se usan para compilar, vincular y depurar en la plataforma de iOS de destino.Visual Studio maps the properties in the StaticLibrary project to the command-line switches and options that are used to build, link, and debug on the target iOS platform. Para obtener detalles de las opciones de línea de comandos del compilador, abra el cuadro de diálogo Páginas de propiedades del proyecto MyOpenGLESApp.iOS.StaticLibrary.For compiler command-line option details, open the Property Pages dialog for the MyOpenGLESApp.iOS.StaticLibrary project.

Personalizar las aplicacionesCustomize your apps

Puede modificar el código de C++ compartido para agregar o cambiar la funcionalidad común.You can modify the shared C++ code to add or change common functionality. Debe cambiar las llamadas al código compartido en los proyectos MyOpenGLESApp.Android.NativeActivity y MyOpenGLESApp.iOS.Application para que coincidan.You must change the calls to the shared code in the MyOpenGLESApp.Android.NativeActivity and MyOpenGLESApp.iOS.Application projects to match. Puede usar macros de preprocesador para especificar secciones específicas de la plataforma en el código común.You can use preprocessor macros to specify platform-specific sections in your common code. La macro de preprocesador __ANDROID__ está predefinida al compilar para Android.The preprocessor macro __ANDROID__ is predefined when you build for Android. La macro de preprocesador __APPLE__ está predefinida al compilar para iOS.The preprocessor macro __APPLE__ is predefined when you build for iOS.

Para ver IntelliSense para una plataforma de proyecto determinado, elija el proyecto en la lista desplegable de modificador de contexto en la barra de navegación de la parte superior de la ventana del editor.To see the IntelliSense for a particular project platform, choose the project in the context switcher dropdown in the Navigation bar at the top of the editor window.

Menú desplegable del conmutador de contextos de proyecto en el EditorProject Context Switcher dropdown in Editor

Los problemas de IntelliSense en el proyecto actual se marcan con una línea roja ondulada.IntelliSense issues in the current project are marked with a red wavy line. Los problemas de otros proyectos se marcan con una línea ondulada de color púrpura.Issues in other projects are marked with a purple wavy line. De forma predeterminada, Visual Studio no admite el código en colores o IntelliSense para los archivos Java u Objective-C.By default, Visual Studio does not support code colorization or IntelliSense for Java or Objective-C files. Sin embargo, puede modificar los archivos de origen y cambiar los recursos para establecer el nombre de la aplicación, el icono y otros detalles de implementación.However, you can still modify the source files and change the resources to set your application name, icon, and other implementation details.