Mobile App Development on Multiple
Platforms Using Titanium
Campus Compass Team Student Led Seminar
Adam Plisch, Brian Russell, Jonathan LeFeber
Team/Project Introduction
 Project: Campus Compass Mobile App
 Android and iOS app for Cedarville Admissions Department
 Designed to provide information about Cedarville as well as
 Team and Roles:
 Adam Plisch:
 GUI guru, on-campus connections and testing
 Brian Russell:
 Data master, in-depth code analysis and development
 Jonathan LeFeber:
 Team leader and head of organization/communication
Seminar Introduction
Titanium, Difficulties with Cross-Platform Development,
Handling These Difficulties
Titanium Development Environment
 Free-to-use multi-platform development environment
 Handles multiple target OSs with (mainly) one set of code
 Write your App in Javascript
 Ports out to iOS, Android, Blackberry and HTML5 versions
 Can be run on Mac or PC
Difficulties With Cross-Platform
 Code is being ported from Javascript to several
different languages
 Restricts what can be done
 Functionality added with environment-specific APIs
 Designing for a large variety of device configurations
 Different hardware specifications and software options
available depending on device
 Special ways of handling platform-specific code within
the development environment
Handling These Difficulties
 Built in functions/APIs in the development environment
 Using special cases to determine available
 Simplifying everything as much as possible
 Can result in convoluted code
The Development Environment
 iOS and Android have specific development paths and
 Titanium works within these processes
 Applications built with Xcode using Objective-C
 iOS Simulator
 Xcode obtained via Apple App Store, others obtained
via Xcode
 Requires OSX
 C allowed, but limits targets
 Java preferred, requires JDK
 Android SDK
 Android Emulator
 Eclipse is endorsed Java IDE, but not necessary
 Titanium uses Javascript and provides libraries with
access to platform functionality
 IDE with debugging capabilities on both real and virtual
Handling Cross-Platform Issues
Differences between Android
and iOS
 Titanium handles most differences between iOS and
Android behind the scenes, but not all of them
 can be used in an if-statement
to make platform specific decisions
API Examples
 Example 1:
 Example 2: var email =
 Example 3: var button = Titanium.UI.createButton();
 Example 4: var view = Titanium.UI.createView();
Some Differences not handled
by Titanium
 Back button
 Android’s has a back button implemented in hardware and
needs no added code
 iPhone requires the addition of a navigation bar at the top of
your app which can include a simple back button
 Gradient colors
 Only supported by iOS
 Set a gradient image as the background
 You can review the whole API at:
 While allows you to separate
functionality by platform, only careful planning can make a
robust GUI that works on all devices
 There are many different types and sizes of devices for both
Android and iOS
 Screen resolution and orientation provide added challenge
 There are 2 different screen sizes and 3 different resolutions
for iPhone, and a really wide variety for Android
 Not even counting tablets!
GUI – Dynamic Sizing
 Titanium provides a call to get the height and width of the current
 Titanium.Platform.displayCaps.platformWidth
 Titanium.Platform.displayCaps.platformHeight
 Start by dividing these values into separate views
 Titanium.UI.SIZE
 Titanium.UI.FILL
 Each view has its own height and width and an array of children
 Each child is confined to a maximum height and width of the
parent view
 Can contain text, images, or buttons
GUI – Portrait-mode only
 If your app does not support Landscape mode, you
must account for what happens when your app
launches from a device held in landscape mode
 Your platform height and width values will be reversed
 The API does not support a call to determine orientation
 If height > width, portrait mode
 Else, landscape mode
GUI – Splash Screen
 Required for all apps in iOS
 Displays an image while the rest of the application
loads in the background
 If your portrait-mode only app is launched from a
device in landscape mode, your splash screen will
 There is no good solution to this in Titanium
 You could use a black splash screen to get around this
GUI – Font Size
 Every other aspect of a GUI is a percentage of its
parent. What about font size?
 A font size of 18 will use the same number of pixels on
any device
 Density Pixels
 1 dp should look the same relative to the rest of the GUI on
any device
 Javascript is not a strongly-typed language
 fontsize = 18 + “dp”;
Getting your iOS and Android Apps compiled and out there
Overall Compilation Process
 Platform project is created
 Javascript code is optimized
 Code is either compiled or stored to be interpreted
 Result is packaged and signed
iOS Compilation
 Javascript code compressed and included as a string in
a C file
 Interpreted at runtime through interpreter provided by
Android Compilation
 Javascript compiled to Java bytecode with Rhino
 Runs directly on Android’s Dalvik VM
 iOS requires distribution through App Store
 Android has official Play Store, but can download apps
from anywhere
 Both require certified accounts
 App Store has a manual review process
 Play Store has automated dynamic analysis
In Closing…
Summary of experience, what you’ll need, where to get
Summary of Experience
What You’ll Need
 PC
 Mac if developing for iOS
 Apple Developer Account to test on iOS
 Apple Developer License to deploy to App Store
 Google Development License to deploy to Play Store
 Testing devices
 Best to have one of every type of device you plan on
deploying to
 iPhone, iPad, Android phone, Android tablet
Where to get started
 Example program
 Titanium’s ‘kitchen sink’ app
 Great resources to help you get started
Any questions?

similar documents