{ "id": "124388", "key": "TIMOB-16129", "fields": { "issuetype": { "id": "1", "description": "A problem which impairs or prevents the functions of the product.", "name": "Bug", "subtask": false }, "project": { "id": "10153", "key": "TIMOB", "name": "Titanium SDK/CLI", "projectCategory": { "id": "10100", "description": "Titanium and related SDKs used in application development", "name": "Client" } }, "fixVersions": [ { "id": "15817", "description": "2014 Sprint 01", "name": "2014 Sprint 01", "archived": true, "released": true, "releaseDate": "2014-01-17" }, { "id": "15820", "description": "2014 Sprint 01 API", "name": "2014 Sprint 01 API", "archived": true, "released": true, "releaseDate": "2014-01-17" }, { "id": "15422", "description": "Release 3.3.0", "name": "Release 3.3.0", "archived": false, "released": true, "releaseDate": "2014-07-16" } ], "resolution": { "id": "2", "description": "The problem described is an issue which will never be fixed.", "name": "Won't Fix" }, "resolutiondate": "2014-01-09T21:38:00.000+0000", "created": "2014-01-05T18:25:33.000+0000", "priority": { "name": "High", "id": "2" }, "labels": [ "3.2.0", "alloy", "navigationwindow", "zindex" ], "versions": [ { "id": "14982", "description": "Release 3.2.0", "name": "Release 3.2.0", "archived": false, "released": true, "releaseDate": "2013-12-19" } ], "issuelinks": [], "assignee": { "name": "vduggal", "key": "vduggal", "displayName": "Vishal Duggal", "active": false, "timeZone": "America/Los_Angeles" }, "updated": "2017-03-22T17:30:30.000+0000", "status": { "description": "The issue is considered finished, the resolution is correct. Issues which are closed can be reopened.", "name": "Closed", "id": "6", "statusCategory": { "id": 3, "key": "done", "colorName": "green", "name": "Done" } }, "components": [ { "id": "10206", "name": "iOS", "description": "iOS Platform" } ], "description": "NavigationWindows seem to appear on top of each other in the order in which they are opened. Setting the zIndex property on them in Alloy XML files, TSS files, or via JavaScript seems to have no effect at all. Regardless of what the zIndex is set to the NavigationWindow opened most recently is always on top of all other NavigationWindows and elements. Changing the zIndex programmatically has no effect either.\r\n\r\nI've attached a super simple Alloy example. When these 2 NavigationWindows open you *should* see the green NavigationWindow (top) taking up the majority of the screen, but instead you see the red NavigationWindow (bottom) taking up the majority of the screen.", "attachment": [ { "id": "44941", "filename": "index.js", "author": { "name": "shawncberg", "key": "shawncberg", "displayName": "Shawn Berg", "active": true, "timeZone": "America/New_York" }, "created": "2014-01-05T18:25:33.000+0000", "size": 112, "mimeType": "text/javascript" }, { "id": "44942", "filename": "index.xml", "author": { "name": "shawncberg", "key": "shawncberg", "displayName": "Shawn Berg", "active": true, "timeZone": "America/New_York" }, "created": "2014-01-05T18:25:33.000+0000", "size": 294, "mimeType": "text/xml" }, { "id": "44946", "filename": "Recipe-List.png", "author": { "name": "shawncberg", "key": "shawncberg", "displayName": "Shawn Berg", "active": true, "timeZone": "America/New_York" }, "created": "2014-01-06T02:37:57.000+0000", "size": 227472, "mimeType": "image/png" }, { "id": "44945", "filename": "Recipe-List-with-Expanded-Nav-Bar.png", "author": { "name": "shawncberg", "key": "shawncberg", "displayName": "Shawn Berg", "active": true, "timeZone": "America/New_York" }, "created": "2014-01-06T02:37:57.000+0000", "size": 257339, "mimeType": "image/png" } ], "flagged": false, "summary": "iOS: NavigationWindows do not respect zIndex", "creator": { "name": "shawncberg", "key": "shawncberg", "displayName": "Shawn Berg", "active": true, "timeZone": "America/New_York" }, "subtasks": [], "reporter": { "name": "shawncberg", "key": "shawncberg", "displayName": "Shawn Berg", "active": true, "timeZone": "America/New_York" }, "environment": "Application type: mobile\r\nTitanium SDK: 3.2.0\r\nPlatform & version: iOS 7.0.3\r\nDevice: iOS Simulator\r\nHost Operating System: OSX Mountain Lion, OSX Mavericks\r\nTitanium Studio: 3.2.0.201312191547", "comment": { "comments": [ { "id": "286682", "author": { "name": "shawncberg", "key": "shawncberg", "displayName": "Shawn Berg", "active": true, "timeZone": "America/New_York" }, "body": "Appears that this issue can also be replicated in classic Titanium so it's likely not an alloy issue. See the update by sfeather on the gist: https://gist.github.com/ShawnCBerg/8271743", "updateAuthor": { "name": "shawncberg", "key": "shawncberg", "displayName": "Shawn Berg", "active": true, "timeZone": "America/New_York" }, "created": "2014-01-05T21:52:23.000+0000", "updated": "2014-01-05T21:52:23.000+0000" }, { "id": "286684", "author": { "name": "sfeather", "key": "sfeather", "displayName": "Stephen Feather", "active": true, "timeZone": "America/New_York" }, "body": "Q&A for reference: http://developer.appcelerator.com/question/161187/navigationwindows-do-not-respect-zindex\n\n", "updateAuthor": { "name": "sfeather", "key": "sfeather", "displayName": "Stephen Feather", "active": true, "timeZone": "America/New_York" }, "created": "2014-01-05T22:51:38.000+0000", "updated": "2014-01-05T22:51:38.000+0000" }, { "id": "286700", "author": { "name": "shawncberg", "key": "shawncberg", "displayName": "Shawn Berg", "active": true, "timeZone": "America/New_York" }, "body": "UI Mockup showing why I need NavigationWindows to respect zIndex values. You'll see the expandable/collapsable navigation bar at the bottom of the screen. This navigation bar is a window that has a high zIndex (9999). The views above (Recipe List, for example) are all NavigationGroups which I'm now converting to NavigationWindows with a low zIndex (1). When the nav bar is expanded (user taps More) I simply change the top property causing it to appear on top of the NavigationGroup/NavigationWindow above. If I can't get the NavigationWindow to respect it's low zIndex I'll never be able to implement this. I'm in the process of converting now to upgrade my app from Ti SDK 3.1.1 > 3.2.0 and iOS 7. This worked perfect with NavigationGroups, just doesn't with NavigationWindows.", "updateAuthor": { "name": "shawncberg", "key": "shawncberg", "displayName": "Shawn Berg", "active": true, "timeZone": "America/New_York" }, "created": "2014-01-06T02:37:57.000+0000", "updated": "2014-01-06T02:42:51.000+0000" }, { "id": "286711", "author": { "name": "sfeather", "key": "sfeather", "displayName": "Stephen Feather", "active": true, "timeZone": "America/New_York" }, "body": "Example more closely replicating Shawn's need:\r\n\r\nh5. index.xml\r\n{code}\r\n\r\n\t\r\n\t\r\n\t\t\r\n\t\t\t\r\n\t\t\r\n\t\t\t\r\n\t\t\r\n\t\t\t\r\n\t\t\r\n\t\t\t\r\n\t\r\n\t\r\n\t\t\r\n\t\r\n\t\r\n\t\t\r\n\t\r\n\t\r\n\t\t\r\n\t\r\n\t\r\n\t\t\r\n\t\r\n\r\n{code}\r\n\r\nh5. index.tss\r\n{code}\r\n'#mainWindow':{\r\n\tbackgroundColor: 'white', zIndex: 1, orientationModes: [Ti.UI.LANDSCAPE_LEFT]\r\n}\r\n\r\n'#tabGroup':{\r\n\theight: 50, bottom: 0, backgroundColor: 'black', zIndex: 9999, layout: 'horizontal'\r\n}\r\n\r\n'.tab':{\r\n\twidth: '25%'\r\n}\r\n\r\n'.navWindow':{\r\n\tzIndex: 0\r\n}\r\n{code}\r\n\r\nh5. index.js\r\n{code}\r\n\r\nfunction raiseNav1(){\r\n\tconsole.log('raising nav1')\r\n\t$.nav1.zIndex = 10;\r\n\t$.nav2.zIndex = 0;\r\n\t$.nav3.zIndex = 0;\r\n\t$.nav4.zIndex = 0;\r\n\tconsole.log('nav1 zIndex: '+$.nav1.zIndex);\r\n\tconsole.log('nav2 zIndex: '+$.nav2.zIndex);\r\n\tconsole.log('nav3 zIndex: '+$.nav3.zIndex);\r\n\tconsole.log('nav4 zIndex: '+$.nav4.zIndex);\r\n\tconsole.log('tab bar zIndex: '+$.tabGroup.zIndex);\r\n}\r\n\r\nfunction raiseNav2(){\r\n\tconsole.log('raising nav2')\r\n\t$.nav1.zIndex = 0;\r\n\t$.nav2.zIndex = 10;\r\n\t$.nav3.zIndex = 0;\r\n\t$.nav4.zIndex = 0;\r\n\tconsole.log('nav1 zIndex: '+$.nav1.zIndex);\r\n\tconsole.log('nav2 zIndex: '+$.nav2.zIndex);\r\n\tconsole.log('nav3 zIndex: '+$.nav3.zIndex);\r\n\tconsole.log('nav4 zIndex: '+$.nav4.zIndex);\r\n\tconsole.log('tab bar zIndex: '+$.tabGroup.zIndex);\r\n}\r\n\r\nfunction raiseNav3(){\r\n\tconsole.log('raising nav3')\r\n\t$.nav1.zIndex = 0;\r\n\t$.nav2.zIndex = 0;\r\n\t$.nav3.zIndex = 10;\r\n\t$.nav4.zIndex = 0;\r\n\tconsole.log('nav1 zIndex: '+$.nav1.zIndex);\r\n\tconsole.log('nav2 zIndex: '+$.nav2.zIndex);\r\n\tconsole.log('nav3 zIndex: '+$.nav3.zIndex);\r\n\tconsole.log('nav4 zIndex: '+$.nav4.zIndex);\r\n\tconsole.log('tab bar zIndex: '+$.tabGroup.zIndex);\r\n}\r\n\r\nfunction raiseNav4(){\r\n\tconsole.log('raising nav4')\r\n\t$.nav1.zIndex = 0;\r\n\t$.nav2.zIndex = 0;\r\n\t$.nav3.zIndex = 0;\r\n\t$.nav4.zIndex = 10;\r\n\tconsole.log('nav1 zIndex: '+$.nav1.zIndex);\r\n\tconsole.log('nav2 zIndex: '+$.nav2.zIndex);\r\n\tconsole.log('nav3 zIndex: '+$.nav3.zIndex);\r\n\tconsole.log('nav4 zIndex: '+$.nav4.zIndex);\r\n\tconsole.log('tab bar zIndex: '+$.tabGroup.zIndex);\r\n}\r\n\r\n/** Test set 1\r\n* Expected Behavior: app should start with a white screen and black tab bar\r\n* Clicking the tabs should raise a NavWindow using its zIndex\r\n*\r\n* Actual Behavior: NavWindows are not raised\r\n*\r\n**/\r\n\r\n$.nav1.open();\r\n$.nav2.open();\r\n$.nav3.open();\r\n$.nav4.open();\r\n$.mainWindow.open();\r\n$.tabGroup.open();\r\n\r\n/** Test set 2\r\n* Expected Behavior: app should start with a white screen and black tab bar\r\n* Clicking the tabs should raise a NavWindow using its zIndex\r\n*\r\n* Actual Behavior: zIndex is ignored and black tab bar is hidden behind a red \r\n* NavigationWindow having a lower zIndex\r\n*\r\n**/\r\n\r\n// $.mainWindow.open();\r\n// $.tabGroup.open();\r\n// $.nav1.open();\r\n// $.nav2.open();\r\n// $.nav3.open();\r\n// $.nav4.open();\r\n\r\n\r\n\r\nconsole.log('Initial values');\r\nconsole.log('nav1 zIndex: '+$.nav1.zIndex);\r\nconsole.log('nav2 zIndex: '+$.nav2.zIndex);\r\nconsole.log('nav3 zIndex: '+$.nav3.zIndex);\r\nconsole.log('nav4 zIndex: '+$.nav4.zIndex);\r\nconsole.log('mainWindow zIndex: '+$.mainWindow.zIndex);\r\nconsole.log('tab bar zIndex: '+$.tabGroup.zIndex);\r\n\r\n\r\n{code}", "updateAuthor": { "name": "sfeather", "key": "sfeather", "displayName": "Stephen Feather", "active": true, "timeZone": "America/New_York" }, "created": "2014-01-06T04:08:03.000+0000", "updated": "2014-01-06T15:59:01.000+0000" }, { "id": "286780", "author": { "name": "ragrawal", "key": "ragrawal", "displayName": "Ritu Agrawal", "active": true, "timeZone": "America/Los_Angeles" }, "body": "Moving this ticket to engineering as per Tony's suggestion.\nhttp://developer.appcelerator.com/question/161187/navigationwindows-do-not-respect-zindex", "updateAuthor": { "name": "ragrawal", "key": "ragrawal", "displayName": "Ritu Agrawal", "active": true, "timeZone": "America/Los_Angeles" }, "created": "2014-01-06T18:07:36.000+0000", "updated": "2014-01-06T18:07:36.000+0000" }, { "id": "286785", "author": { "name": "tlukasavage", "key": "tlukasavage", "displayName": "Tony Lukasavage", "active": true, "timeZone": "America/Los_Angeles" }, "body": "[~ragrawal] the question link that you reference states explicitly that this is _not_ an Alloy-specific issue. Please move this ticket to the appropriate project, in this case TIMOB.", "updateAuthor": { "name": "tlukasavage", "key": "tlukasavage", "displayName": "Tony Lukasavage", "active": true, "timeZone": "America/Los_Angeles" }, "created": "2014-01-06T18:17:44.000+0000", "updated": "2014-01-06T18:17:44.000+0000" }, { "id": "286787", "author": { "name": "ragrawal", "key": "ragrawal", "displayName": "Ritu Agrawal", "active": true, "timeZone": "America/Los_Angeles" }, "body": "[~tlukasavage] My apologies. Moving this to TIMOB.", "updateAuthor": { "name": "ragrawal", "key": "ragrawal", "displayName": "Ritu Agrawal", "active": true, "timeZone": "America/Los_Angeles" }, "created": "2014-01-06T18:21:55.000+0000", "updated": "2014-01-06T18:21:55.000+0000" }, { "id": "287203", "author": { "name": "shawncberg", "key": "shawncberg", "displayName": "Shawn Berg", "active": true, "timeZone": "America/New_York" }, "body": "Is there any timetable for getting this resolved? I see it's marked as a high priority. We have commitments to some clients that I need to address and I don't want to back myself into a corner more than I already am.", "updateAuthor": { "name": "shawncberg", "key": "shawncberg", "displayName": "Shawn Berg", "active": true, "timeZone": "America/New_York" }, "created": "2014-01-08T16:16:58.000+0000", "updated": "2014-01-08T16:16:58.000+0000" }, { "id": "287217", "author": { "name": "ingo", "key": "ingo", "displayName": "Ingo Muschenetz", "active": true, "timeZone": "America/Los_Angeles" }, "body": "We're reviewing this now. It would likely go into 3.2.1 or 3.2.2, depending on the ease of fix and risk associated, but we need to do a little investigation first.", "updateAuthor": { "name": "ingo", "key": "ingo", "displayName": "Ingo Muschenetz", "active": true, "timeZone": "America/Los_Angeles" }, "created": "2014-01-08T17:42:52.000+0000", "updated": "2014-01-08T17:42:52.000+0000" }, { "id": "287512", "author": { "name": "vduggal", "key": "vduggal", "displayName": "Vishal Duggal", "active": false, "timeZone": "America/Los_Angeles" }, "body": "zIndex is a property used to position the view relative to its siblings in the parents child stack. Since windows by definition are top level controllers, they have no siblings. This is a doc bug that will be addressed.\r\n\r\nWhat you are trying to accomplish can be done via Ti.UI.Tabgroup and Ti.UI.iOS.NavigationWindow but requires a few changes.\r\n\r\n1. NavigationWindow must be able to hide the UINavigationController built into the tab. This can be done by modifying the viewWillAppear method of the TiUIiOSNavWindowProxy class to support the navBarHidden property\r\n\r\n{code}\r\n-(void)viewWillAppear:(BOOL)animated\r\n{\r\n if (controller!=nil)\r\n\t{\r\n\t\tid navBarHidden = [self valueForUndefinedKey:@\"navBarHidden\"];\r\n\t\tBOOL nbhidden = [TiUtils boolValue:navBarHidden def:NO];\r\n\t\t[[controller navigationController] setNavigationBarHidden:nbhidden animated:NO];\r\n\t}\r\n if ([self viewAttached]) {\r\n [navController viewWillAppear:animated];\r\n }\r\n [super viewWillAppear:animated];\r\n}\r\n{code}\r\n\r\n2. You need to be able to hide the UITabBar of the UITabBarController. This is not currently possible for the initial window in a tab group. But can be faked by setting the height of the tab group to me more than that of the screen.\r\n\r\n3. You need to replace the tab bar with your own control. This can either be done by adding the fake controls to the NavigationWindow, individual windows hosted by the NavigationWindow or the tab group itself(undocumented, so support might be dropped in future release). Then you switch tabs with the activeTab property of the tabGroup.\r\n\r\nThat being said, here is some skeletal code that is set up for the iPhone idiom in portrait mode. You can start from here and modify to meet your needs.\r\n\r\n{code}\r\n\r\n\r\nfunction genTab(index) {\r\n var win = Ti.UI.createWindow({title:'WINDOW '+index, backgroundColor:'white'});\r\n\r\n var navWin = Ti.UI.iOS.createNavigationWindow({navBarHidden:true, window:win});\r\n\r\n var label = Ti.UI.createLabel({text:'I AM WINDOW '+index, bottom:0});\r\n\r\n win.add(label);\r\n\r\n var tab = Ti.UI.createTab({window:navWin, title:'TAB '+index});\r\n\r\n return tab;\r\n}\r\n\r\n\r\n\r\nvar tabGrp = Ti.UI.createTabGroup({top:0, bottom:-50});//50 is tabBar height in portrait\r\nvar view = Ti.UI.createView({layout:'horizontal',height:Ti.UI.SIZE});\r\n\r\ntabGrp.add(view);\r\n\r\nvar curSelected = 0;\r\n\r\nfunction clickhandler(e)\r\n{\r\n var newSelected = e.source.selectId;\r\n if (newSelected != curSelected) {\r\n curSelected = newSelected;\r\n Ti.API.info('CLICK '+curSelected);\r\n tabGrp.activeTab = curSelected; \r\n }\r\n}\r\n\r\nvar tabs = [];\r\nfor(var i=0;i<10;i++) {\r\n tabs.push(genTab(i))\r\n var v = Ti.UI.createView({backgroundColor:'black',width:'25%',height:40,top:1});\r\n var l = Ti.UI.createLabel({color:'white',selectId:i, text:'TAB '+i})\r\n l.addEventListener('click',clickhandler);\r\n v.add(l);\r\n view.add(v);\r\n}\r\n\r\ntabGrp.tabs = tabs;\r\n\r\ntabGrp.open();\r\n{code}\r\n\r\n", "updateAuthor": { "name": "vduggal", "key": "vduggal", "displayName": "Vishal Duggal", "active": false, "timeZone": "America/Los_Angeles" }, "created": "2014-01-09T21:35:30.000+0000", "updated": "2014-01-09T21:38:41.000+0000" }, { "id": "287513", "author": { "name": "vduggal", "key": "vduggal", "displayName": "Vishal Duggal", "active": false, "timeZone": "America/Los_Angeles" }, "body": "Workaround in comments above", "updateAuthor": { "name": "vduggal", "key": "vduggal", "displayName": "Vishal Duggal", "active": false, "timeZone": "America/Los_Angeles" }, "created": "2014-01-09T21:38:00.000+0000", "updated": "2014-01-09T21:38:00.000+0000" }, { "id": "287520", "author": { "name": "sfeather", "key": "sfeather", "displayName": "Stephen Feather", "active": true, "timeZone": "America/New_York" }, "body": "Vishal, excellent. Thank you.\r\nShawn, if you need help rolling a custom sdk for your project (its not really that bad, and a lot of us use custom sdks for different client projects) just let me know.\r\nBut for this use, simply editing the sdk source files should do it for you.", "updateAuthor": { "name": "sfeather", "key": "sfeather", "displayName": "Stephen Feather", "active": true, "timeZone": "America/New_York" }, "created": "2014-01-09T22:09:29.000+0000", "updated": "2014-01-09T22:10:24.000+0000" }, { "id": "287720", "author": { "name": "shawncberg", "key": "shawncberg", "displayName": "Shawn Berg", "active": true, "timeZone": "America/New_York" }, "body": "Honestly, I'm a bit confused about this approach. Before I dig too deep, is this the easiest way to have a custom tab bar at the bottom of the screen that's collapsible/expandable? That's really all I need to accomplish and with the number of apps that have this it seems like it should be easier to do. I'm hoping you're thinking there's more to it than this, but this is really my only need.\r\n\r\nThanks for looking into this so promptly! I'm still running 3.1.1 so it all works. Is there a reason this worked previously with NavigationGroups and Windows and not now with NavigationWindows and Windows? I can show you my code, but in 3.1.1 the Tabs themselves (at the bottom of the screen) are contained in a normal Window, and there are stacked NavigationGroups above that I show/hide depending on the selected tab. It seems odd that this would be possible in earlier versions of iOS/Titanium and then all of a sudden be taken away. Maybe I just don't fully understand?\r\n\r\nThanks so much, guys! Looking forward to your response.", "updateAuthor": { "name": "shawncberg", "key": "shawncberg", "displayName": "Shawn Berg", "active": true, "timeZone": "America/New_York" }, "created": "2014-01-10T22:30:11.000+0000", "updated": "2014-01-10T22:30:11.000+0000" }, { "id": "288025", "author": { "name": "vduggal", "key": "vduggal", "displayName": "Vishal Duggal", "active": false, "timeZone": "America/Los_Angeles" }, "body": "NavigationGroup was a ViewProxy so could be added to a regular window as a child and hence supported the zIndex property. \nNavigationWindow is a WindowProxy so has no siblings and the zIndex property is irrelevant in the Titanium platform. \n\nRegarding why the NavigationWindow is a WindowProxy and not a ViewProxy please have a look at this thread.\nhttp://developer.appcelerator.com/question/157332/migrate-from-navigationgroup-to-navigationwindow---cant-add-object-to-a-window-anymore ", "updateAuthor": { "name": "vduggal", "key": "vduggal", "displayName": "Vishal Duggal", "active": false, "timeZone": "America/Los_Angeles" }, "created": "2014-01-13T22:43:22.000+0000", "updated": "2014-01-13T22:43:22.000+0000" }, { "id": "414800", "author": { "name": "lmorris", "key": "lmorris", "displayName": "Lee Morris", "active": false, "timeZone": "America/Los_Angeles" }, "body": "Closing ticket as the issue will not fix and with reference to the above comments.", "updateAuthor": { "name": "lmorris", "key": "lmorris", "displayName": "Lee Morris", "active": false, "timeZone": "America/Los_Angeles" }, "created": "2017-03-22T17:30:30.000+0000", "updated": "2017-03-22T17:30:30.000+0000" } ], "maxResults": 16, "total": 16, "startAt": 0 } } }