{ "id": "119923", "key": "TIMOB-15191", "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": [], "resolution": { "id": "7", "description": "", "name": "Invalid" }, "resolutiondate": "2013-09-16T05:46:53.000+0000", "created": "2013-09-13T16:51:31.000+0000", "priority": { "name": "High", "id": "2" }, "labels": [ "ios7", "translucency", "triage", "window" ], "versions": [], "issuelinks": [], "assignee": { "name": "shossain", "key": "shossain", "displayName": "Shak Hossain", "active": false, "timeZone": "America/Los_Angeles" }, "updated": "2017-03-22T21:14:23.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": "By default the level of translucency of the tabGroup and top window navigation do not match the default Apps from Apple, or what Xcode 5 natively builds in iOS 7, or what the Apple docs show as the default UI here:\r\nhttps://developer.apple.com/library/prerelease/ios/documentation/UserExperience/Conceptual/TransitionGuide/index.html\r\n\r\nThe tabGroup and top navigation are too grey in Titanium, and the level of translucency seems less than what the default should be. Perhaps it is simple the default color (being too grey) that is the problem, and the translucency will come right if the color does.\r\n\r\nPlease see attached screenshot with the Apple default on the left, and what Titanium builds on the right.\r\n\r\n{code}\r\nvar win1 = Ti.UI.createWindow({\r\n\ttitle: 'Test',\r\n\tbackgroundColor:'white'\r\n});\r\n\r\nvar button = Ti.UI.createButton({\r\n\theight:44,\r\n\twidth:200,\r\n\ttitle:L('openWindow'),\r\n\ttop:20\r\n});\r\nwin1.add(button);\r\n\r\nvar win2 = Ti.UI.createWindow({\r\n\ttitle: 'Test',\r\n\tbackgroundColor:'white'\r\n});\r\n\r\nvar button = Ti.UI.createButton({\r\n\theight:44,\r\n\twidth:200,\r\n\ttitle:L('openWindow'),\r\n\ttop:20\r\n});\r\nwin2.add(button);\r\n\r\nvar box1 = Ti.UI.createView({\r\n\theight:100,\r\n\twidth:100,\r\n\tleft: 15,\r\n\tbackgroundColor: 'red',\r\n\ttitle:L('openWindow'),\r\n\ttop:300\r\n});\r\nwin1.add(box1);\r\n\r\nvar box2 = Ti.UI.createView({\r\n\theight:100,\r\n\twidth:100,\r\n\tleft: 130,\r\n\tbackgroundColor: 'blue',\r\n\ttitle:L('openWindow'),\r\n\ttop:300\r\n});\r\nwin1.add(box2);\r\n\r\nvar tabs = Ti.UI.createTabGroup();\r\n\r\nvar tab1 = Ti.UI.createTab({\r\n\ttitle: L('home'),\r\n\ticon: '/images/KS_nav_ui.png',\r\n\twindow: win1\r\n});\r\n\r\nvar tab2 = Ti.UI.createTab({\r\n\ttitle: L('settings'),\r\n\ticon: '/images/KS_nav_views.png',\r\n\twindow: win2\r\n});\r\n\r\ntabs.addTab(tab1);\r\ntabs.addTab(tab2);\r\n\r\ntabs.open();\r\n{code}\r\n\r\nCan this please be fixed as part of 3.1.3?", "attachment": [ { "id": "42469", "filename": "ios7 window comparison.png", "author": { "name": "mdelmarter", "key": "mdelmarter", "displayName": "Matthew Delmarter", "active": true, "timeZone": "Pacific/Auckland" }, "created": "2013-09-13T16:51:31.000+0000", "size": 116652, "mimeType": "image/png" }, { "id": "42475", "filename": "iOS Simulator Screen shot 14.09.2013 8.50.45 AM.png", "author": { "name": "mdelmarter", "key": "mdelmarter", "displayName": "Matthew Delmarter", "active": true, "timeZone": "Pacific/Auckland" }, "created": "2013-09-13T20:52:07.000+0000", "size": 30116, "mimeType": "image/png" } ], "flagged": false, "summary": "iOS7: Color and Translucency of Window default Navigation and TabGroups are wrong", "creator": { "name": "mdelmarter", "key": "mdelmarter", "displayName": "Matthew Delmarter", "active": true, "timeZone": "Pacific/Auckland" }, "subtasks": [], "reporter": { "name": "mdelmarter", "key": "mdelmarter", "displayName": "Matthew Delmarter", "active": true, "timeZone": "Pacific/Auckland" }, "environment": "iOS 7. SDK 3.1.3. Xcode 5.", "comment": { "comments": [ { "id": "271105", "author": { "name": "mdelmarter", "key": "mdelmarter", "displayName": "Matthew Delmarter", "active": true, "timeZone": "Pacific/Auckland" }, "body": "OK I worked out that this is not a bug in Titanium. It is all about the window being set to includeOpaqueBars = true and extendEdges = [1,4]. (By the way, that extendEdges settings needs way better documentation).\r\n\r\nHowever I am not sure this hasn't just led me to a different issue.\r\n\r\nIn the initial screenshot of the Apple window above, the tableView starts scrolling from beneath the navigation group, i.e. you can see the \"A\" header - but as you start scrolling it slides UNDER the navigation group, so that it is now viewable through the slightly transparent navigation group. I have no idea how to replicate this behaviour in Titanium, and am not sure it is supported?\r\n\r\nHere is the working code that shows the extendEdges in action:\r\n\r\n{code}\r\nvar win1 = Ti.UI.createWindow({\r\n\ttitle: 'Test',\r\n\tincludeOpaqueBars: true,\r\n\textendEdges: [1,4],\r\n\tbackgroundColor:'white'\r\n});\r\n\r\nvar button = Ti.UI.createButton({\r\n\theight:44,\r\n\twidth:200,\r\n\ttitle:L('openWindow'),\r\n\ttop:20\r\n});\r\nwin1.add(button);\r\n\r\nvar win2 = Ti.UI.createWindow({\r\n\ttitle: 'Test',\r\n\tbackgroundColor:'white'\r\n});\r\n\r\nvar button = Ti.UI.createButton({\r\n\theight:44,\r\n\twidth:200,\r\n\ttitle:L('openWindow'),\r\n\ttop:20\r\n});\r\nwin2.add(button);\r\n\r\nvar box1 = Ti.UI.createView({\r\n\theight:100,\r\n\twidth:100,\r\n\tleft: 15,\r\n\tbackgroundColor: 'red',\r\n\ttitle:L('openWindow'),\r\n\ttop:-50\r\n});\r\nwin1.add(box1);\r\n\r\nvar box2 = Ti.UI.createView({\r\n\theight:100,\r\n\twidth:100,\r\n\tleft: 130,\r\n\tbackgroundColor: 'blue',\r\n\ttitle:L('openWindow'),\r\n\ttop:300\r\n});\r\nwin1.add(box2);\r\n\r\n//create module instance\r\nvar tabs = Ti.UI.createTabGroup();\r\n\r\nvar tab1 = Ti.UI.createTab({\r\n\ttitle: L('home'),\r\n\ticon: '/images/KS_nav_ui.png',\r\n\twindow: win1\r\n});\r\n\r\nvar tab2 = Ti.UI.createTab({\r\n\ttitle: L('settings'),\r\n\ticon: '/images/KS_nav_views.png',\r\n\twindow: win2\r\n});\r\n\r\ntabs.addTab(tab1);\r\ntabs.addTab(tab2);\r\n\r\ntabs.open();\r\n{code}\r\n", "updateAuthor": { "name": "mdelmarter", "key": "mdelmarter", "displayName": "Matthew Delmarter", "active": true, "timeZone": "Pacific/Auckland" }, "created": "2013-09-13T20:48:48.000+0000", "updated": "2013-09-13T20:52:46.000+0000" }, { "id": "271106", "author": { "name": "mdelmarter", "key": "mdelmarter", "displayName": "Matthew Delmarter", "active": true, "timeZone": "Pacific/Auckland" }, "body": "Modified code with extendEdges now matches Apples look caused by content UNDER the navigation bar and tab group.", "updateAuthor": { "name": "mdelmarter", "key": "mdelmarter", "displayName": "Matthew Delmarter", "active": true, "timeZone": "Pacific/Auckland" }, "created": "2013-09-13T20:52:07.000+0000", "updated": "2013-09-13T20:52:07.000+0000" }, { "id": "271108", "author": { "name": "mdelmarter", "key": "mdelmarter", "displayName": "Matthew Delmarter", "active": true, "timeZone": "Pacific/Auckland" }, "body": "I found the documentation to support the new problem of the extendEdges not allowing a tableView to start scrolling in a viewable position, and then to slide underneath the top navigation group: https://developer.apple.com/library/prerelease/ios/documentation/UserExperience/Conceptual/TransitionGuide/AppearanceCustomization.html#//apple_ref/doc/uid/TP40013174-CH15-SW1\r\n\r\nSections on automaticallyAdjustsScrollViewInsets and topLayoutGuide, bottomLayoutGuide.", "updateAuthor": { "name": "mdelmarter", "key": "mdelmarter", "displayName": "Matthew Delmarter", "active": true, "timeZone": "Pacific/Auckland" }, "created": "2013-09-13T20:58:40.000+0000", "updated": "2013-09-13T21:07:49.000+0000" }, { "id": "271184", "author": { "name": "vduggal", "key": "vduggal", "displayName": "Vishal Duggal", "active": false, "timeZone": "America/Los_Angeles" }, "body": "Regarding the \"too gray\" section of the bug, it is the background color of the Root View (black by default) showing through.\nTo overcome this set either Ti.UI.backgroundColor or tabGroup.backgroundColor to white.\n\nRegarding making the tableView slide underneath the navigation bar, there are multiple solutions\nThe easiest one would be of course to add a dummy headerView to the tableView of height 64 (44 for navBar and 20 for statusBar). In landscape mode set height to 52 on the iPhone idiom. (iPad has navBar height of 44 in both portrait and landscape). \nYou could also play with the contentInsets on the tableView and set an appropriate inset for the top (64 or 52 based on orientation and idiom combo).\n\nBoth these solutions require ofcourse that you set the window to extend its layout edges. If all you want to do is slide underneath the navigation bar then you only need to set extendEdges = [Ti.UI.EXTEND_EDGE_TOP]. Assuming you did set the navBar to be non translucent you would also have to set includeOpaqueBars to true. If you do extend the bottom edge of the window, make sure that the last row can be scrolled into an interactable area by either either setting a dummy footer view on the table or appropriate content insets for the bottom.\n", "updateAuthor": { "name": "vduggal", "key": "vduggal", "displayName": "Vishal Duggal", "active": false, "timeZone": "America/Los_Angeles" }, "created": "2013-09-16T05:45:59.000+0000", "updated": "2013-09-16T05:45:59.000+0000" }, { "id": "271186", "author": { "name": "vduggal", "key": "vduggal", "displayName": "Vishal Duggal", "active": false, "timeZone": "America/Los_Angeles" }, "body": "Marking bug as invalid. Explanations and workarounds in comments below", "updateAuthor": { "name": "vduggal", "key": "vduggal", "displayName": "Vishal Duggal", "active": false, "timeZone": "America/Los_Angeles" }, "created": "2013-09-16T05:46:53.000+0000", "updated": "2013-09-16T05:46:53.000+0000" }, { "id": "414970", "author": { "name": "lmorris", "key": "lmorris", "displayName": "Lee Morris", "active": false, "timeZone": "America/Los_Angeles" }, "body": "Closing ticket as invalid with reference to the above comments.", "updateAuthor": { "name": "lmorris", "key": "lmorris", "displayName": "Lee Morris", "active": false, "timeZone": "America/Los_Angeles" }, "created": "2017-03-22T21:14:23.000+0000", "updated": "2017-03-22T21:14:23.000+0000" } ], "maxResults": 7, "total": 7, "startAt": 0 } } }