Developing for iPhone, iPad and Android Using Single Source JavaScript | Wed 1 Sep 2010 | Blog

Developing for iPhone, iPad and Android Using Single Source JavaScriptWed 1 Sep 2010

Not long after you buy yourself a smartphone/iPad you find yourself thinking "What can I make for this?"

After I bought the HTC Hero I wrote a personal-use app for it, which did the job well. Writing it was a pain though and meant getting to grips with yet another SDK/API/Language.

Now I find myself wanting to mess about with the Apple iOS SDK to create something for my iPad. But I can't be bothered delving in to the SDK.

Wouldn't it be nice if you could write apps for your devices in a language you already know?!

Enter Appcelerator Titanium, which, in their words, is:

A free and open source application development platform, Titanium lets you create native mobile, tablet and desktop application experiences using existing web skills like Javascript, HTML, CSS, Python, Ruby, and PHP.

No need to learn Cocoa or anything you don't already know. You can create apps that work cross-platform from one JavaScript source file.

Here's an example:

emulators

As you can see there are two emulators running - one for Android and one for iPhone - alongside the Titanium app (which is used to manage the project, emulators and packaging of files) and the JavaScript source file being edited in TextMate.

The app you see is just a variation on the default file you get when creating a new mobile project in Titanium. Nothing special. Just two tabs. One called Jake and one called Karen.

Taking it further you can find inspiration in their showcase page. Then download and play in their "Kitchen Sync". Or read the guides.

Thanks to Jeff Gilfelt for pointing me to this app. I won't have real need for it for a while but it's good to know it exists and that I have it installed and ready to go when the time comes.

Comments

- Simon Walker
- Wed 1 Sep 2010 08:35 AM
Very interesting. We are just about finishing an iPad web application. Our app was developed with the Sencha Touch tools/framework and the app interfaces to a Domino back-end and uses the iPad browser local datastore to hold data if the app can't sync with the server.

Reply
- ChrisC
- Wed 1 Sep 2010 08:35 AM
Jake,
Will be developing something in the near future on domino and have been weighing jquery and dojo based options - heard of this a couple of months ago. Will put it back on the radar..
Ta!!

Reply
- bruce lill
- Wed 1 Sep 2010 09:10 AM
Titanium seems to work the best but PhoneGap has better iPhone support.
so if you can't do an offline html5 app then this is the next step to go.

Reply
1. - Robert
  - Tue 15 Mar 2011 03:33 PM
  you mean integration to xcode? as xcode is the editor for it?
  I've seen a couple of featured apps from their site by downloading them through the app store and the resulting views leave much to be desired. I mean instead of opening a native view, it opens an html file with functions that call into native io.
  Appcelerator seems to have a better grasp of the whole iphone nib framework itself.
  
  Reply
- mdmadph
- Wed 1 Sep 2010 09:10 AM
Titanium is definitely one way to go -- I like its use of JavaScript; no need to learn new code.
However, with the increasing worry about Apple cracking down on third-party app creators, combined with the fact that BlackBerryOS 6.0 now has a webkit browser, a lot of people are making web apps these days for mobile use... ;)

Reply
- Richard Moy
- Wed 1 Sep 2010 09:42 AM
Jake,
I will be interested hear your experience with this. I have been looking into using this also.

Reply
- Kamal Rij
- Wed 1 Sep 2010 01:23 PM
Jake,
You can also look at the ELIPS Studio tool for cross platform
development.
http://www.openplug.com/

Reply
- Alex Hernandez
- Wed 1 Sep 2010 02:21 PM
Hi Jake, I've been using Titanium for a while, and it seems the right tool for us, web developers, to create mobile applications.
One of my favorite things is the fact that you can create desktop RIAs with it too. I use AIR for desktop apps as well but it lacks of mobile support since it relies on adobe flash and the run-time itself.
One nice thing on Titanium is that they will include blackberry support in the next release (they are in beta).
.::AleX::.

Reply
- Scott Schwarzhoff
- Wed 1 Sep 2010 05:16 PM
Hello all -
Scott from Appcelerator. To clarify a few points, we have never had an app rejected for using Titanium.
We have had 4,000 applications accepted to date, and we're growing at 1,000 per month. We'll be at 10,000 apps in iPhone/Android/BlackBerry app stores by the end of this year.
As for capabilities and comparisons? Try it out and see for yourself what works best for you. NBC, eBay, MTV, Budweiser and many others use it for rapid, yet native, app development.

Reply
1. - Robert
  - Tue 15 Mar 2011 02:41 PM
  What if I want to add some flare to the resulting views. Will I have some constraints in terms of how much flare i can put into the iphone app?
  Don't get me wrong... developing cross platform from within a central point of development is quite an achievement!!!
  Suppose I want to modify the resulting iphone app to add more flare, what things right now can't you not do yet?
  (OpenGL i think is should obviously be out of the question)
  
  Reply
