need help with navigationGroup
I'm new to Titanium, and am having a problem with navigationGroups I cannot figure out. I'm sure it's just me being a noob, and should be a simple fix. I just need an explanation.
I am building an app that starts out with a window (app.js) that has no tabs, only buttons. When I click a button, I want the next window (about.js) to use a navGroup, so the About screen 'slides' in. I just cannot get this to work. Guess I just don't understand how navGroups work. Any help is greatly appreciated. I've looked at the examples in KitchenSync, and still can't figure it out! Do I put the NavGroup in app.js, or in about.js?
Here's my code:
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 root window
var rootWin = Titanium.UI.createWindow({
backgroundColor:'#000'
});
// create main window
var mainWin = Titanium.UI.createWindow({
backgroundColor:'#000',
backgroundImage:'images/background.png'
});
// add the about button
var aboutBtn = Titanium.UI.createButton({
title:'About',
color:'#ff6',
font:{fontSize:15, fontWeight:'bold', fontFamily:'Helvetica Neue'},
backgroundImage:'images/button.png',
top:110,
height:34,
width:160
});
var aboutWin = Titanium.UI.createWindow({
url:'subWindows/about.js',
title:'About'
});
aboutBtn.addEventListener('click', function(e){
aboutWin.open();
});
mainWin.add(aboutBtn);
// open the root window
rootWin.add(mainWin);
rootWin.open();
about.js:
// this sets the background color of the master UIView (when there are no windows/tab groups on it)
Titanium.UI.setBackgroundColor('#000');
// create root window
var rootWin = Titanium.UI.createWindow();
// create main window
var mainWin = Titanium.UI.createWindow({
backgroundColor:'#000',
backgroundImage:'../images/background.png'
});
// ———————————————–
// create the navigation group
var navGroup = Ti.UI.iPhone.createNavigationGroup({
window:mainWin
});
rootWin.add(mainWin);
rootWin.add(navGroup);
// open the main window
navGroup.open(mainWin);
5 Answers
-
Accepted Answer
to use navgroup in 2 or more file .js
check this outhttp://blog.clearlyinnovative.com/post/1624173028/titanium-appcelerator-quickie-navigation-groups
it pass navgroup through window
-
you can take a peek at the Tut. here
-
Study the kitchensink app; most examples can be found there …
-
Here is what I'm using:
app.js
var win = Titanium.UI.createWindow({}); var win1 = Titanium.UI.createWindow({ url:'prod_win.js', backgrowdColor: "#999", title: 'Products' }); var nav = Titanium.UI.iPhone.createNavigationGroup({ window: win1 }); win.add(nav); win.nav = win1.nav = nav; win.open({ transition:Titanium.UI.iPhone.AnimationStyle.CURL_UP });
And I passed the navigation group reference to the opened window, so in it I can open another one, to add it to the app flow, like so:
_prodwin.js
var win = Titanium.UI.currentWindow; var win_detail = Titanium.UI.createWindow({ url:'prod_detail_win.js' }); win.nav.open(win_detail, {animated:true});
Hope this helps.
-
to use navgroup in 2 or more file .js
check this outhttp://blog.clearlyinnovative.com/post/1624173028/titanium-appcelerator-quickie-navigation-groups
it pass navgroup through window