Chapter 1. Patterns and Platform Tools

In this chapter we will cover:

  • Defining an app namespace
  • CommonJS in practice
  • Using platform indicators
  • Global logging using Ti.App.Listener

Introduction

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.

Introducing Titanium

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.

Architecture of Titanium

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:

  • Your JavaScript code: At compile time, this will be encoded and inserted into Java or Objective-C files
  • Titanium's JavaScript interpreter: On Android V8 or JavaScriptCore for iOS
  • The Titanium API: This is specific for a targeted platform created in Java, Objective-C, or C++
  • Native Custom Modules: A large variety of open source and commercial modules are available
    Architecture of Titanium

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:

Architecture of Titanium

Building a Cross-platform

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:

  • Identify the platform and model at runtime
  • Ability to handle platform-specific resources at build time
  • Apply platform and device-specific styling

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.

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset
18.189.171.52