Mobile App Development for Multiple Platforms with Visual C++, 2016 Marc Grégoire Software Architect marc.gregoire@nikon.com November 24th 2016 Develop for Windows, Android, and iOS

Marc Grégoire Software architect for Nikon Metrology Microsoft MVP since 2007 Microsoft Extended Experts Team member Author of Professional C++, 3rd Edition Co-author of C++ Standard Library Quick Reference

Agenda Recap What’s new since last year? Cross-Platform UI Resources December 2015 Meeting C++ Common Denominator Visual Studio 2015 RTM What’s new since last year? Android Demo – Buiding with Gradle iOS Demo – Co-development with Xcode Game Engines Demo – Cocos2d-x Android development in VS Cross-Platform UI Demo – Android, iOS, and Universal Windows UI Resources People that were at my December session last year might remember my presentation about cross-platform mobile app development. This year’s presentation is not a repeat of last year’s session, but builds on top of it. However, for people that missed last year’s presentation, I’ll start with a brief overview of what was covered last year. Next we’ll go deeper in on what’s new since last year and on how to handle cross-plat UI. Lot’s of demos. In fact I don’t have that many slides.

Agenda Recap What’s new since last year? Cross-Platform UI Resources December 2015 Meeting C++ Common Denominator Visual Studio 2015 RTM What’s new since last year? Android Demo – Buiding with Gradle iOS Demo – Co-development with Xcode Game Engines Demo – Cocos2d-x Android development in VS Cross-Platform UI Demo – Android, iOS, and Universal Windows UI Resources

Recap – December 2015 Meeting } Cross-platform mobile app development with Visual C++ https://www.youtube.com/watch?v=2Y47g8xNE1o More platforms = bigger marketshare = more money Game developers on avg target more platforms (custom fullscreen UI) I also explained the Silo Approach (use dominant dev-tools for the platform): Windows: C#, C++/CX Android: Java iOS: ObjC, Swift But: minimal code reuse, higher dev cost, one platform becomes the dominant platform Also mentioned was the cross-platform approach using a framework (Phonegap, Xamarin, ....) But: no fast iteration (wait for support for new SDK for example), run-time perf

Agenda Recap What’s new since last year? Cross-Platform UI Resources December 2015 Meeting C++ Common Denominator Visual Studio 2015 RTM What’s new since last year? Android Demo – Buiding with Gradle iOS Demo – Co-development with Xcode Game Engines Demo – Cocos2d-x Android development in VS Cross-Platform UI Demo – Android, iOS, and Universal Windows UI Resources

Recap – C++ Common Denominator Build 2015 10/26/2017 5:34 AM Recap – C++ Common Denominator Benefits Full native experience Total access to the device as provided by the SDK Code Reuse (own + 3rd party) Performance Battery life Security Windows iOS Android C#, CX ObjC, Swift Java ---------- C++ ---------- C++ ---------- C++ So Why does 75% use C++? C++ is supported on all platforms -> common denominator Reuse: There is a lot of C++ code out there, game engines like Unreal or EA’s frostbite are primarily written in C++, and in addition to this C++ provides me the opportunity to share this cross-platform code easily across platforms. Performance: Native code runs directly on the hardware, and not in a VM such as the case in .Net and Java, as a result C/C++ code runs faster. Battery life: runs faster, needs less time, longer battery life Security: It is harder to de-obfuscate C/C++ code. © 2015 Microsoft Corporation. All rights reserved. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

Recap – C++ Common Denominator Build 2015 10/26/2017 5:34 AM Recap – C++ Common Denominator .appx .apk .ipa Shared C++ backend is compiled as: XAML XML .appx .apk .ipa C#, C++/Cx Java Dex / ART ObjC Swift Dynamic Link Library (.dll) Static Library (.lib) Dynamic shared library (.so) Static library (.a) Cocoa Touch C# C++/Cx Java Pinvoke C++ Wrapper Java/C++ JNI Wrappers ObjC Wrapper Moments Shared C++ Backend DropBox So how does the architecture of a C++ cross-platform mobile app look like for apps like Office, Skype and BingMaps. Well its typical to write your UI layer for your app in C#/XAML on Windows, XML/Java on Android and ObjC (UI Kit) for iOS and then write your entire business logic in cross-platform C++. Pinvoke connects that bridge when using C#/xaml on windows, JNI connects that bridge when using Java XML and its fairly easy to call C/C++ code from the ObjC layer. A lot of internal Microsoft Applications (Office, Skype, BingMaps) are built in this manner. Office for example, has almost 90% of code written in cross-platform C++. © 2015 Microsoft Corporation. All rights reserved. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

