{ "id": "173837", "key": "TIMOB-27237", "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": "20832", "name": "Release 8.3.0", "archived": false, "released": true, "releaseDate": "2019-11-25" } ], "resolution": { "id": "1", "description": "A fix for this issue is checked into the tree and tested.", "name": "Fixed" }, "resolutiondate": "2019-10-04T10:35:46.000+0000", "created": "2019-07-04T01:42:12.000+0000", "priority": { "name": "Critical", "id": "1" }, "labels": [ "animation", "borderRadius", "button", "engSchedule", "label", "titanium" ], "versions": [], "issuelinks": [], "assignee": { "name": "ybanev", "key": "ybanev", "displayName": "Yordan Banev", "active": true, "timeZone": "Europe/Athens" }, "updated": "2019-10-04T10:35: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": "10202", "name": "Android", "description": "Android Platform" } ], "description": "Adding the property borderRadius to a label or a button and animating the backgroundColor makes it always go from white to the animated color instead of animating from the view background color to the new color.\r\n\r\nTest case:\r\n\r\n{code: JavaScript}\r\nvar win = Ti.UI.createWindow({\r\n layout : 'vertical',\r\n width : Ti.UI.FILL,\r\n height : Ti.UI.FILL\r\n });\r\n\r\n var label = Ti.UI.createLabel({\r\n width :Ti.UI.SIZE,\r\n font : {\r\n fontSize : 14\r\n },\r\n text : 'Should go from blue to black',\r\n textAlign : 'center',\r\n color : 'white',\r\n backgroundColor : 'blue',\r\n borderRadius : 20\r\n });\r\n \r\n label.addEventListener('click',function() {\r\n label.animate({\r\n backgroundColor : '#000',\r\n duration : 10000\r\n });\r\n });\r\n \r\n win.add(label);\r\n win.open();\r\n{code}\r\n\r\nThe expected behavior is for the background to go from {color:blue}blue{color} to {color:black}black{color} but instead it goes from white to black. If you remove the borderRadius then it works as expected.\r\nA workaround is to wrap the label/button in a view.", "attachment": [ { "id": "66755", "filename": "1562230320886.JPEG", "author": { "name": "rmitro", "key": "rmitro", "displayName": "Rakhi Mitro", "active": false, "timeZone": "America/Los_Angeles" }, "created": "2019-07-04T08:56:36.000+0000", "size": 12036, "mimeType": "image/jpeg" }, { "id": "66754", "filename": "1562230320932.JPEG", "author": { "name": "rmitro", "key": "rmitro", "displayName": "Rakhi Mitro", "active": false, "timeZone": "America/Los_Angeles" }, "created": "2019-07-04T08:55:58.000+0000", "size": 12490, "mimeType": "image/jpeg" }, { "id": "66761", "filename": "1562408449852.JPEG", "author": { "name": "jnaher", "key": "jnaher", "displayName": "Jebun Naher", "active": false, "timeZone": "Asia/Dhaka" }, "created": "2019-07-06T10:22:39.000+0000", "size": 17968, "mimeType": "image/jpeg" }, { "id": "66762", "filename": "1562408449904.JPEG", "author": { "name": "jnaher", "key": "jnaher", "displayName": "Jebun Naher", "active": false, "timeZone": "Asia/Dhaka" }, "created": "2019-07-06T10:22:39.000+0000", "size": 17502, "mimeType": "image/jpeg" }, { "id": "66756", "filename": "ui_bug_brorderradius.gif", "author": { "name": "remo.loaiza", "key": "remo.loaiza", "displayName": "remo.loaiza", "active": true, "timeZone": "America/Mexico_City" }, "created": "2019-07-04T17:45:12.000+0000", "size": 874772, "mimeType": "image/gif" } ], "flagged": false, "summary": "Android: Animating a Label or Button with borderRadius bugs the backgroundColor animation.", "creator": { "name": "remo.loaiza", "key": "remo.loaiza", "displayName": "remo.loaiza", "active": true, "timeZone": "America/Mexico_City" }, "subtasks": [], "reporter": { "name": "remo.loaiza", "key": "remo.loaiza", "displayName": "remo.loaiza", "active": true, "timeZone": "America/Mexico_City" }, "environment": "SDK 7.5.1\r\nAndroid 6\r\nAndroid 9", "comment": { "comments": [ { "id": "449600", "author": { "name": "rmitro", "key": "rmitro", "displayName": "Rakhi Mitro", "active": false, "timeZone": "America/Los_Angeles" }, "body": "Hello [~remo.loaiza],\r\nThanks for reporting this. Are you using SDK 7.5.1 for testing? It would be great if you can test on SDK 8.0.2.GA and let us know the result. To install SDK 8.0.2.GA please open terminal and type: *appc ti sdk install 8.0.2.GA*", "updateAuthor": { "name": "rmitro", "key": "rmitro", "displayName": "Rakhi Mitro", "active": false, "timeZone": "America/Los_Angeles" }, "created": "2019-07-04T04:06:46.000+0000", "updated": "2019-07-04T04:06:46.000+0000" }, { "id": "449603", "author": { "name": "remo.loaiza", "key": "remo.loaiza", "displayName": "remo.loaiza", "active": true, "timeZone": "America/Mexico_City" }, "body": "Hi Rakhi, I just tested in 8.0.2 GA and it's still there.", "updateAuthor": { "name": "remo.loaiza", "key": "remo.loaiza", "displayName": "remo.loaiza", "active": true, "timeZone": "America/Mexico_City" }, "created": "2019-07-04T04:27:33.000+0000", "updated": "2019-07-04T04:27:33.000+0000" }, { "id": "449606", "author": { "name": "rmitro", "key": "rmitro", "displayName": "Rakhi Mitro", "active": false, "timeZone": "America/Los_Angeles" }, "body": "[~remo.loaiza],\r\nWe tested this on 8.0.2 GA(Android device Huawei y9 2018) and unable to reproduce this as a bug. This is working as expected. Check the outputs:\r\n\r\n\r\n*Before click:*\r\n !1562230320932.JPEG|thumbnail! \r\n*After click:*\r\n !1562230320886.JPEG|thumbnail! \r\n\r\nThe expected behaviour is for the background to go from blue to black.\r\n", "updateAuthor": { "name": "rmitro", "key": "rmitro", "displayName": "Rakhi Mitro", "active": false, "timeZone": "America/Los_Angeles" }, "created": "2019-07-04T08:57:31.000+0000", "updated": "2019-07-04T08:57:31.000+0000" }, { "id": "449612", "author": { "name": "remo.loaiza", "key": "remo.loaiza", "displayName": "remo.loaiza", "active": true, "timeZone": "America/Mexico_City" }, "body": "Im sorry, I think I may not have explained the problem as I should.\r\nIf you add a border radius the animation goes to white first then it goes to black. This is not expected, it should go from blue to black. \r\nHere's a GIF of the bug and new test code:\r\n\r\n!ui_bug_brorderradius.gif! \r\n\r\n\r\n{code:Javascript}\r\n var win = Ti.UI.createWindow({\r\n layout : 'vertical',\r\n width : Ti.UI.FILL,\r\n height : Ti.UI.FILL\r\n });\r\n \r\n var label = Ti.UI.createLabel({\r\n top : 20,\r\n width :'80%',\r\n font : {\r\n fontSize : 14\r\n },\r\n text : 'Should go from blue to black',\r\n textAlign : 'center',\r\n color : 'white',\r\n backgroundColor : 'blue',\r\n borderRadius : 20\r\n });\r\n \r\n var label2 = Ti.UI.createLabel({\r\n top : 20,\r\n width :'80%',\r\n font : {\r\n fontSize : 14\r\n },\r\n text : 'Should go from blue to black',\r\n textAlign : 'center',\r\n color : 'white',\r\n backgroundColor : 'blue'\r\n });\r\n \r\n label.addEventListener('click',function() {\r\n label.animate({\r\n backgroundColor : '#000',\r\n duration : 10000\r\n });\r\n label2.animate({\r\n backgroundColor : '#000',\r\n duration : 10000\r\n });\r\n });\r\n \r\n win.add(label);\r\n win.add(label2);\r\n win.open();\r\n{code}\r\n", "updateAuthor": { "name": "remo.loaiza", "key": "remo.loaiza", "displayName": "remo.loaiza", "active": true, "timeZone": "America/Mexico_City" }, "created": "2019-07-04T17:46:20.000+0000", "updated": "2019-07-04T17:46:20.000+0000" }, { "id": "449625", "author": { "name": "jnaher", "key": "jnaher", "displayName": "Jebun Naher", "active": false, "timeZone": "Asia/Dhaka" }, "body": "Hello [~remo.loaiza],\r\nThanks for your update. I just tested the issue using ti sdk 8.0.2 GA on physical android device Huawei y9 2018. The issue does not reproduce on our end. The animation goes directly from blue to black, it doesn't go to white first. Please find the screenshots.\r\n !1562408449852.JPEG|thumbnail! !1562408449904.JPEG|thumbnail! \r\nCan you share your device / emulator details please? ", "updateAuthor": { "name": "jnaher", "key": "jnaher", "displayName": "Jebun Naher", "active": false, "timeZone": "Asia/Dhaka" }, "created": "2019-07-06T10:24:19.000+0000", "updated": "2019-07-06T10:24:19.000+0000" }, { "id": "449654", "author": { "name": "remo.loaiza", "key": "remo.loaiza", "displayName": "remo.loaiza", "active": true, "timeZone": "America/Mexico_City" }, "body": "Ive tried and reproduced this on a HUAWEI P30 Android 9 device, Android 6 emulator, and on a Sony D6603 running Android 6. On all Ive tried both SDKs 7.5.1 and 8.0.2.\r\n\r\nI started a new project with 8.0.2 to test if it was not another setting i've put in and I can reproduce this still. However, by default a new project uses the dark theme so instead of starting from white it starts from black. Which leads me to think this is somehow related to Android themes.", "updateAuthor": { "name": "remo.loaiza", "key": "remo.loaiza", "displayName": "remo.loaiza", "active": true, "timeZone": "America/Mexico_City" }, "created": "2019-07-08T19:43:20.000+0000", "updated": "2019-07-08T19:43:20.000+0000" }, { "id": "449738", "author": { "name": "sdarda", "key": "sdarda", "displayName": "Sharif AbuDarda", "active": false, "timeZone": "Asia/Dhaka" }, "body": "Hello [~remo.loaiza], The issue occurs with the white window background. I was able to reproduce the issue using a white background. The issue is when using a border radius to the label. Clicking on it will first remove the background color(blue) and then the black background color starts to animate(from white to black). This is more visible in a white background. The expected behavior is shown in the second label. Where the animation turns the background color to black in 10s. Tested with SDK 8.0.2.GA in Android 9.0.1 device (Nokia 6). The issue is with both label and button. Working as expected in iOS. Moving to engineering. Thanks.", "updateAuthor": { "name": "sdarda", "key": "sdarda", "displayName": "Sharif AbuDarda", "active": false, "timeZone": "Asia/Dhaka" }, "created": "2019-07-11T18:45:56.000+0000", "updated": "2019-07-11T19:09:01.000+0000" }, { "id": "449838", "author": { "name": "ybanev", "key": "ybanev", "displayName": "Yordan Banev", "active": true, "timeZone": "Europe/Athens" }, "body": "PR (master): https://github.com/appcelerator/titanium_mobile/pull/11053", "updateAuthor": { "name": "ybanev", "key": "ybanev", "displayName": "Yordan Banev", "active": true, "timeZone": "Europe/Athens" }, "created": "2019-07-16T14:33:41.000+0000", "updated": "2019-07-16T14:33:41.000+0000" }, { "id": "450206", "author": { "name": "kmahalingam", "key": "kmahalingam", "displayName": "Keerthi Mahalingam", "active": false, "timeZone": "America/Los_Angeles" }, "body": "FR Passed. Waiting for 8.1.0 GA release to merge PR.", "updateAuthor": { "name": "kmahalingam", "key": "kmahalingam", "displayName": "Keerthi Mahalingam", "active": false, "timeZone": "America/Los_Angeles" }, "created": "2019-08-01T05:07:17.000+0000", "updated": "2019-08-01T05:07:17.000+0000" }, { "id": "450574", "author": { "name": "ybanev", "key": "ybanev", "displayName": "Yordan Banev", "active": true, "timeZone": "Europe/Athens" }, "body": "PR (8_3_X): https://github.com/appcelerator/titanium_mobile/pull/11158", "updateAuthor": { "name": "ybanev", "key": "ybanev", "displayName": "Yordan Banev", "active": true, "timeZone": "Europe/Athens" }, "created": "2019-08-19T14:32:29.000+0000", "updated": "2019-08-19T14:32:29.000+0000" }, { "id": "450582", "author": { "name": "kmahalingam", "key": "kmahalingam", "displayName": "Keerthi Mahalingam", "active": false, "timeZone": "America/Los_Angeles" }, "body": "FR passed.Unit tests are failing .not able to merge PR\r\n", "updateAuthor": { "name": "kmahalingam", "key": "kmahalingam", "displayName": "Keerthi Mahalingam", "active": false, "timeZone": "America/Los_Angeles" }, "created": "2019-08-19T17:28:39.000+0000", "updated": "2019-08-19T20:05:48.000+0000" }, { "id": "451236", "author": { "name": "kmahalingam", "key": "kmahalingam", "displayName": "Keerthi Mahalingam", "active": false, "timeZone": "America/Los_Angeles" }, "body": "PR merged on master.", "updateAuthor": { "name": "kmahalingam", "key": "kmahalingam", "displayName": "Keerthi Mahalingam", "active": false, "timeZone": "America/Los_Angeles" }, "created": "2019-09-09T21:37:55.000+0000", "updated": "2019-09-09T21:37:55.000+0000" }, { "id": "451845", "author": { "name": "ssaddique", "key": "ssaddique", "displayName": "Sohail Saddique", "active": true, "timeZone": "Europe/London" }, "body": "*Verified fix*\r\n\r\nTest environment:\r\n\r\nStudio Ver: 5.1.4.201909061933\r\nSDK Ver: 8.3.0.v20191003144543\r\nMac OS Ver: 10.14.6\r\nTi CLI Ver: 5.2.1\r\nNode Ver: 10.16.3\r\nNPM Ver: 6.11.3\r\nEmulator: ⇨ Android 10 (Pixel 3 XL)\r\n\r\nClosing ticket.\r\n", "updateAuthor": { "name": "ssaddique", "key": "ssaddique", "displayName": "Sohail Saddique", "active": true, "timeZone": "Europe/London" }, "created": "2019-10-04T10:34:04.000+0000", "updated": "2019-10-04T10:35:24.000+0000" } ], "maxResults": 14, "total": 14, "startAt": 0 } } }