TabGroupで子ウィンドウの子ウィンドウの無理やり版(自分メモ) 【2013-04-26 追記】当メモの方法ではなく「【Titaniumメモ】(003)TabGroupの画面遷移(複数子ウィンドウ)」を参照。 TabGroupで親ウィンドウ→子ウィンドウ(テーブルビュー)→子ウィンドウ2(テーブルビュー)を やりたかったのですが、’undefined’ is not an object (evaluating ‘self.containingTab.open’) エラーが出て上手く行かず。 色々、調べて試してみたのですが全然出来ないので、以下無理やり対応版。 1.親ウィンドウ
// 親ウィンドウ function ParentWindow(title) { var self = Ti.UI.createWindow({ title:title, backgroundColor:'white' }); var button = Ti.UI.createButton({ height:44, width:200, title:L('OpenChildWindow1'), top:20 }); self.add(button); // ChildWindowに遷移する。ここは普通(?)にcontainingTab.openを使う。 // 画面遷移のアニメーションは右から左にWindowがスライドする。 button.addEventListener('click', function() { // 子ウィンドウ var wChildWindow = new ChildWindow(self); self.containingTab.open( wChildWindow,{anmated:true} ); }); return self; }; module.exports = ParentWindow;
2.子ウィンドウ
// 子ウィンドウ function ChildWindow() { var self = Ti.UI.createWindow({ title:"ChildWindow1", backgroundColor:'blue' }); var button = Ti.UI.createButton({ height:44, width:200, title:L('OpenChildWindow2'), top:20 }); self.add(button); // 子ウィンドウ2 var wChildWindow2 = new ChildWindow2(self); // 子ウィンドウ2を表示 button.addEventListener('click', function(e) { // 子ウィンドウのアニメーション表示が上手くいかないので、addで表示。 self.add(wChildWindow2); // アニメーションさせると、なぜか子ウィンドウ1に戻った時に、子ウィンドウのボタンが見えなくなる。何故? // self.animate({ // view: wChildWindow2, // transition: Ti.UI.iPhone.AnimationStyle.CURL_UP // }); // 子ウィンドウ2のナビゲーションバーボタンを変更するためにfireEventを発火 Ti.App.fireEvent('ChildWindow2Open', {}); }); // 子ウィンドウ2から戻ってきた場合、ナビゲーションバーを元に戻す Ti.App.addEventListener("ChildWindow2Close", function() { self.setLeftNavButton(null); self.remove(wChildWindow2); }); return self; }; module.exports = ChildWindow;
3.子ウィンドウ2
// 子ウィンドウ2 // 呼び出し元ウィンドウ(ParentWindow)を引数で受け取る function ChildWindow2(ParentWindow) { var self = Ti.UI.createView({ title:"ChildWindow1", backgroundColor:'yellow' }); // 子ウィンドウ2用のナビゲーションバー・ボタン var LeftNav = Ti.UI.createButton({title:'ChildWindow1'}); // 子ウィンドウ2が表示された場合に、ナビゲーションバー・ボタンを変更する Ti.App.addEventListener("ChildWindow2Open", function() { // 呼び出し元ウィンドウに対してナビゲーションバーのボタン設定を行う必要がある // その為、呼び出し元ウィンドウ(ParentWindow)を引数で受け取っている ParentWindow.setLeftNavButton(LeftNav); }); // ナビゲーションボタンをクリック // 子ウィンドウ1のナビゲーションバーボタンを元に戻すためにfireEventを発火 LeftNav.addEventListener('click', function() { Ti.App.fireEvent('ChildWindow2Close', {}); }); return self; }; module.exports = ChildWindow2;
・子ウィンドウ2はタブによる画面遷移はあきらめて、普通にウィンドウ表示。 ・ナビゲーションボタンはfireEventで子ウィンドウ1、子ウィンドウ2用にそれぞれ変更しておく。 ・子ウィンドウのアニメはタブの画面遷移のように右から左にアニメしてくれない。下記4種類のいずれかを指定。 Ti.UI.iPhone.AnimationStyle.CURL_UP Ti.UI.iPhone.AnimationStyle.FLIP_FROM_LEFT Ti.UI.iPhone.AnimationStyle.FLIP_FROM_RIGHT Ti.UI.iPhone.AnimationStyle.CURL_DOWN ※ただし、なぜかアニメ指定をすると子ウィンドウ2から子ウィンドウに戻った際、子ウィンドウのコントロール(ボタン等)が無くなる?なぜ??
コメント
by 【Titaniumメモ】(003)TabGroupの画面遷移(複数子ウィンドウ)ささブログ « ささブログ 2013/04/26 11:31