Agenda Recap What’s new since last year? Cross-Platform UI Resources December 2015 Meeting C++ Common Denominator Visual Studio 2015 RTM What’s new since last year? Android Demo – Buiding with Gradle iOS Demo – Co-development with Xcode Game Engines Demo – Cocos2d-x Android development in VS Cross-Platform UI Demo – Android, iOS, and Universal Windows UI Resources

Recap – Visual Studio 2015 RTM Build 2015 10/26/2017 5:34 AM Recap – Visual Studio 2015 RTM Easy installation, Single installer One C++ IDE for your cross-platform needs (Windows, Android, iOS, and Linux) Share and reuse cross-platform code State of the Art code-editing features Powerful debugging experience Fast emulation Easy jump start thanks to cross-platform templates Visual C++ Code-editing features across all platforms: Refactoring Intellisense Fast emulation: Hyper-V based devices emulator © 2015 Microsoft Corporation. All rights reserved. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

Agenda Recap What’s new since last year? Cross-Platform UI Resources December 2015 Meeting C++ Common Denominator Visual Studio 2015 RTM What’s new since last year? Android Demo – Buiding with Gradle iOS Demo – Co-development with Xcode Game Engines Demo – Cocos2d-x Android development in VS Cross-Platform UI Demo – Android and Universal Windows UI Resources

New with Visual Studio 2015 Update 3 Build 2015 10/26/2017 5:34 AM New with Visual Studio 2015 Update 3 Android Support for latest Android NDK (R11C) 64-bit Android NDK’s upgrading current projects to target latest NDK © 2015 Microsoft Corporation. All rights reserved. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

New with Visual Studio 2015 Update 3 Build 2015 10/26/2017 5:34 AM New with Visual Studio 2015 Update 3 Android Support for Gradle build system Build Android artifacts AAR: Android library project APK: Android application package Reference other Android libraries Gradle is the default Android build system. © 2015 Microsoft Corporation. All rights reserved. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

Java Language Service For Android Build 2015 10/26/2017 5:34 AM Java Language Service For Android Supports following features for Java sources in Android projects: Syntax and semantic colorization Semantic highlighting Error/warning squiggles Auto-complete Parameter help Quick info tooltips Go-to definition - Available on Visual Studio Gallery - Will be demoed later © 2015 Microsoft Corporation. All rights reserved. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

Java Language Service For Android Build 2015 10/26/2017 5:34 AM Java Language Service For Android Debugging of Java supported set debugger to “Java only”! Will be demoed later. © 2015 Microsoft Corporation. All rights reserved. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

Eclipse Android Project Import Build 2015 10/26/2017 5:34 AM Eclipse Android Project Import Imports existing Eclipse projects into VS File > New > Import Android Projects From Eclipse… © 2015 Microsoft Corporation. All rights reserved. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

Demo… Building with Gradle

