{ "id": "127837", "key": "TIMOB-16641", "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": "15939", "description": "2014 Sprint 07", "name": "2014 Sprint 07", "archived": true, "released": true, "releaseDate": "2014-04-11" }, { "id": "15940", "description": "2014 Sprint 07 SDK", "name": "2014 Sprint 07 SDK", "archived": true, "released": true, "releaseDate": "2014-04-11" } ], "resolution": { "id": "2", "description": "The problem described is an issue which will never be fixed.", "name": "Won't Fix" }, "resolutiondate": "2014-04-07T18:44:01.000+0000", "created": "2014-03-18T23:36:51.000+0000", "priority": { "name": "Low", "id": "4" }, "labels": [ "supportTeam", "triage" ], "versions": [ { "id": "15857", "description": "Release 3.2.2", "name": "Release 3.2.2", "archived": false, "released": true, "releaseDate": "2014-03-09" } ], "issuelinks": [], "assignee": { "name": "vduggal", "key": "vduggal", "displayName": "Vishal Duggal", "active": false, "timeZone": "America/Los_Angeles" }, "updated": "2017-03-22T22:59:28.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": "h6.Issue description\r\nTableViewRow has a view inside (where there are more children objects) for showing custom data. These Rows must be collapsed and expanded using an animation or just setting the row which changes its height. Once the row is expanded, all the rows must be shown. \r\n\r\nThe problem developer is facing is that these animations are being sloppy and the whole TableView starts blinking once the animation starts. \r\n\r\nWe have already used an animation and a View inside the tableViewRow which contains all the custom views and we have testing animating, a warning appears at the console: \r\n\r\n{code}\r\n[DEBUG] : Application booted in 212.884963 ms\r\n[WARN] : New layout set while view [object __alloyId2] animating: Will relayout after animation.\r\n[WARN] : New layout set while view [object __alloyId2] animating: Will relayout after animation.\r\n[WARN] : New layout set while view [object __alloyId70] animating: Will relayout after animation.\r\n[WARN] : New layout set while view [object __alloyId2] animating: Will relayout after animation.\r\n...\r\n{code}\r\n\r\nUsing 'app/controllers/index.js' and 'app/styles/index.tss' instead of commented out sections gets rid of the warning below although we haven't been able to achieve a decent result since from time to time the flickering persists.\r\n\r\nh6.Steps to reproduce\r\n# Launch sample demo project showing this blink once you click on a row.\r\n# Click either first, second or the third row to collapse or expand contents. The row flickers showing a red background (app/styles/index.tss). \r\n{code}\r\n\t\t\t\r\n\t\t\t\t\r\n\t\t\t\t\t\r\n\t\t\t\r\n{code}\r\n# If you remove the nested view and try out to add a transparent background the children objects will eventually disappear and appear as the user collapse-expand a TableViewRow (app/styles/index.tss). \r\n{code}\r\n\t\t\t\r\n\t\t\t\t\t\r\n{code}\r\n\r\n", "attachment": [ { "id": "46727", "filename": "Dummy.zip", "author": { "name": "egomez", "key": "egomez", "displayName": "Eduardo Gomez", "active": false, "timeZone": "America/Los_Angeles" }, "created": "2014-03-18T23:36:51.000+0000", "size": 5976038, "mimeType": "application/zip" } ], "flagged": false, "summary": "iOS: TableViewRow flickers when its height is set either Ti.UI.SIZE or fix value", "creator": { "name": "egomez", "key": "egomez", "displayName": "Eduardo Gomez", "active": false, "timeZone": "America/Los_Angeles" }, "subtasks": [], "reporter": { "name": "egomez", "key": "egomez", "displayName": "Eduardo Gomez", "active": false, "timeZone": "America/Los_Angeles" }, "environment": "iOS 7.1", "comment": { "comments": [ { "id": "299432", "author": { "name": "egomez", "key": "egomez", "displayName": "Eduardo Gomez", "active": false, "timeZone": "America/Los_Angeles" }, "body": "h6.Classic Titanium \n{code}\nTitanium.UI.setBackgroundColor('#000');\nvar rows = [];\nvar win1 = Titanium.UI.createWindow({\n\twidth : Ti.UI.FILL,\n\theight : Ti.UI.FILL,\n\tbackgroundColor : '#101010'\n});\n\nvar tableView = Ti.UI.createTableView({\n\twidth : Ti.UI.FILL,\n\theight : Ti.UI.FILL,\n\tbackgroundColor : 'black'\n});\n\ntableView.addEventListener('click', function(e) {\n\tvar row = e.row;\n\tif (!row) {\n\t\treturn false;\n\t}\n\tvar newHeight = row.collapsed ? 30 : 60;\n\trow.height = newHeight;\n\tif (row.collapsed == true) {\n\t\trow.collapsed = false;\n\t} else {\n\t\trow.collapsed = true;\n\t}\n\tTi.API.info(newHeight);\n});\n\nfor (var i = 0; i <= 7; i++) {\n\tvar row = Ti.UI.createTableViewRow({\n\t\twidth : Ti.UI.FILL,\n\t\theight: 60, //Ti.UI.SIZE,\n\t\tcollapsed : true,\n\t\tbackgroundColor : 'red',\n\t\tselectionStyle : Ti.UI.iPhone.TableViewCellSelectionStyle.NONE,\n\t\tlayout : 'vertical',\n\t});\n\tvar view = Ti.UI.createView({\n\t\twidth : Ti.UI.FILL,\n\t\theight : 60, //Ti.UI.SIZE,\n\t\tlayout : 'vertical',\n\t\ttouchEnabled : false,\n\t\tbackgroundColor : 'green'\n\t});\n\tvar firstLabel = Ti.UI.createLabel({\n\t\twidth : Ti.UI.FILL,\n\t\theight : 30,\n\t\tcolor : '#FFF',\n\t\ttext : 'Dummy Text'\n\t});\n\tvar secondLabel = Ti.UI.createLabel({\n\t\twidth : Ti.UI.FILL,\n\t\theight : 30,\n\t\tcolor : '#FFF',\n\t\ttext : '>>>>>>'\n\t});\n\tview.add(firstLabel);\n\tview.add(secondLabel);\n\trow.add(view);\n\trows.push(row);\n}\n\ntableView.setData(rows);\nwin1.add(tableView);\nwin1.open();\n{code}", "updateAuthor": { "name": "egomez", "key": "egomez", "displayName": "Eduardo Gomez", "active": false, "timeZone": "America/Los_Angeles" }, "created": "2014-03-31T23:06:04.000+0000", "updated": "2014-03-31T23:06:04.000+0000" }, { "id": "300079", "author": { "name": "vduggal", "key": "vduggal", "displayName": "Vishal Duggal", "active": false, "timeZone": "America/Los_Angeles" }, "body": "There are two issues I can see.\n\nFirst that the red background is showing through. This issue has been reported multiple times and the workaround also has been posted. iOS will clear out the background of all subviews of TableViewCell when the cell is highlighted. This is native behavior. The simple workaround is to use a backgroundImage on the view instead of a background color. \n\nSecond issue here is that you are trying to animate the height of the tableView row. You **can not** animate the height of a tableView row because when the height changes, the row has to reload. When a row reloads we have to layout the subviews and the warning you are seeing is because the layout cycle is triggered while the row is animating. \n\nWhat you should really be doing is updating the row. Posting sample code below which shows the expanding and collapsing table view rows. Going to mark this as Won't Fix\n\n{code}\nfunction genExpandedRow(i) {\n var row = Ti.UI.createTableViewRow({\n width : Ti.UI.FILL,\n height: 60, //Ti.UI.SIZE,\n collapsed : false,\n backgroundColor : 'green',\n selectionStyle : Ti.UI.iPhone.TableViewCellSelectionStyle.NONE,\n });\n var firstLabel = Ti.UI.createLabel({\n width : Ti.UI.FILL,\n top:0,\n height : 30,\n color : '#FFF',\n highlightedColor : '#FFF',\n text : 'Dummy Text '+i\n });\n var secondLabel = Ti.UI.createLabel({\n width : Ti.UI.FILL,\n top:30,\n height : 30,\n color : '#FFF',\n highlightedColor : '#FFF',\n text : '>>>>>> '+i\n });\n row.add(firstLabel);\n row.add(secondLabel);\n\n return row;\n}\n\n\nfunction genCollapsedRow(i) {\n var row = Ti.UI.createTableViewRow({\n width : Ti.UI.FILL,\n height: 30, //Ti.UI.SIZE,\n collapsed : true,\n backgroundColor : 'green',\n selectionStyle : Ti.UI.iPhone.TableViewCellSelectionStyle.NONE,\n });\n var firstLabel = Ti.UI.createLabel({\n width : Ti.UI.FILL,\n top:0,\n height : 30,\n color : '#FFF',\n highlightedColor : '#FFF',\n text : 'Dummy Text '+i\n });\n \n row.add(firstLabel);\n\n return row;\n}\n\nTitanium.UI.setBackgroundColor('#000');\nvar rows = [];\nvar win1 = Titanium.UI.createWindow({\n width : Ti.UI.FILL,\n height : Ti.UI.FILL,\n backgroundColor : '#101010'\n});\n \nvar tableView = Ti.UI.createTableView({\n width : Ti.UI.FILL,\n height : Ti.UI.FILL,\n backgroundColor : 'black'\n});\n \ntableView.addEventListener('click', function(e) {\n \n var row = e.row;\n if (!row) {\n return false;\n }\n var newRow;\n if(row.collapsed == false) {\n newRow = genCollapsedRow(e.index);\n } else {\n newRow = genExpandedRow(e.index);\n }\n\n tableView.updateRow(e.index,newRow,{animated:false});\n\n});\n \nfor (var i = 0; i <= 7; i++) {\n var row = genExpandedRow(i);\n rows.push(row);\n}\n \ntableView.setData(rows);\nwin1.add(tableView);\nwin1.open();\n{code}", "updateAuthor": { "name": "vduggal", "key": "vduggal", "displayName": "Vishal Duggal", "active": false, "timeZone": "America/Los_Angeles" }, "created": "2014-04-07T18:42:58.000+0000", "updated": "2014-04-07T18:42:58.000+0000" }, { "id": "415187", "author": { "name": "lmorris", "key": "lmorris", "displayName": "Lee Morris", "active": false, "timeZone": "America/Los_Angeles" }, "body": "Closing ticket as \"Won't Fix\".", "updateAuthor": { "name": "lmorris", "key": "lmorris", "displayName": "Lee Morris", "active": false, "timeZone": "America/Los_Angeles" }, "created": "2017-03-22T22:59:28.000+0000", "updated": "2017-03-22T22:59:28.000+0000" } ], "maxResults": 6, "total": 6, "startAt": 0 } } }