Titanium（タイタニウム）を使うのは楽しい！

最近、Titanium Mobileを使ってみました。というのも、やっぱりiPhoneアプリが作ってみたくて。iPhoneアプリというと、「Objective-C」。コンパイルが必要な言語の敷居に躊躇してしまい、踏み切れなかったワタシの背中を押してくれたアプリケーションがTitanium Mobileです。

試してみた結果、JavaScriptでiPhoneアプリが作れる！とは聞いていても、JavaScriptでやることには限界あるんじゃない？とか斜に構えていて、損したよ！

とりあえず、RSSを取得して、表示するアプリを作ってみました。

出来たアプリ

とりあえず、RSSを取得して、Webで表示...
作ってみて思ったのは、

• コンパイルが面倒
• UIをJavaScriptで作るのは大変
• でも、お手軽さはスゴイ。iPhoneアプリを簡単に用意することはできそう
• アクションゲームとか、派手なゲームを作るのには向いていなさそう
• RSSなどのXMLよりも、jsonが標準的になってる？という印象
• OAuthの認証はライブラリがあってTwitterと連動、というのが一例に
• 名前は、タイタニウムと呼ぶらしい
• JavaScriptの使い方で求められることが色々とあるような...

という感じでした。

雑誌でわかる

ちょうど雑誌でも書かれているので買って読むといいよ！

WEB+DB PRESS Vol.61

追記：2011-06-11
本も出たみたいです

Titanium Mobileで開発するiPhone/Androidアプリ (Smart Mobile Developer)

ソース

app.js

Titanium.UI.setBackgroundColor('#000');

var tabGroup = Titanium.UI.createTabGroup({});

var baseWin = Titanium.UI.createWindow({
	url:'table.js',
    title:'',
    backgroundColor:'#fff'
});
var tab1 = Titanium.UI.createTab({  
    window:baseWin
});

baseWin.hideTabBar();

tabGroup.addTab(tab1);  
tabGroup.open();

table.js

var baseWin = Ti.UI.currentWindow;

// table
var tableWin = Ti.UI.currentWindow;
var data  = [];
var tableView = Ti.UI.createTableView({
    data:data
});

// feed
function updateFeed(feed) {
  var feedData = [];
  var title = feed.getElementsByTagName("title").item(0).text;
  baseWin.title = title;
  var items = feed.getElementsByTagName("item");
  for (var i=0; i<items.length; i++)
  {
    var item  = items.item(i);
    var title = item.getElementsByTagName("title").item(0).text;
    var row   = Titanium.UI.createTableViewRow(
         {
              hasDetail:true,
              height: 'auto',
              layout: 'absolute'
         }
    );
    var commentLabel  = Ti.UI.createLabel();
    commentLabel.text = title;
    row.add(commentLabel)
    feedData.push(row);
  }
  tableView.setData(feedData);

  // detail
  tableView.addEventListener(
    'click',
	function(element)
	{
	  var items = feed.getElementsByTagName("item");
	  var item  = items.item(element.index);

	  var detail    = '';
	  var detailWin = Titanium.UI.createWindow({
	    url:'detail.js',
		permalink:item.getElementsByTagName("link").item(0).text
      });
      Ti.UI.currentTab.open(detailWin);
	}
  );
}

// get
var xhr = Ti.Network.createHTTPClient();
var url = 'http://d.hatena.ne.jp/d4-1977/rss2';
xhr.open('GET', url);
xhr.onload = function()
{
  var feed = this.responseXML.documentElement;
  updateFeed(feed);
}
xhr.send();

// 
tableWin.add(tableView);

detail.js

var detailWin = Ti.UI.currentWindow;

var webView = Ti.UI.createWebView({
  url: detailWin.permalink
});

detailWin.add(webView);