Demo – Gradle Support in VS 2015 U3 Build 2015 10/26/2017 5:34 AM Demo – Gradle Support in VS 2015 U3 Description Build your Android application with the Gradle build system and easily reference other Android libraries Feature Capabilities State of the art coding experience with Java and C++ Powerful debugging for your Java and C++ code Gradle Build System Referencing Android libraries (.aar, .jar) easily in your Android Code Incorporating Maven dependencies Jump start development with templates and samples Resources VC++ Blog, “Build your Android applications in Visual Studio using Gradle” ( https://blogs.msdn.microsoft.com/vcblog/2016/06/12/build-your-android-applications-in-visual-studio-using- gradle/ ) © 2015 Microsoft Corporation. All rights reserved. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

Agenda Recap What’s new since last year? Cross-Platform UI Resources December 2015 Meeting C++ Common Denominator Visual Studio 2015 RTM What’s new since last year? Android Demo – Buiding with Gradle iOS Demo – Co-development with Xcode Game Engines Demo – Cocos2d-x Android development in VS Cross-Platform UI Demo – Android, iOS, and Universal Windows UI Resources

New with Visual Studio 2015 Update 3 Build 2015 10/26/2017 5:34 AM New with Visual Studio 2015 Update 3 iOS - Seamlessly develop iOS applications in VS and Xcode Co-development with Xcode for iOS projects Wizard to import XCode projects into VS Open in Xcode (+pull back), for non C++ workflows Making UI changes Changing storyboards Signing your iOS application for the store … Support for frameworks and dynamic libraries Improved edit-build-debug cycle Dynamic device population Dynamic device population: easier to refresh debug target list when (dis)connecting devices © 2015 Microsoft Corporation. All rights reserved. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

Demo… Co-development with Xcode

Demo – Co-development with Xcode Build 2015 10/26/2017 5:34 AM Demo – Co-development with Xcode Description Seamlessly develop your iOS application in Visual Studio and Xcode Feature Capabilities Import your existing iOS application from Xcode to Visual Studio Open in Xcode (for non C++ workflows) Making UI changes Changing storyboards Signing your iOS application for the store … Support for dynamic population of debug targets Support for frameworks and dynamic libraries Resources MSDN – “Import an Xcode project” ( https://msdn.microsoft.com/en-us/library/mt735163.aspx ) MSDN – “Sync Changes Between Xcode and Visual Studio” ( https://msdn.microsoft.com/en-us/library/mt748656.aspx ) © 2015 Microsoft Corporation. All rights reserved. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

Agenda Recap What’s new since last year? Cross-Platform UI Resources December 2015 Meeting C++ Common Denominator Visual Studio 2015 RTM What’s new since last year? Android Demo – Buiding with Gradle iOS Demo – Co-development with Xcode Game Engines Demo – Cocos2d-x Android development in VS Cross-Platform UI Demo – Android, iOS, and Universal Windows UI Resources

New with Visual Studio 2015 Update 3 Build 2015 10/26/2017 5:34 AM New with Visual Studio 2015 Update 3 Support for popular game engines, e.g. Cocos2d-x Jump start project available © 2015 Microsoft Corporation. All rights reserved. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

Demo… Cocos2d-x Android development in VS

Demo – Cocos2d-x Android dev in VS Build 2015 10/26/2017 5:34 AM Demo – Cocos2d-x Android dev in VS Description Use Visual Studio Cocos2d-x starter project to jump-start your android development. Feature Capabilities Productive coding experience for your Java and C++ code Building your Cocos2d-x android engine using Ant Build system Powerful debugging experience for your Java and C++ Android code Resources VC++ Blog, “Cocos2d-x Visual Studio Android Project” ( https://blogs.msdn.microsoft.com/vcblog/2016/07/12/cocos2d-x-visual- studio-android-project/ ) © 2015 Microsoft Corporation. All rights reserved. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

Demo – Cocos2d-x Android dev in VS Setup a new Cocos2d-x project following the standard pattern Download from http://www.cocos2d-x.org/download Unzip it Make sure Python is installed From command line navigate to unzipped folder, then run: python setup.py to setup the environment followed by (might need to restart console) cocos new MyNewGame -l cpp -d projects to create a new C++ game project Download Android targeting VS project from https://aka.ms/vscocosandroidsample and unzip side-by-side with other generated project types (currently available for v3.12) Build and run

Agenda Recap What’s new since last year? Cross-Platform UI Resources December 2015 Meeting C++ Common Denominator Visual Studio 2015 RTM What’s new since last year? Android Demo – Buiding with Gradle iOS Demo – Co-development with Xcode Game Engines Demo – Cocos2d-x Android development in VS Cross-Platform UI Demo – Android, iOS, and Universal Windows UI Resources

Cross-Platform UI Games Apps Usually have custom UI looking the same on all platforms Pure OpenGL Game engines like Cocos2D-X, Unreal Engine, … Apps Sometimes have custom UI  Same as games Mostly want to use native platform UI C++ backend + Xamarin UI layer (C#) C++ backend + thin platform-specific UI layer Android: Java + XML + JNI iOS: Cocoa Touch + ObjC wrappers Windows: XAML (C# or C++/Cx) + Pinvoke or C++ wrappers

Demo… Android, iOS, and Universal Windows UI

Demo – Android, iOS, and UW UI Build 2015 10/26/2017 5:34 AM Demo – Android, iOS, and UW UI Description C++ code with thin platform-specific UI. Feature Capabilities Shared C++ code Android-specific UI iOS-specific UI Windows Universal App-specific UI © 2015 Microsoft Corporation. All rights reserved. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

Agenda Recap What’s new since last year? Cross-Platform UI Resources December 2015 Meeting C++ Common Denominator Visual Studio 2015 RTM What’s new since last year? Android Demo – Buiding with Gradle iOS Demo – Co-development with Xcode Game Engines Demo – Cocos2d-x Android development in VS Cross-Platform UI Demo – Android, iOS, and Universal Windows UI Resources

Resources Visual C++ Cross-Platform Mobile Documentation http://aka.ms/vsmobilecpp Visual C++ Blog blogs.msdn.com/b/vcblog/ Me marc.gregoire@nikon.com Ankit Asthana – program manager cross-plat mobile dev story aasthan@microsoft.com

Questions ?

Widescreen Test Pattern (16:9) Aspect Ratio Test (Should appear circular) 4x3 16x9