Titanium mobile クリックして次のウィンドウに遷移する

前回課題とした、Titanium mobile でクリックしたら次のウィンドウに遷移させる方法です。

遷移先のウィンドウ用にdetail.jsを作成しました（app.jsと同じ階層に）。中身はこんな感じ

// create table view data object
var data = [
	{title:'Tab Groups'},
];

// create table view
var tableview = Titanium.UI.createTableView({
	data:data
});

// add table view to the window
Titanium.UI.currentWindow.add(tableview);

var win = Titanium.UI.createWindow({
	height:30,
	width:250,
	bottom:110,
	borderRadius:10
});

var view = Titanium.UI.createView({
	backgroundColor:'#000',
	opacity:0.7,
	height:30,
	width:250,
	borderRadius:10
});

win.add(view);

でapp.jsをこの形

// 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:'Tab 1',
    backgroundColor:'#fff'
});
var tab1 = Titanium.UI.createTab({
    icon:'KS_nav_views.png',
    title:'Tab 1',
    window:win1
});

// create slider view data object
 var tableview = Titanium.UI.createTableView({
data : [
	{title:'Detail', test:'detail.js'},
]
});
tableview.addEventListener('click', function(e)
{
	if (e.rowData.test)
	{
		var win = Titanium.UI.createWindow({
			url:e.rowData.test,
			title:e.rowData.title
		});
//		Titanium.UI.currentTab.open(win,{animated:true});
		tab1.open(win,{animated:true});
	}
});
	win1.add(tableview);
//Titanium.UI.currentWindow.add(tableview);

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

// open tab group
tabGroup.open();

クリックして開く処理

まず、ポイントはここ。app.jsのこの部分

var tableview = Titanium.UI.createTableView({
data : [
	{title:'Detail', test:'detail.js'},
]
});

data.testプロパティにdetail.jsを指定します。

tableview.addEventListener('click', function(e)
{
	if (e.rowData.test)
	{
		var win = Titanium.UI.createWindow({
			url:e.rowData.test,
			title:e.rowData.title
		});
// これだとエラーでた
//		Titanium.UI.currentTab.open(win,{animated:true});
		tab1.open(win,{animated:true});
	}
});

クリック時の処理をaddEventListenerで設定します。

Kitchen think にあったサンプルを見ながら実装したのですが、currentTabでエラーが出てしまったので、tab1を直接指定してます。tabの設定しだいでは動くかと思います。

//Titanium.UI.currentWindow.add(tableview);
	win1.add(tableview);

最後にwindowオブジェクトににaddして完了。ここもcurrentWindowだとエラーが出ててしまったので、win1を直接指定しました。

これで前回のxml読み込み処理と組み合わせて、タイトル一覧→クリック→本文、というフローができそうなので次の課題としてみます。