{ "id": "154389", "key": "TIMOB-20255", "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": "2016-02-08T19:29:05.000+0000", "created": "2016-01-18T10:30:02.000+0000", "priority": { "name": "Critical", "id": "1" }, "labels": [], "versions": [ { "id": "17072", "name": "Release 5.1.2", "archived": false, "released": true, "releaseDate": "2016-01-12" } ], "issuelinks": [], "assignee": { "name": "shossain", "key": "shossain", "displayName": "Shak Hossain", "active": false, "timeZone": "America/Los_Angeles" }, "updated": "2017-06-07T21:31:06.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": "*Example code*:\r\n{code}\r\nvar label = Ti.UI.createLabel({\r\n opacity: 1,\r\n color: '#000'\r\n)};\r\n\r\nvar animation = Ti.UI.createAnimation({\r\n duration: 500,\r\n opacity: 0\r\n)};\r\n\r\nlabel.animate(animation);\r\n\r\nanimation.addEventListener('complete', someFunction);\r\n{code}\r\n*Expected behaviour:*\r\nAnimation should work (for example text may be set dynamically and user is not sure if there will be any text) and opacity value should be changed. 'complete' event should be fired.\r\n\r\n*Actual behaviour*:\r\nIf text property is not set or set to '' (empty string), than animation won't work and complete listener won't be fired.\r\n\r\n*Actual workaround*: \r\nBefore calling animation user have to check if string is empty/not set and then take appropriate behavior.\r\n{code}\r\nif(label.text) {\r\n label.animate(animation);\r\n animation.addEventListener('complete', someFunction);\r\n} else {\r\n someFunction();\r\n}\r\n{code}\r\n", "attachment": [], "flagged": false, "summary": "Label will not animate if text property is empty string or not defined", "creator": { "name": "CREATIVE KAIZEN", "key": "creative kaizen", "displayName": "CREATIVE KAIZEN", "active": true, "timeZone": "America/Los_Angeles" }, "subtasks": [], "reporter": { "name": "CREATIVE KAIZEN", "key": "creative kaizen", "displayName": "CREATIVE KAIZEN", "active": true, "timeZone": "America/Los_Angeles" }, "environment": "AS: 4.4.0.201511241829\r\nSDK: 5.1.1GA\r\nMac OS X El Captain", "comment": { "comments": [ { "id": "376257", "author": { "name": "apetkov", "key": "apetkov", "displayName": "Angel Petkov", "active": true, "timeZone": "America/Los_Angeles" }, "body": "[~CREATIVE KAIZEN] Hello this is not a bug, the reason this doesn't work is because if a label height/width is not specified it will be automatically sized depending on the text inside the label. The fact you are neither specifying the text or size properties the label will just be empty with a size of 0. Which is why the animation cannot be seen. What use case are you using for the need to have an empty label with no size specified ?\r\n\r\nIf you need an empty label with animation , all you have to do is specify the size and it will work. \r\nFor example :\r\n{code:javascript}\r\nvar win = Ti.UI.createWindow({\r\n backgroundColor : 'white'\r\n});\r\nvar label = Ti.UI.createLabel({\r\n //text : 'Hello World', //comment out this property to test the animation \r\n top : 250,\r\n opacity : 1,\r\n color : '#000',\r\n backgroundColor : \"green\",\r\n height :50,\r\n width :50\r\n});\r\nvar animation = Titanium.UI.createAnimation();\r\nanimation.backgroundColor = 'black';\r\nanimation.duration = 1000;\r\nvar animationHandler = function() {\r\n animation.removeEventListener('complete',animationHandler);\r\n animation.backgroundColor = 'orange';\r\n label.animate(animation);\r\n};\r\nanimation.addEventListener('complete',animationHandler);\r\nlabel.animate(animation);\r\nwin.add(label);\r\nwin.open();\r\n{code}", "updateAuthor": { "name": "apetkov", "key": "apetkov", "displayName": "Angel Petkov", "active": true, "timeZone": "America/Los_Angeles" }, "created": "2016-02-08T19:17:57.000+0000", "updated": "2016-02-08T19:26:32.000+0000" }, { "id": "376260", "author": { "name": "penrique", "key": "penrique", "displayName": "Pedro Enrique", "active": false, "timeZone": "America/Los_Angeles" }, "body": "Resolving as invalid. {{width}}, {{height}}, and {{text}} properties are missing.", "updateAuthor": { "name": "penrique", "key": "penrique", "displayName": "Pedro Enrique", "active": false, "timeZone": "America/Los_Angeles" }, "created": "2016-02-08T19:29:05.000+0000", "updated": "2016-02-08T19:29:05.000+0000" }, { "id": "376267", "author": { "name": "CREATIVE KAIZEN", "key": "creative kaizen", "displayName": "CREATIVE KAIZEN", "active": true, "timeZone": "America/Los_Angeles" }, "body": "Hello,\r\n@Angel: If you have a label, which content is downloaded dynamically (via API), than u don't know the value of height and u cannot set it on creation. And u may want to animate some text on load and then change the value of text and depending if first text was empty string or not then u have different color at the end.\r\n@Pedro: Yes. This is what I wrote. Animation will not change the colors if those values are not set on creation. If we don't set height/width (but text) it will work, if we don't set text (but height/width) it will work, so if u don't set any of those it is quite bizarre that output will be different. So I consider it as a bug.", "updateAuthor": { "name": "CREATIVE KAIZEN", "key": "creative kaizen", "displayName": "CREATIVE KAIZEN", "active": true, "timeZone": "America/Los_Angeles" }, "created": "2016-02-08T20:02:38.000+0000", "updated": "2016-02-08T20:02:38.000+0000" }, { "id": "376279", "author": { "name": "apetkov", "key": "apetkov", "displayName": "Angel Petkov", "active": true, "timeZone": "America/Los_Angeles" }, "body": "[~CREATIVE KAIZEN] If thats the case set the label size to 'Ti.UI.SIZE' and it will be sized to whatever is needed depending on the size of the downloaded content. So soon as the label is populated with the downloaded content it will appear and it will be animated. \r\n\r\nFor example :\r\n{code:javaScript}\r\nvar win = Ti.UI.createWindow({\r\n backgroundColor : 'white'\r\n});\r\nvar label = Ti.UI.createLabel({\r\n top : 250,\r\n opacity : 1,\r\n color : '#000',\r\n backgroundColor : \"green\",\r\n});\r\n\r\nsetTimeout(function(){\r\n\r\n label.text = \"hello world\";\r\n label.width = Ti.UI.SIZE;\r\n label.height = Ti.UI.SIZE;\r\n \r\n var animation = Titanium.UI.createAnimation();\r\n animation.backgroundColor = 'black';\r\n animation.duration = 1000;\r\n \r\n var animationHandler = function() {\r\n animation.removeEventListener('complete',animationHandler);\r\n animation.backgroundColor = 'orange';\r\n label.animate(animation);\r\n };\r\n animation.addEventListener('complete',animationHandler);\r\n label.animate(animation);\r\n\r\n}, 3000);\r\n\r\nwin.add(label);\r\nwin.open();\r\n{code}", "updateAuthor": { "name": "apetkov", "key": "apetkov", "displayName": "Angel Petkov", "active": true, "timeZone": "America/Los_Angeles" }, "created": "2016-02-08T21:23:23.000+0000", "updated": "2016-02-08T23:14:09.000+0000" }, { "id": "421250", "author": { "name": "lmorris", "key": "lmorris", "displayName": "Lee Morris", "active": false, "timeZone": "America/Los_Angeles" }, "body": "Closing ticket, please open a new ticket if any more problems persist.", "updateAuthor": { "name": "lmorris", "key": "lmorris", "displayName": "Lee Morris", "active": false, "timeZone": "America/Los_Angeles" }, "created": "2017-06-07T21:31:06.000+0000", "updated": "2017-06-07T21:31:06.000+0000" } ], "maxResults": 6, "total": 6, "startAt": 0 } } }