Reuse same window across multiple tabs in same tabgroup?
I am developing a tab-based app where the tabs are so similar that I think it makes sense to create one shared window and use it as the window across all tabs. For example, let's say tab 1 displays the NYT Business RSS feed, tab 2 displays the NYT Technology RSS feed, and tab 3 the Business RSS feed – and the display logic (table view) is the same for all. The only thing that is different is a parameter in the RSS URL (and window title).
Is this shared window the correct approach in this situation or is it better to use separate windows for each tab?
If the shared window approach is used, how do I properly determine which tab is active within the shared window .js code? Also, how can I access custom properties of the tab object? Below is what I currently have but isn't working:
var sharedWindow = Titanium.UI.createWindow({
url:'sharedWindow.js'
});
var tab1 = Titanium.UI.createTab({
customProperty: 'One',
title:'Tab 1',
window: sharedWindow
});
var tab2 = Titanium.UI.createTab({
customProperty: 'Two',
title:'Tab 2',
window: sharedWindow
});
var tab3 = Titanium.UI.createTab({
customProperty: 'Three',
title:'Tab 3',
window: sharedWindow
});
tabGroup.addTab(tab1);
tabGroup.addTab(tab2);
tabGroup.addTab(tab3);
tabGroup.open();
sharedWindow.js
Titanium.UI.currentWindow.addEventListener('focus', function(){
var test = Titanium.UI.currentTab.customProperty;
Titanium.UI.currentWindow.title = test;
});
2 Answers
-
There must be a built-in way to determine which tab was tapped. I find it hard to believe that you have to set a global variable on the focus event of the tab group and then retrieve this variable when inside the window. While this would work, it seems like unnecessary overhead to me.
Could someone from Appcelerator please chime in – is this global variable method the only way to determine which tab was tapped or is there a better way? Also, could someone from Appcelerator confirm if a separate window object is required for each tab in a tab group, or can multiple tabs share the same window?
Thank you!
-
My understanding is that you need different window instance for each tab (correct me if I am wrong). But it's prefectly fine to share the same .js code.
My approach is to have a loop to create the and assign the tab windows by assigning the same .js url, then set parameter on tab 'focus' event. Like this e.g.:
tabGroup.addEventListener('focus', function(e)
{
if (e.index == 4) {
Ti.App.fireEvent('hide_char_indicator');
} else {
Ti.App.fireEvent('show_char_indicator');
Ti.App.Properties.setInt('current_style',e.index+1);
}
});And in the shared .js code, you could pickup the parameter like this standard "global" variable approach:
var current_style = Ti.App.Properties.getInt('current_style');Take a look at the app using the above approach to see how it works: itms://itunes.apple.com/us/app/id366482612?mt=8
assuming you like Chinese (Kanji) calligraphic art :)