{ "id": "173914", "key": "TIMOB-27263", "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": "20827", "name": "Release 8.2.0", "archived": false, "released": true, "releaseDate": "2019-09-19" } ], "resolution": { "id": "1", "description": "A fix for this issue is checked into the tree and tested.", "name": "Fixed" }, "resolutiondate": "2019-09-17T16:04:25.000+0000", "created": "2019-07-20T22:07:59.000+0000", "priority": { "name": "Critical", "id": "1" }, "labels": [], "versions": [ { "id": "20827", "name": "Release 8.2.0", "archived": false, "released": true, "releaseDate": "2019-09-19" } ], "issuelinks": [ { "id": "58978", "type": { "id": "10003", "name": "Relates", "inward": "relates to", "outward": "relates to" }, "outwardIssue": { "id": "175825", "key": "TIMOB-28253", "fields": { "summary": "Ti.UI.Window Test Suite: Titanium.UI.Window Acceptance TIMOB-27263 iOS Only", "status": { "description": "The issue is open and ready for the assignee to start work on it.", "name": "Open", "id": "1", "statusCategory": { "id": 2, "key": "new", "colorName": "blue-gray", "name": "To Do" } }, "priority": { "name": "None", "id": "6" }, "issuetype": { "id": "10100", "description": "This Issue Type is used to create Zephyr Test within Jira.", "name": "Test", "subtask": false } } } } ], "assignee": { "name": "vijaysingh", "key": "vijaysingh", "displayName": "Vijay Singh", "active": true, "timeZone": "America/Los_Angeles" }, "updated": "2020-11-23T04:36:46.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": "On iOS 13, modal windows with large titles do not honor their {{barColor}} property. Natively, it seems like iOS 13 receives it's modal bar color from the background (see native app attached), but doing the same in Titanium also doesn't work. Here is what I tried (both with backgroundColor and barColor):\r\n{code:js}\r\nvar win = Ti.UI.createWindow();\r\n \r\nvar btn = Ti.UI.createButton({\r\n title: 'Open VC'\r\n});\r\n \r\nbtn.addEventListener('click', function() {\r\n var win2 = Ti.UI.createWindow({ backgroundColor: 'red', title: 'Hello', largeTitleEnabled: true });\r\n\r\n var nav = Ti.UI.createNavigationWindow({\r\n window: win2\r\n });\r\n \r\n nav.open({ modal: true })\r\n});\r\n \r\nwin.add(btn);\r\nwin.open();\r\n{code}\r\n\r\nIn addition, it seems like Titanium applies the default bar tint color different to native iOS, which should be investigated in a different ticket!", "attachment": [ { "id": "66835", "filename": "Bildschirmfoto 2019-08-14 um 12.43.50.png", "author": { "name": "hknoechel", "key": "hansknoechel", "displayName": "Hans Knöchel", "active": true, "timeZone": "Europe/Berlin" }, "created": "2019-08-14T10:43:57.000+0000", "size": 108520, "mimeType": "image/png" }, { "id": "66837", "filename": "native_modal_normal.png", "author": { "name": "hknoechel", "key": "hansknoechel", "displayName": "Hans Knöchel", "active": true, "timeZone": "Europe/Berlin" }, "created": "2019-08-14T12:37:45.000+0000", "size": 55599, "mimeType": "image/png" }, { "id": "66850", "filename": "test_barcolor_adapted.zip", "author": { "name": "hknoechel", "key": "hansknoechel", "displayName": "Hans Knöchel", "active": true, "timeZone": "Europe/Berlin" }, "created": "2019-08-16T20:18:10.000+0000", "size": 47620, "mimeType": "application/zip" }, { "id": "66836", "filename": "test_barcolor.zip", "author": { "name": "hknoechel", "key": "hansknoechel", "displayName": "Hans Knöchel", "active": true, "timeZone": "Europe/Berlin" }, "created": "2019-08-14T12:37:17.000+0000", "size": 36072, "mimeType": "application/zip" }, { "id": "66838", "filename": "ti_modal_large.png", "author": { "name": "hknoechel", "key": "hansknoechel", "displayName": "Hans Knöchel", "active": true, "timeZone": "Europe/Berlin" }, "created": "2019-08-14T12:37:45.000+0000", "size": 30899, "mimeType": "image/png" }, { "id": "66839", "filename": "tie_modal_normal.png", "author": { "name": "hknoechel", "key": "hansknoechel", "displayName": "Hans Knöchel", "active": true, "timeZone": "Europe/Berlin" }, "created": "2019-08-14T12:37:45.000+0000", "size": 60858, "mimeType": "image/png" } ], "flagged": false, "summary": "iOS 13: Modal windows with large titles do not honor barColor ", "creator": { "name": "hknoechel", "key": "hansknoechel", "displayName": "Hans Knöchel", "active": true, "timeZone": "Europe/Berlin" }, "subtasks": [], "reporter": { "name": "hknoechel", "key": "hansknoechel", "displayName": "Hans Knöchel", "active": true, "timeZone": "Europe/Berlin" }, "environment": null, "closedSprints": [ { "id": 1161, "state": "closed", "name": "2019 Sprint 18", "startDate": "2019-08-26T21:46:26.269Z", "endDate": "2019-09-08T21:46:00.000Z", "completeDate": "2019-09-09T20:39:58.761Z", "originBoardId": 114 }, { "id": 1163, "state": "closed", "name": "2019 Sprint 19", "startDate": "2019-09-09T20:43:13.091Z", "endDate": "2019-09-22T20:43:00.000Z", "completeDate": "2019-09-23T15:37:35.874Z", "originBoardId": 114 } ], "comment": { "comments": [ { "id": "450473", "author": { "name": "hknoechel", "key": "hansknoechel", "displayName": "Hans Knöchel", "active": true, "timeZone": "Europe/Berlin" }, "body": "[~vijaysingh] Any update here? This is one of the last iOS 13 blockers we have. You can fix it by using the {{UINavigationBarAppearance}} class for iOS 13+", "updateAuthor": { "name": "hknoechel", "key": "hansknoechel", "displayName": "Hans Knöchel", "active": true, "timeZone": "Europe/Berlin" }, "created": "2019-08-14T10:43:04.000+0000", "updated": "2019-08-14T10:43:04.000+0000" }, { "id": "450536", "author": { "name": "hknoechel", "key": "hansknoechel", "displayName": "Hans Knöchel", "active": true, "timeZone": "Europe/Berlin" }, "body": "I updated the native test case with \"test_barcolor_adapted\" which fixes it properly by using {{UINavigationBar.appearance().backgroundColor = XXXX}} on iOS 13+ and resets it to {{nil}} on the {{viewWillDisappear}} delegate of the view controller so it's more flexible for other windows. But I think it should be synced in {{ViewWillAppear}} as well, so other view controller can tint back to their color as well.\r\n\r\nWe workarounded it by blocking large titles if dark mode is enabled.", "updateAuthor": { "name": "hknoechel", "key": "hansknoechel", "displayName": "Hans Knöchel", "active": true, "timeZone": "Europe/Berlin" }, "created": "2019-08-16T20:20:23.000+0000", "updated": "2019-08-16T20:58:05.000+0000" }, { "id": "450706", "author": { "name": "vijaysingh", "key": "vijaysingh", "displayName": "Vijay Singh", "active": true, "timeZone": "America/Los_Angeles" }, "body": "[~hknoechel] \r\n1. In navigation bar 'barTintColor' property is not working when 'prefersLargeTitles' is set true. This is happening in native code as well. So I will file a bug to apple. I am looking for workaround and trying suggestion given by you as well.\r\n2. For backgroundColor, Ideally backgroundColor of window should come behind the navigation bar as per native behavior in iOS 13. I am looking in this.", "updateAuthor": { "name": "vijaysingh", "key": "vijaysingh", "displayName": "Vijay Singh", "active": true, "timeZone": "America/Los_Angeles" }, "created": "2019-08-22T00:31:47.000+0000", "updated": "2019-08-22T00:31:47.000+0000" }, { "id": "450709", "author": { "name": "hknoechel", "key": "hansknoechel", "displayName": "Hans Knöchel", "active": true, "timeZone": "Europe/Berlin" }, "body": "[~vijaysingh] That is not correct. When {{prefersLargeTitles}} is set to {{true}}, the background-color is used for tinting the nav bar - per design. The same does not work for Titanium, so Titanium needs to fix it. This is a release blocker, so we hope this can be investigated soon.\r\n\r\n*EDIT*: This also effects light mode with large titles + **non**-modal windows. Please take this bug serious.", "updateAuthor": { "name": "hknoechel", "key": "hansknoechel", "displayName": "Hans Knöchel", "active": true, "timeZone": "Europe/Berlin" }, "created": "2019-08-22T07:51:33.000+0000", "updated": "2019-08-22T11:49:47.000+0000" }, { "id": "450884", "author": { "name": "vijaysingh", "key": "vijaysingh", "displayName": "Vijay Singh", "active": true, "timeZone": "America/Los_Angeles" }, "body": "PR - https://github.com/appcelerator/titanium_mobile/pull/11184\r\n\r\nTest Case 1-\r\n\r\n{code:java}\r\n var win1 = Ti.UI.createWindow({ backgroundColor: 'red', title: 'Test1', largeTitleEnabled: true });\r\n var button1 = Ti.UI.createButton({\r\n title: \"Open Next\"\r\n });\r\n\r\n win1.add(button1);\r\n \r\n var nav = Ti.UI.createNavigationWindow({\r\n window: win1\r\n });\r\n \r\n nav.open();\r\n\r\n var win2 = Ti.UI.createWindow({ backgroundColor: 'green', title: 'Test2', largeTitleEnabled: true });\r\n var button2 = Ti.UI.createButton({\r\n title: \"Close\"\r\n });\r\n win2.add(button2);\r\n\r\n button1.addEventListener('click', function(e){\r\n nav.openWindow(win2);\r\n })\r\n\r\n button2.addEventListener('click', function(e){\r\n win2.close();\r\n })\r\n{code}\r\n \r\nTest Case 2 -\r\n\r\n{code:java}\r\nvar win = Ti.UI.createWindow({\r\n backgroundColor: 'white'\r\n});\r\n \r\nvar btn = Ti.UI.createButton({\r\n title: 'Open VC'\r\n});\r\n \r\nbtn.addEventListener('click', function() {\r\n var win2 = Ti.UI.createWindow({ backgroundColor: 'red', title: 'Hello', largeTitleEnabled: true });\r\n var nav = Ti.UI.createNavigationWindow({\r\n window: win2\r\n });\r\n nav.open({ modal: true })\r\n});\r\nwin.add(btn);\r\nwin.open();\r\n{code}\r\n\r\n\r\nTest Case 3 -\r\n\r\n{code:java}\r\nvar win1 = Ti.UI.createWindow({ \r\nbackgroundColor: 'red', \r\ntitle: 'Test1', \r\nlargeTitleEnabled: true,\r\nextendEdges: [Ti.UI.EXTEND_EDGE_TOP] \r\n});\r\n var data = [{ title: 'Test 1' }, { title: 'Test 2' }, { title: 'Test 3' }, { title: 'Test 4' } ];\r\n var tableView = Ti.UI.createTableView({data : data});\r\n win1.add(tableView);\r\n\r\nvar nav = Ti.UI.createNavigationWindow({\r\n window: win1\r\n});\r\n\r\nnav.open();\r\n\r\nvar win2 = Ti.UI.createWindow({ \r\n backgroundColor: 'green', \r\n title: 'Test2', \r\n largeTitleEnabled: true,\r\n extendEdges: [Ti.UI.EXTEND_EDGE_TOP] \r\n});\r\nvar data2 = [{ title: 'Test 1' }, { title: 'Test 2' }, { title: 'Test 3' }, { title: 'Test 4' } ];\r\nvar tableView2 = Ti.UI.createTableView({data : data2});\r\nwin2.add(tableView2);\r\ntableView.addEventListener('click', function(e){\r\n nav.openWindow(win2);\r\n});\r\n{code}", "updateAuthor": { "name": "vijaysingh", "key": "vijaysingh", "displayName": "Vijay Singh", "active": true, "timeZone": "America/Los_Angeles" }, "created": "2019-08-28T01:55:41.000+0000", "updated": "2019-09-03T22:20:47.000+0000" }, { "id": "450885", "author": { "name": "vijaysingh", "key": "vijaysingh", "displayName": "Vijay Singh", "active": true, "timeZone": "America/Los_Angeles" }, "body": "[~hknoechel] Would you like to test above PR. I am still working on this to find a better solution.", "updateAuthor": { "name": "vijaysingh", "key": "vijaysingh", "displayName": "Vijay Singh", "active": true, "timeZone": "America/Los_Angeles" }, "created": "2019-08-28T01:56:55.000+0000", "updated": "2019-08-28T01:56:55.000+0000" }, { "id": "451061", "author": { "name": "vijaysingh", "key": "vijaysingh", "displayName": "Vijay Singh", "active": true, "timeZone": "America/Los_Angeles" }, "body": "Reason of this issue is that we set the default value of property [edgesForExtendedLayout |https://github.com/appcelerator/titanium_mobile/blob/da842f4eff133891667abac41b197a177ff94944/iphone/TitaniumKit/TitaniumKit/Sources/API/TiUtils.m#L1577] to UIRectEdgeNone from [here|https://github.com/appcelerator/titanium_mobile/blob/da842f4eff133891667abac41b197a177ff94944/iphone/TitaniumKit/TitaniumKit/Sources/API/TiUtils.m#L1641]. Apple recommend to not change default value as per [doc|https://developer.apple.com/documentation/uikit/uiviewcontroller/1621515-edgesforextendedlayout?language=objc].\r\n\r\nSo use window property [extendEdges|https://docs.appcelerator.com/platform/latest/#!/api/Titanium.UI.TabGroup-property-extendEdges].\r\n\r\n{code:java}\r\n var win = Ti.UI.createWindow({ \r\n backgroundColor: 'blue', \r\n title: 'Test', \r\n largeTitleEnabled: true,\r\n extendEdges: [Ti.UI.EXTEND_EDGE_TOP] \r\n });\r\n{code}\r\n\r\nNote- With Above PR there is minor flickering issue. But it is better to have that PR in SDK. \r\nWe should not change default value extendEdges in minor release.", "updateAuthor": { "name": "vijaysingh", "key": "vijaysingh", "displayName": "Vijay Singh", "active": true, "timeZone": "America/Los_Angeles" }, "created": "2019-09-03T19:34:06.000+0000", "updated": "2019-09-03T19:40:25.000+0000" }, { "id": "451062", "author": { "name": "hknoechel", "key": "hansknoechel", "displayName": "Hans Knöchel", "active": true, "timeZone": "Europe/Berlin" }, "body": "Interesting! So does moving to EXTEND_EDGE_TOP + using the PR fix all flicker issues? And please consider making it to EXTEND_EDGE_ALL in SDK 9.0 (maybe with a ticket to remind everyone). If I remember correctly, there used to be some issues (around SDK 4/5) related to list-views in windows with extended edges, but maybe thats fixed by now.", "updateAuthor": { "name": "hknoechel", "key": "hansknoechel", "displayName": "Hans Knöchel", "active": true, "timeZone": "Europe/Berlin" }, "created": "2019-09-03T19:45:02.000+0000", "updated": "2019-09-03T19:45:02.000+0000" }, { "id": "451090", "author": { "name": "hknoechel", "key": "hansknoechel", "displayName": "Hans Knöchel", "active": true, "timeZone": "Europe/Berlin" }, "body": "We just tested with \"extendEdges\" on all windows + your latest pull request changes and it does not fix the issue so far.", "updateAuthor": { "name": "hknoechel", "key": "hansknoechel", "displayName": "Hans Knöchel", "active": true, "timeZone": "Europe/Berlin" }, "created": "2019-09-04T18:04:59.000+0000", "updated": "2019-09-04T18:04:59.000+0000" }, { "id": "451091", "author": { "name": "vijaysingh", "key": "vijaysingh", "displayName": "Vijay Singh", "active": true, "timeZone": "America/Los_Angeles" }, "body": "[~hknoechel] you are still seeing flickering issue or any other?\r\n", "updateAuthor": { "name": "vijaysingh", "key": "vijaysingh", "displayName": "Vijay Singh", "active": true, "timeZone": "America/Los_Angeles" }, "created": "2019-09-04T18:11:54.000+0000", "updated": "2019-09-04T18:11:54.000+0000" }, { "id": "451093", "author": { "name": "hknoechel", "key": "hansknoechel", "displayName": "Hans Knöchel", "active": true, "timeZone": "Europe/Berlin" }, "body": "Still the same as yesterday. You can test with our app.", "updateAuthor": { "name": "hknoechel", "key": "hansknoechel", "displayName": "Hans Knöchel", "active": true, "timeZone": "Europe/Berlin" }, "created": "2019-09-04T18:19:08.000+0000", "updated": "2019-09-04T18:19:08.000+0000" }, { "id": "451095", "author": { "name": "vijaysingh", "key": "vijaysingh", "displayName": "Vijay Singh", "active": true, "timeZone": "America/Los_Angeles" }, "body": "[~hknoechel] Its weird if I use property in view's .xml file it doesn't work. I guess you are using this property inside .xml . Please use it inside Controller'e .js file. See attached [sample app|https://www.dropbox.com/s/e1x3dfiqdfmmdaz/TestAise.zip?dl=0]. I do not have access to your app.", "updateAuthor": { "name": "vijaysingh", "key": "vijaysingh", "displayName": "Vijay Singh", "active": true, "timeZone": "America/Los_Angeles" }, "created": "2019-09-04T18:38:35.000+0000", "updated": "2019-09-04T18:39:42.000+0000" }, { "id": "451146", "author": { "name": "lchoudhary", "key": "lchoudhary", "displayName": "Lokesh Choudhary", "active": true, "timeZone": "America/Los_Angeles" }, "body": "FR Passed.\r\nPR Merged.", "updateAuthor": { "name": "lchoudhary", "key": "lchoudhary", "displayName": "Lokesh Choudhary", "active": true, "timeZone": "America/Los_Angeles" }, "created": "2019-09-05T22:05:48.000+0000", "updated": "2019-09-05T22:05:48.000+0000" }, { "id": "451147", "author": { "name": "lchoudhary", "key": "lchoudhary", "displayName": "Lokesh Choudhary", "active": true, "timeZone": "America/Los_Angeles" }, "body": "Keeping this ticket in resolved as more fixes and additions can be made to it.", "updateAuthor": { "name": "lchoudhary", "key": "lchoudhary", "displayName": "Lokesh Choudhary", "active": true, "timeZone": "America/Los_Angeles" }, "created": "2019-09-05T22:06:40.000+0000", "updated": "2019-09-05T22:06:40.000+0000" }, { "id": "451181", "author": { "name": "vijaysingh", "key": "vijaysingh", "displayName": "Vijay Singh", "active": true, "timeZone": "America/Los_Angeles" }, "body": "[~lchoudhary]\r\nPR (with minor fixes) - https://github.com/appcelerator/titanium_mobile/pull/11199\r\nPR (8_2_X) - https://github.com/appcelerator/titanium_mobile/pull/11209", "updateAuthor": { "name": "vijaysingh", "key": "vijaysingh", "displayName": "Vijay Singh", "active": true, "timeZone": "America/Los_Angeles" }, "created": "2019-09-06T18:17:56.000+0000", "updated": "2019-09-10T19:05:44.000+0000" }, { "id": "451254", "author": { "name": "hknoechel", "key": "hansknoechel", "displayName": "Hans Knöchel", "active": true, "timeZone": "Europe/Berlin" }, "body": "Again, this is not fixed so far. Recent changes caused a regression that now tints the bar-color of windows with large titles to be different from the background-color of the view, which is what all this should be about. We tested the above (currently unmerged) pull request as well. Note that is does work with modal windows with large titles now, but not inside tab groups (and probably for normal navigation windows).", "updateAuthor": { "name": "hknoechel", "key": "hansknoechel", "displayName": "Hans Knöchel", "active": true, "timeZone": "Europe/Berlin" }, "created": "2019-09-10T11:53:03.000+0000", "updated": "2019-09-10T11:53:40.000+0000" }, { "id": "451268", "author": { "name": "hknoechel", "key": "hansknoechel", "displayName": "Hans Knöchel", "active": true, "timeZone": "Europe/Berlin" }, "body": "Workaround: Remove the {{barColor}} for iOS 13 and later!", "updateAuthor": { "name": "hknoechel", "key": "hansknoechel", "displayName": "Hans Knöchel", "active": true, "timeZone": "Europe/Berlin" }, "created": "2019-09-10T17:21:06.000+0000", "updated": "2019-09-10T17:21:06.000+0000" }, { "id": "451273", "author": { "name": "vijaysingh", "key": "vijaysingh", "displayName": "Vijay Singh", "active": true, "timeZone": "America/Los_Angeles" }, "body": "[~hknoechel] Please see my latest comment in PR https://github.com/appcelerator/titanium_mobile/pull/11184. barColor has preference over backgroundColor. It will give more customization on navigation bar.", "updateAuthor": { "name": "vijaysingh", "key": "vijaysingh", "displayName": "Vijay Singh", "active": true, "timeZone": "America/Los_Angeles" }, "created": "2019-09-10T19:25:06.000+0000", "updated": "2019-09-10T19:25:06.000+0000" }, { "id": "451443", "author": { "name": "lchoudhary", "key": "lchoudhary", "displayName": "Lokesh Choudhary", "active": true, "timeZone": "America/Los_Angeles" }, "body": "Verified the fix in SDK 8.2.0.v20190916135701.\r\nClosing.\r\n", "updateAuthor": { "name": "lchoudhary", "key": "lchoudhary", "displayName": "Lokesh Choudhary", "active": true, "timeZone": "America/Los_Angeles" }, "created": "2019-09-17T16:04:14.000+0000", "updated": "2019-09-17T16:04:14.000+0000" } ], "maxResults": 21, "total": 21, "startAt": 0 } } }