In this chapter we will cover:
For many, building a Titanium app will be their first experience with a large, complete JavaScript project. Whether you are designing a small expense tracking system or a complete CRM tool, implementing proper design patterns in Titanium will improve the performance and maintainability of your app.
The cross-platform nature and underlying architecture of Titanium influences how many common design patterns can be implemented. In this chapter, we will demonstrate how to apply patterns to increase speed of development while implementing best practices for multiple device support.
Appcelerator Titanium Mobile is a platform for building cross-platform native mobile applications using modern web technologies, such as JavaScript, CSS, and HTML. Titanium Mobile is an open source project developed by Appcelerator Inc and licensed under the OSI-approved Apache Public License (Version 2).
The Titanium Mobile project is one of the most active on Github with a large number of commits each day. The Github repository is the focal point for many in the community including module developers, app developers needing night builds, and individual contributors to the Titanium project.
The Titanium ecosystem is one of the largest in the industry with a community of more than 450,000 worldwide developers running apps on 10 percent of the world's devices. Appcelerator boasts one of the largest mobile marketplaces providing third-party components for Titanium Mobile platform.
Titanium is a module-based mobile development platform consisting of JavaScript and native platform code (Java, Objective-C, and C++). The architectural goal of Titanium is to provide a cross-platform JavaScript runtime and API for mobile development; this differs from other frameworks' approaches of building "native-wrapped" web applications.
Titanium uses a JavaScript interpreter to create a bridge between your app's JavaScript code and the underlying native platform. This approach allows Titanium to expose a large number of APIs, and native UI widgets without sacrificing performance. Titanium's UI controls are truly native and not visually emulated through CSS. Thus, when you create a Ti.UI.Switch
, it is actually using the native UISwitch control on iOS.
Each Titanium application is organized into layered architecture consisting of the following major components:
At runtime, the Titanium SDK embedded within your app creates a native code JavaScript execution context. This execution content is then used to evaluate your app's JavaScript code. As your JavaScript is executed, it will create proxy objects to access native APIs such as buttons and views. These proxies are special objects that exist both in the JavaScript and native contexts acting as a bridge between the two environments.
For example, if we have a Ti.UI.View
object and we update the backgroundColor
to blue
, the property is changed in JavaScript and then the proxy then updates the correct property in the underlying native layer as shown in the following diagram:
Titanium provides a high-level cross-platform API, however it is not a write once, run anywhere framework. When building cross-platform apps, it is recommended to adopt a "write once, adapt everywhere" philosophy. With Titanium you can add platform-specific code to handle each platform's different UI requirements, while keeping your business logic 100 percent cross-platform compatible.
Building best of breed cross-platform applications, Titanium provides tools to:
In addition to platform tooling, the Titanium API is designed to assist with cross-platform development. Each major component such as Maps
, Contacts
, and FileSystem
are separated into its own component namespaces under the top-level namespace called Ti
or Titanium
. These component namespaces then have their own child namespaces to segment platform-specific behavior.
An example of this segmentation is the Ti.UI namespace
, which contains all UI components. This namespace contains common APIs such as Ti.UI.View
and Ti.UI.TableView
. Additionally, the Ti.UI
namespace has platform-specific child namespaces such as Ti.UI.iPad
containing controls such as Ti.UI.iPad.Popover
. The same design applies to non-visual APIs such as Ti.Android
, a namespace which contains Android-specific behavior.
18.189.171.52