UI Prototyping and Development Across Multiple Devices with C++ John JT Thomas
First off, what is a device? Anything with a CPU, memory, and RTOS (embedded device) AND with display, and input (mobile devices) AND An app ready operating system (ios/android/windows/etc.)
It s all about the Client Again
An Unprecedented Multi-Device Landscape
When will Tablets surpass Notebooks? This year. 10
Apps for every device http://www.smartinsights.com/mobile-marketing/mobile-marketing-analytics/mobile-marketingstatistics/
2013+ Client Diversity Will continue to Expand
Apps are everywhere So is C++
C++ is perfect for these apps C++ is a cross-platform language There are C++ compilers for every single (relevant) device out there C++ is particularly well suited for embedded devices
Native is Key for Client Device UX Servers Client Devices Code Safety & Protection is Paramount Ability to Scale Performance via HW Web UX typically network bound UX Performance is Paramount Fixed/Deployed HW Profiles UX typically HW bound Virtual Code: Java,.NET, HTML5/JS Native Code: C++, Obj-C, Delphi 15
Why isn t C++ used on all devices then? Some developers view it as too complicated Although there is a language and library standard there are a lot of differences in that level of support across platforms There is no standard User Interface controls specification
C++ is being used in a hybrid way Developers with a C++ source code base keep app logic in C++ For presentation layer, use provided APIs in provided language Objective-C / Cocoa Java / Dalvik HTML5/JavaScript/PhoneGap
Typical Application Architecture Presentation Layer Business Layer Data Access Layer
Current multi-device C++ strategy ios Android BlackBerry 10 C++ Source Code WinRT
Current multi-device C++ strategy ios Android BlackBerry 10 Presentation Layer C++ Source Code WinRT
Current multi-device C++ strategy ios Obj-C/Cocoa Android Java/Dalvik BlackBerry 10 C++/Cascades C++ Source Code WinRT C++/WinRT
The Traditional Approach for Targeting Multiple Devices $ $ $ $ $ $ $ $ $ $ $ $
Current multi-device C++ strategy ios Android BlackBerry 10 HTML/JS/CSS C++ Source Code WinRT
Current multi-device C++ strategy ios Android BlackBerry 10 Embarcadero FireMonkey C++ Source Code WinRT
The C++Builder Native Multi-Device Approach $ 25
UI Design and Visual Prototyping Across multiple devices with C++
Visual Design / Prototyping
Visual Designer Provides a design surface for the layout of UI controls Allows modification of design time properties Creates event handlers for common events Displays live or prototype data in designer
Component-Based Framework
Application Frameworks C Delphi/C++ (FM) Windows Encapsulation Delegation Method Pointers (closures) Properties Text file form Windows Encapsulation Streaming-system RTTI
Modern Language Features Property-Method-Event Automatic Reference Counting Interfaces Attributes Generics/Collections Anonymous Methods (Lambda functions/closures) Rich RTTI (introspection/reflection)
RTTI and PME extensions classid delphirtti closure property published
User Interface Controls
Native CPU/GPU Application Platform Compile C++ natively to Windows, Mac, and ios * Application, database, and animation are CPU powered All UI, graphics, and effects are GPU powered
HD Forms High performance GPU powered scalable vector UIs, Bitmapped Controls, and Native Conrols Mutliple resolutions on any device Hundreds of visual UI components GPU based style engine to control UI look and feel HUDs with transparencies and transition effects
3D Forms GPU powered 3D forms Hardware based lighting, textures, and animation 3D Forms can contain HD UI elements and effects
Effects and Animation 50+ Photoshop-like GPU effects Simultaneous multiple effects without performance hit Path based animation for all HD and 3D UI and graphics
Applications that Connect Everywhere High-speed connectivity to popular databases Multi-tier applications Clients on multiple computers and devices Connect to the world of data, services, and the cloud
Application Prototyping Design and prototype your application using sample data from the TPrototypeBindSource component Add a ClientDataSet component to your form and load your actual data Simply select all of your bindings and change the data source to use your real data in your application
FireMonkey on Android and ios Native and Custom Styles True Native Apps Delphi/C++Builder components and model
Cross compilation and Packaging App Sources FM Framework Cocoa SDK Native Developer Kit.app in IPA.so in APK
Native Styling
Native controls and TEdit Cut/Copy/Paste/Zoom Message alerts Custom Picker Date Picker Phone Dialer ios Keyboards Text Editing for TMemo
Layout Management Alignment Anchors Form Family for loading the correct form depending on the target device when developing different forms for phones vs tablets and Landscape vs Portrait
Multi-Resolution Image Support TImage has been updated with MultiResBitmap property 1x and 2x options are shown by default Easily add your own resolutions, i.e. 1.5x, 3x etc. 46
Gestures
Media Library Actions Accessing the Camera App Accessing the Camera Roll Sharing content i.e. photos via Message Slide Transitions for Tabs
Sensor Components Location Sensor (GPS) Motion Sensort (Accelerometer) Orientation Sensor (Gyroscope)
Camera Provides access to camera sensors: activate flash get sensor position etc. access front/back camera take pictures/video
Location Service / GPS Sensor Commonly used in applications that require location awareness Get location of your ios device using latitude and longitude Use Reverse Geocoding to convert location data to a readable address Works across Win/Mac/iOS Can be used with the WebBrowser component to display a location on the map
Mobile Services Notification Center... and more
DataSnap MEAP N-tier Client Devices MBaaS Enterprise Backend
Review of objections C++ is too complicated Too many differences between platforms for C++ support No common User Interface
Embarcadero s Approach C++ is too complicated C++11 Visual Design/Prototyping Automatic Reference Counting Common User Interface
Embarcadero s Approach Too many differences between platforms for C++ support Common toolchain (CLANG/LLVM) Common STL (Dinkumware) across platforms Same development environment and process for targeting all platforms
Embarcadero s Approach Too many differences between platforms for C++ support Common toolchain (CLANG/LLVM) Common STL (Dinkumware) across platforms Same development environment and process for targeting all platforms Common Application Platform API
Embarcadero s Approach No common User Interfaces FM Styled and Native Controls Common layout management OS specific look and feel Fully customizable UI with Styles
Thank You and we are looking for C++ beta testers jt@embarcadero.com Questions?