twitterの自分のTL表示をbakeしてみる 〜Titanium編〜

「そろそろスマートフォン向けのアプリとか作りたいよねー。」ってのが、
最近の"彼女と私の事情"だったりするわけですね。
というわけで、最近何かと話題のTitaniumを使って、iPhoneアプリでも作っちゃう?というお話。

Titaniumって何ぞや?

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

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

絶賛写経中です。
詳しいことは上の本を購入していただければ、無知な私でも割といい線まで設定できてます。
環境設定が色々面倒で、今使っているMacBookLeopardからSnow Leopardにして、
新しめのXcodeをインストールすることからこの戦いは始まるわけですね。

  • Snow Leopardのインストールパッケージを買う(¥3000)
  • インストールするときに、HDDの残容量が全然足りないので、外付けHDDを買う(¥15000)
  • データ移行とかに色々時間がかかる(1日くらい?)
  • Androidでのシミュレータテストのために、シミュレータパッケージのインストール(3hくらい)

これらのハードワークをこなしつつ、
ヨドバシカメラのイケメン店員さんにボロクソに貶される話はまたいつか紹介しますね。(本当むかつくんです。

twitterのTLを出してみる


// this sets the background color of the master UIView (when there are no windows/tab groups on it)
Titanium.UI.setBackgroundColor('#000');

// create tab group
var tabGroup = Titanium.UI.createTabGroup();

//
// create base UI tab and root window
//
var win1 = Titanium.UI.createWindow({
title:'@The_SunnySideup',
backgroundColor:'#fff'
});

var tableView = Titanium.UI.createTableView();
win1.add(tableView);

if(Titanium.Network.online == false){
alert('offline.can't connect');
}else{
var xhr = Titanium.Network.createHTTPClient();
var url = 'http://api.twitter.com/1/statuses/user_timeline.json?screen_name=The_SunnySideup';
xhr.open('GET',url,false);

xhr.onload = function(){
var json = JSON.parse(this.responseText);
for(var i=0; i<json.length; i++){
var row = Titanium.UI.createTableViewRow();
row.className = 'tweet';
row.height = 'auto';
row.add(Titanium.UI.createLabel({
text: json[i].user.screen_name,
top: 8,
left: 64,
height: 16
}));
row.add(Titanium.UI.createLabel({
text: json[i].text,
top: 32,
left: 64,
width: 256,
height: 'auto'
}));
row.add(Titanium.UI.createImageView({
image: json[i].user.profile_image_url,
top: 8,
left: 8,
width: 48,
height: 48
}));
tableView.appendRow(row);
}
};

xhr.onerror = function(error){
alert(error);
}
xhr.send();

xhr.onload = null;
xhr.onreadystatechange = null;
xhr.ondatastream = null;
xhr.onerror = null;
xhr = null;
}

var tab1 = Titanium.UI.createTab({
title:'Mine',
icon: 'dark_pegman.png',
window:win1
});

var win2 = Titanium.UI.createWindow({
title:'#TitaniumJP',
backgroundColor:'#fff'
});
var tab2 = Titanium.UI.createTab({
title:'#tag',
window:win2
});


var win3 = Titanium.UI.createWindow({
title:'Search',
backgroundColor:'#fff'
});
var tab3 = Titanium.UI.createTab({
title:'Search',
window:win3
});

//
// add tabs
//
tabGroup.addTab(tab1);
tabGroup.addTab(tab2);
tabGroup.addTab(tab3);

// open tab group
tabGroup.open();

まぁ大したことはしてないです。
全部あの本に書いてある内容なので、特別面白みはないですね。
変更点とすれば、

  • 取得するTLを自分のtwitterIDにした
  • 表示する内容を、「自分のTL」「任意のハッシュタグのTL」「検索」の3つに減らした
  • HTTPRequest後のメモリリーク回避処理を入れた

くらいなもんです。
で、実行結果がこれ。

おぉ、できとるできとる。

はまりどことか。

基本的にtypoが多かったので、ミスを見つけるのに苦労しましたけど、一言一句正確に写経すれば問題ないです。
挙げるとすれば、

  • debugの仕方がよく分からん。
  • iPhoneの実機テストをするには、年間$99の有償アカウント申請が必要らしい。

何気なく、「お金かかるのかー。嫌だなぁ」なんて思ってたら、
上で紹介した本の著者@donayamaさんからreplyが!
「ビビビ婚ってこんな感じかぁ」ということがよく分かりました。

  • Titanium.API.infoがiOS4.3を用いたシミュレータに対応していない?

ググってみると、Titaniumのバグ?で、Titanium Stadioのバージョンアップ対応って書かれたものは見ましたが、
現状はどうなんだろうか。
僕の環境(2011/10に設定したのでその辺のバージョン)では出ませんでした。
というか、どこにデバッグログが出るのかが分からない。っていう本質もあったりなかったり。

とこんな所ですかね。
まだまだ本の1/3しか行ってないので、もう少し進化は続くと思われます。
頭の中にある企画が実装される日は、いつになることやら。

格言的な

やってみたら案外できる。