-
-
Save Xaynder/4016971 to your computer and use it in GitHub Desktop.
| //// ---- Menu window, positioned on the left | |
| var menuWindow = Ti.UI.createWindow({ | |
| top:0, | |
| left:0, | |
| width:150 | |
| }); | |
| menuWindow.open(); | |
| //// ---- Menu Table | |
| // Menu Titles | |
| var menuTitles = [ | |
| {title: 'Menu 1'}, | |
| {title: 'Menu 2'}, | |
| {title: 'Menu 3'}, | |
| {title: 'Menu 4'}, | |
| {title: 'Menu 5'}, | |
| {title: 'Menu 6'} | |
| ]; | |
| // Tableview | |
| var tableView = Ti.UI.createTableView({ | |
| data:menuTitles | |
| }); | |
| menuWindow.add(tableView); | |
| //// ---- Window with navigationGroup | |
| var navWindow = Ti.UI.createWindow({ | |
| width:320 // Set the width of the sliding window to avoid cut out from animation | |
| }); | |
| navWindow.open(); | |
| // Main window | |
| var win = Ti.UI.createWindow({ | |
| title:'Main Window', | |
| backgroundColor:'#28292c', | |
| barColor:'#28292c', | |
| moving:false, // Custom property for movement | |
| axis:0 // Custom property for X axis | |
| }); | |
| // NavigationGroup | |
| var navGroup = Ti.UI.iPhone.createNavigationGroup({ | |
| window:win | |
| }); | |
| navWindow.add(navGroup); | |
| // Top left button | |
| var menuButton = Ti.UI.createButton({ | |
| title:'Menu', | |
| toggle:false // Custom property for menu toggle | |
| }); | |
| win.setLeftNavButton(menuButton); | |
| menuButton.addEventListener('click', function(e){ | |
| // If the menu is opened | |
| if(e.source.toggle == true){ | |
| navWindow.animate({ | |
| left:0, | |
| duration:300, | |
| curve:Ti.UI.ANIMATION_CURVE_EASE_IN_OUT | |
| }); | |
| e.source.toggle = false; | |
| } | |
| // If the menu isn't opened | |
| else{ | |
| navWindow.animate({ | |
| left:150, | |
| duration:300, | |
| curve:Ti.UI.ANIMATION_CURVE_EASE_IN_OUT | |
| }); | |
| e.source.toggle = true; | |
| } | |
| }); | |
| win.addEventListener('touchstart', function(e){ | |
| // Get starting horizontal position | |
| e.source.axis = parseInt(e.x); | |
| }); | |
| win.addEventListener('touchmove', function(e){ | |
| // Subtracting current position to starting horizontal position | |
| var coordinates = parseInt(e.globalPoint.x) - e.source.axis; | |
| // Detecting movement after a 20px shift | |
| if(coordinates > 20 || coordinates < -20){ | |
| e.source.moving = true; | |
| } | |
| // Locks the window so it doesn't move further than allowed | |
| if(e.source.moving == true && coordinates <= 150 && coordinates >= 0){ | |
| // This will smooth the animation and make it less jumpy | |
| navWindow.animate({ | |
| left:coordinates, | |
| duration:20 | |
| }); | |
| // Defining coordinates as the final left position | |
| navWindow.left = coordinates; | |
| } | |
| }); | |
| win.addEventListener('touchend', function(e){ | |
| // No longer moving the window | |
| e.source.moving = false; | |
| if(navWindow.left >= 75 && navWindow.left < 150){ | |
| // Repositioning the window to the right | |
| navWindow.animate({ | |
| left:150, | |
| duration:300 | |
| }); | |
| menuButton.toggle = true; | |
| }else{ | |
| // Repositioning the window to the left | |
| navWindow.animate({ | |
| left:0, | |
| duration:300 | |
| }); | |
| menuButton.toggle = false; | |
| } | |
| }); |
can you help me to work it for android?
how can i do this for android or Cross platform
Does not work here. I paste the code into app.js and get the following error:
'undifined' is not a function (evaluating 'Ti.UI.iPhone.createNavigationgroup({window:win}) at app.js (line 40)
What is wrong?
(OS X, Titanium 3.2.0, iOS Simulator)
@connect-m It's most likely due to the function in question being deprecated. I believe it would be Titanium.UI.iOS.createNavigationWindow now but check the documentation to be sure.
Just test it but big problem when building it
There is a black window with the menu but cannot use it... and the log is :
[WARN] : Can not add a window as a child of a view. Returning
Does anyone has the solution ? Please ?
Titanium SDK 4.0
iOS 8
Thanks
It will be nice if this will work for Android.