Creating application for Android OS on Titanum Appcelerator platform

The following article is giving a description of Titanium Appcelerator platform opportunities. It also presents the list of the most frequently used objects of Titanium, as well as their features and methods.

First, let's get a general item of information about Titanium Appcelerator platform.

Apart from desktop apps, Titanium Appcelerator allows writing applications for mobile phones. Accordingly, the mentioned kind of application development gets split into 2 big parts: Titanium Desktop and Titanium Mobile.

We have a possibility to write applications for cellphones with such OS as Android, Blackberry, iPhone. There's no doubt with such a choice operating systems one can  write applications for, make you impressed. In the article below we'll talk about the process of writing application for OS Android.

In order to write a program for Android, any web developer will require the knowledge of JavaScript. The program consists of objects that are inserted into it. Each object will have its unique features and will get its own methods employed. A list of objects gives us possibility to use practically all OS  resources.

Titanium Appcelerator  platform speeds up application development for Android because it's going to be longer to write program with Java than to write program on Titanium with the help of JavaScript. But programs written on Java will work faster. But here one of eternal questions of choosing program language arises: performance or expenses.

For you to write a simple application you need to know some objects of  Titanium. UI section. The most common objects are the following:

• Titanium.UI.Button
• Titanium.UI.ImageView
• Titanium.UI.Label
• Titanium.UI.ScrollableView
• Titanium.UI.View
• Titanium.UI.Window

Now let's look closer at the objects:

First of all it's necessary to clarify all rules of program writing.  One of the important aspects of program writing is correct object position. Every object has its value and property.

One of the main objects is Titanium.UI.Window. Creation of object happens with the help ofTitanium.UI.createWindowmethod. An object has a list of its features and methods. Having this long list of features we can set a background color, write its title, place it in the necessary spot (left, right, top, bottom) etc. We also shouldn't forget about methods such as open , add and some other methods.

Example:

var window = Titanium.UI.createWindow({
   backgroundColor:'red', 
   title: 'My Root Window'
});
window.open(); 

One of the frequently used objects is Titanium.UI.ScrollableView. ScrollableView is so-called container with a scroll. In other words other objects are put into the object, and if there is not enough space on the csreen, we can enable scroll to ScrollableView. You can create an object with the hekp of Titanium.UI.createScrollView method. There are also specific methods and objects.

Example shows the output of other objects with the help of ScrollableView.

var view1 = Titanium.UI.createView({backgroundColor:'red'}); 
var view2 = Titanium.UI.createView({backgroundColor:'green'});
var view3 = Titanium.UI.createView({backgroundColor:'yellow'});
var scrollView = Titanium.UI.createScrollableView({
    views:[view1,view2,view3], 
    showPagingControl:true 
});
/*
ScrollableView content was specified during object creation. But other objects in ScrollableView can also be created with the help of add method.
In our case instead of specifying content in object, we can write:
scrollView.add(view1);
scrollView.add(view2);
scrollView.add(view3);
which will be correct
*/
window.add(scrollView); 
window.open();

It is for placing objects into the program that Titanium.UI. View element is characterized for. Simply saying View element provides us with a so-called container, or something like div tag. In the container, we can edit the view of other elements that are contained there. Some of the most necessary features of View are size and position features, and also view border features and its background color.

Next example shows us how to create View object:

var button = Titanium.UI.createButton({
   title: 'Hello'
});
button.addEventListener('click',function(e) 
{
   Titanium.API.info("You clicked the button"); 
});

Titanium.UI.ImageView is an element for image output. Image itself can be set in image properties. Image url or full path from file where program is written can be set in properties. It's also advisable to give exact size.

To create ImageView object, it's enough to write the following script:

var image = Titanium.UI.createImageView({
    image:'myimage.png', 
    width:'auto',
    height:'auto' 
/*
If we want to add image from internet, it's enough to specify in properties url instead of image 
It will look the following way:
   url: 'http://a2.twimg.com/a/1310750171/phoenix/img/twitter_logo_right.png'
*/
});
view.add(image); 

So how will a program do without the most simple element Titanium.UI.Label? The element is for text output. Among other properties there are such as font size, text style, its color. We shouldn't forget that HTML text can be written for phones with OS Android. Using HTML bigger opportunities for text display are opening before us.

Summary

In this article our Drupal development agency got acquainted with peculiarities of Titanium Appcelerator platform. We also found out characteristics of programming in Titanium Mobile and examined some widely used objects of Titanium.UI group.