- RobShaver
- Wed 1 Sep 2010 09:43 PM
Appcelerator Titanium looks interesting. And even though I believe Scott when he says Apple hasn't rejected any apps build with Titanium ... yet, I would never use an iPhone or develop for that platform because of the bazaar and unpredictable behavior exhibited by Apple.
Besides Android phones are outselling iPhones by a huge margin.
The Android OS has its own set of issues, however, not the least of which is Oracle suing Google over their Java implementation violating Sun's license.

Reply
1. - S.
  - Thu 2 Sep 2010 02:53 AM
  While Android sales have surpassed iPhone sales in the last Quarter, I wouldn't yet call it "a huge margin" (and iPhone sales don't include iPads+iPod touches).
  Regardless, Jake is probably going to develop business apps that won't be distributed through the app store but deployed directly in the phones using the Enterprise tools that Apple provides for business, and there are not restrictions as to which tools you use to develop there (you can even use the private APIs at will).
  
  Reply
  
  Show the rest of this thread
  1. - Rob Shaver
    - Thu 2 Sep 2010 10:48 AM
    You can't deploy iPhone apps any other way except through the Apple app store unless you jail-break the iPhone. Developers can deploy a few limited apps for testing but it's not practical to distribute that way. Apple's made darn sure of that!
    
    Reply
    1. - Kerr Rainey
      - Fri 3 Sep 2010 02:37 AM
      While I'm not sure of the exact details, if you are a large enough business then you can deploy "In House" apps. This does not follow the same approval / app store model that regular apps use.
      http://www.apple.com/iphone/business/apps/in-house/
      
      Reply
  2. - Rob Shaver
    - Thu 2 Sep 2010 10:58 AM
    "Android jumped to 17.2 percent of the worldwide smartphone operating system market, selling 10.6 million units, up from 1.8 percent a year ago with 755.2 thousands units sold. Apple’s iOS, by contrast, showed a smaller increase of market share, up just 1.2 percent from the same period last year, when it stood at 13 percent of the global smartphone operating system market.
    In the U.S., the Android platform displaced the RIM OS to become the No. 1 smartphone operating system in the United States, Gartner announced"
    http://www.cultofmac.com/analyst-android-leaps-ahead-of-sluggish-iphone-sales/54740
    As you said, this doesn't include iPad/iPod sales, but the predictions are that, by the end-of-year holidays, we'll be hip deep in slates that run Android.
    
    Reply
    1. - Robert
      - Fri 11 Mar 2011 08:15 AM
      Developing for Android is a pain in the arse. You see there are so many Android distros plus hardware... There's hardly any guarantee that your app will run as tested in different models.
      I finally got Apple's evil obsession of tightening the OS and the hardware. If you lose control of that marriage like Android has then its really useless. You can compare the Apple AppStore with Android anyday and you will see what I mean. Too many utility apps with two or less stars and that is the end user satisfaction.
      Are there too many fart apps in Apple? indeed. But they are still better written or will run as expected in all tested environments that Xcode provides.
      Saurik (the guy behind Cydia) at some point lost interest in apple products and decided to stop fighting Apple's evil ways. Then realized that having an open OS is in no way an advance when one has no control on the models out there. So many apps like skype having to be re-written and maintained for many models. That insatisfaction will in the long term have more users switching out of android to something better.
      
      Reply
- Tim C
- Thu 2 Sep 2010 06:39 AM
Of course, when (*if*) all browsers are HTML5 compliant all you need is javascript and a manifest file : I have already developed an iPhone/iPad 'app' that works offline, connects via ajax to servers to download data and uses HTML 5's own SQL language to manipulate data.
(Also works on safari and chrome on pc, but have not yet fixed some issues on Android phone)
That should be the way to go!

Reply
1. - Chris C
  - Thu 2 Sep 2010 04:44 PM
  Tim,
  Do you have any sample code or a link to a page that shows you how to do this? Do you connect to a page online and then when you go offline it just continues to work? How does it know when you are back online and replicate the changes that you made while offline?
  
  Reply
  
  Show the rest of this thread
  1. - Tim C
    - Fri 3 Sep 2010 06:14 AM
    Chris
    I have learnt a fair bit during this exercise - not all good.
    Firstly, HTML5 browsers will cache locally any files mentioned in the manifest file UNTIL the manifest file changes by at least one byte (not the date time stamp).
    Thus, having listed your js /html/css/images in the manifest, the browser/device finds them locallyunless the manifest changes.
    Caveats:
    a. make sure your web server doesn't also cache the manifest! (I put it in a sub folder and turn off caching on that folder)
    b. Even ifyou change the manifest iPod/iPad can be a real pita to force to pick up changes, so write our app without the manifest and only create that when you are sure you wont' be making regular changes to the files
    Secondly, I know when I am online using this function
    function areWeOnline(){
    awo = 0;
    if(window.navigator.onLine==true){
    awo=1;
    }
    so I know whether or not I can connect to the web server and start using ajax to download content
    If you have any more questions, let me know
    
    Reply
- John Turnbow
- Fri 3 Sep 2010 07:41 AM
Since IBM is "touting" being endpoint agnostic wouldn't it be nice if IBM created a tool? Or had a partner that made this "endpoint agnostic" dream a reality? Am I expecting too much?

Reply