App-celerating!

Appcelerator TitaniumI first tried out Appcelerator Titanium Mobile at Launch 48, with the help of some of the guys from PayPal, who had recently teamed up with Appcelerator to work on the platform.

My initial impressions were very positive, it was reasonably easy to install and the Kitchen Sink example app had some pretty slick looking stuff. I’ve played quite a bit with PhoneGap and JQTouch which is also an impressive platform, but tricky at times to create a UI that looked and behaved as smoothly as the native apps. Since Titanium compiles the JavaScript down to native code, the app looks exactly the same as a native one – and there is much less styling work needed, in fact, I was really surprised by how little code was required to get a simple app up and running.

Kitchen Sink Screenshots

Screenshot of Base UI Options in Kitchen Sink

Screenshot of Pickers in Kitchen Sink

Screenshot of Sliders in Kitchen Sink

Screenshot of Twitter in Kitchen Sink


On the downside: I’ve heard anecdotally that many people have issues installing Titanium and getting it running. It does have it’s bugs: I ran into one at Launch48 with swiping on a view within a table row inexplicably crashing the app, but I didn’t have time to figure out the root cause.

One thing it is definitely well suited for is rapid prototyping – so far I’ve been able to create a simple cover flow with about 20 lines of JavaScript code. With a better knowledge of the platform, I think I could produce a prototype more quickly than an Omnigraffle wireframe sketch – just imagine the possibilities!

There are lots of tutorials and resources on the web, so here are a few good links for getting started – and some of the ‘gotchas’ that I ran into so far.

SDKs

The website says that Titanium requires either the iPhone or Android (1.5) SDKs to compile an app, but for me the New Project button was disabled until I installed both. It usually detects when they are installed, but you can also point it to the directory.

Android installation instructions

Download iOS from the Apple iOS Developer centre– you’ll need an account but it’s free (unless you want to deploy to a real device, in which case it’s $100 :().

Install Titanium

Download Titanium from the Appcelerator site download page

This includes the Mobile and Desktop versions. Once it’s downloaded and installed, open the app and click the New Project button. Choose Mobile or iPad from the Project Type dropdown.

I had an issue where I could only choose Desktop initially, but restarting the application seemed to solve this (no idea why, but I’ve had no problems since).

Titanium will most likely tell you to download the new Mobile SDK 1.4.2. This does not work for creating new Mobile projects, although it seems to be fine for creating new iPad projects. Choose the 1.2.0 SDK version and it will create a new Mobile project.

Getting Started

Creating a new project will give you a basic app with one Javascript file: app.js, inside the Resources folder. The app contains a TabGroup and two Windows. Windows are the basic unit within the app, and they can contain tables, views and other UI elements.

I found a useful tutorial for understanding the differences between Windows, Views and Tab Groups.

The Titanium Developer documentation is useful for finding out the names and properties for the different objects – as a rule, most UI objects can be created by something like this (replace ObjectName with the object name, property: value with the relevant properties and values):

Titanium.UI.createObjectName({property:value})

The Stack Overflow-style Developer Q&A section is also really helpful.

Getting the App on to the iPad

So far I’ve only put my app on to my iPad. I needed a Development Certificate and Provisioning Profile with the correct app ID (which I had to download from the Apple Developer centre – and jeez what a pain in the butt that was!).

Within Appcelerator, go to the ‘Run on Device’. You’ll need to click on ‘Upload’ to add your Provisioning Profile. Appcelerator will detect when it has all of the necessary stuff installed, and only then will the ‘Install Now’ button become available.

Make sure you’ve got the right SDK or you’ll get an install error. Choose the right Development Certificate and Provisioning Profile. I’ve got more than one, and it caused an entitlement error when I picked the wrong one and tried to install the app on my iPad.

Then click Install Now, and the app is installed via iTunes. Voila!

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>