前回の記事で環境構築と土台となるプロジェクとの作成ができたので,
どんなものを作るか
まずは,
画面構成としてはこのようなアプリをイメージしておきましょう。
まずはTableView
Twitterアプリを作るなら,
では早速TableViewを作成します。前回作ったプロジェクトのResources/
Titanium.UI.setBackgroundColor('#000');
var tabGroup = Titanium.UI.createTabGroup({});
var win1 = Titanium.UI.createWindow({
title:'Tab 1',
backgroundColor:'#fff'
});
var tab1 = Titanium.UI.createTab({
window:win1 //前回,必要な引数まで削除していました。すいません!
});
//label1 に関するコードを削除
//ここから追加
var tableView = Ti.UI.createTableView({
data:[]
});
win1.add(tableView);
//追加終わり
win1.hideTabBar();
tabGroup.addTab(tab1);
tabGroup.open();
不要になったコードを削除していますが,
TableViewにデータを表示しよう
空のテーブルを表示していても仕方がないので,
先の追加したところを次のように変更します。
var tab1 = Titanium.UI.createTab({
window:win1 //前回必要な引数まで削除されていました。すいません!
});
//label1 に関するコードを削除
//ここから変更
var timeline = [{text:'コメント1'},{text:'コメント2'},{text:'コメント3'}];//仮のデータです
var data = [];
for (var i=0;i<timeline.length;i++) {
var tweet = timeline[i];
var row = Ti.UI.createTableViewRow();
var commentLabel = Ti.UI.createLabel();
commentLabel.text = tweet.text;
row.add(commentLabel);
data.push(row);
}
var tableView = Ti.UI.createTableView({
data:data
});
//変更ここまで
win1.add(tableView);
先程は,