{ "id": "127443", "key": "TIMOB-18178", "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": "5", "description": "All attempts at reproducing this issue failed, or not enough information was available to reproduce the issue. Reading the code produces no clues as to why this behavior would occur. If more information appears later, please reopen the issue.", "name": "Cannot Reproduce" }, "resolutiondate": "2017-04-10T18:25:44.000+0000", "created": "2014-03-07T22:24:57.000+0000", "priority": { "name": "None", "id": "6" }, "labels": [ "TCSupport" ], "versions": [ { "id": "15972", "description": "Release 3.4.0", "name": "Release 3.4.0", "archived": false, "released": true, "releaseDate": "2014-09-28" }, { "id": "16676", "description": "Release 3.4.1", "name": "Release 3.4.1", "archived": false, "released": true, "releaseDate": "2014-11-14" } ], "issuelinks": [], "assignee": null, "updated": "2018-02-28T19:54:47.000+0000", "status": { "description": "A resolution has been taken, and it is awaiting verification by reporter. From here issues are either reopened, or are closed.", "name": "Resolved", "id": "5", "statusCategory": { "id": 3, "key": "done", "colorName": "green", "name": "Done" } }, "components": [ { "id": "10206", "name": "iOS", "description": "iOS Platform" } ], "description": "h4. Problem Description\r\nWhen you call the deleteItemsAt function on a ListViewSection with animation enabled, you get some clipping on the lower element that is moving upwards.\r\n\r\n\r\nh4. Steps to reproduce\r\n\r\n- Create a new Classic Project.\r\n- Change app.js into this code:\r\n{code}\r\n\r\nvar win = Ti.UI.createWindow({backgroundColor: 'white'});\r\n\r\nvar sections = [];\r\n\r\nvar template = {\r\n childTemplates: [\r\n {\r\n \t\ttype: 'Ti.UI.View',\r\n \t\tclass: 'itemContainer' ,\r\n \t\tproperties: {\r\n \t\tbackgroundColor: \"#EEE\"\r\n \t\t\r\n \t\t},\r\n \t\t\r\n \t\tchildTemplates: [\r\n \t{\r\n \t\t \ttype: 'Ti.UI.View',\r\n \t\t\t\t\tid: 'iconWrapper' ,\r\n \t\t\t\t\tproperties: {\r\n \t\t\t\t\ttop:10,\r\n\t\t\t\t\t\tleft:15,\r\n\t\t\t\t\t\theight: 60,\r\n\t\t\t\t\t\twidth: 60,\r\n\t\t\t\t\t\tbackgroundColor: \"#fff\",\r\n\t\t\t\t\t\ttouchEnabled:false\r\n \t\t\r\n \t\t\t\t\t},\r\n \t\t\r\n \t\t \t\t\tchildTemplates: [\r\n \t\t \t\t\t\t\t{ \r\n \t\t\t\t\t\ttype: 'Ti.UI.ImageView', \r\n \t\t\t\t\t\tbindId: 'pic',\r\n \t\t\t\t\t\tid: 'icon' , \r\n \t\t\t\t\t\tproperties: { \r\n \t\t\t\t\twidth: 30, \r\n \t\t\t\t\t\t\t\theight: 30\r\n \t\t\t\t\t\t}\r\n \t\t\t\t\t\t},\r\n \r\n \t\t\t\t],\r\n \t\t\r\n \t\t\t\t},\r\n \t\r\n \t\t\t\t{\r\n \t\t\t\t\ttype: 'Ti.UI.View',\r\n \t\t\t\t\tid: 'detailWrapper' ,\r\n \t\t\t\t\tproperties: {\r\n \t\t\t\t\ttop:10,\r\n\t\t\t\t\t\tleft:85,\r\n\t\t\t\t\t\theight: Ti.UI.FILL,\r\n\t\t\t\t\t\tright: 15,\r\n\t\t\t\t\t\tbackgroundColor: \"#fff\"\r\n \t\t\r\n \t\t\t\t\t},\r\n \t\t\r\n \t\t \t\t\tchildTemplates: [\r\n \t\t \t\t\t\t\t{\r\n \t\t \t\t\t\ttype: 'Ti.UI.View',\r\n \t\t\t\t\t\t\t\tid: 'hiddenView' ,\r\n \t\t\t\t\t\t\t\tproperties: {\r\n \t\t\t\t\t\t\t\tbackgroundColor: \"#0196D7\",\r\n\t\t\t\t\t\t\t\t\ttouchEnabled:false\r\n \t\t\r\n \t\t\t\t\t\t\t},\r\n \t\t\r\n \t\t \t\t\t\t\tchildTemplates: [\r\n \t\t \t\t\t\t\t\t\t{ \r\n \t\t\t\t\t\t\t\ttype: 'Ti.UI.Label', \r\n \t\t\t\t\t\t\t\tbindId: 'hiddenLbl',\r\n \t\t\t\t\t\t\t\tid: 'hiddenLbl', \r\n \t\t\t\t\t\t\t\tproperties: { \r\n \t\t\t\t\t\t\twidth:200,\r\n\t\t\t\t\t\t\t\t\t\t\theight: Ti.UI.FILL,\r\n\t\t\t\t\t\t\t\t\t\t\tcolor: \"#fff\",\r\n\t\t\t\t\t\t\t\t\t\t\ttextAlign:\"left\",\r\n\t\t\t\t\t\t\t\t\t\t\tfont: {fontFamily: \"Arial\", fontSize: 14},\r\n \t\t\t\t\t\t\t\t}\r\n \t\t\t\t\t\t\t\t},\r\n \r\n \t\t\t\t\t\t],\r\n \t\t\r\n \t\t\t\t\t\t\t},\r\n \t\t\t\t\t\t\t\r\n \t\t\t\t\t\t\t{\r\n \t\t \t\t\t\ttype: 'Ti.UI.View',\r\n \t\t\t\t\t\t\t\tid: 'detailView' ,\r\n \t\t\t\t\t\t\t\tproperties: {\r\n \t\t\t\t\t\t\t\tbackgroundColor: \"#fff\",\r\n\t\t\t\t\t\t\t\t\tleft:0,\r\n\t\t\t\t\t\t\t\t\twidth: 220\r\n \t\t\r\n \t\t\t\t\t\t\t},\r\n \t\t\t\t\t\t\tevents: {\r\n\r\n \t\t\t\t\t\t\t},\r\n \t\t\r\n \t\t \t\t\t\t\tchildTemplates: [\r\n \t\t \t\t\t\t\t\t\t{ \r\n \t\t\t\t\t\t\t\ttype: 'Ti.UI.Label', \r\n \t\t\t\t\t\t\t\tbindId: 'title',\r\n \t\t\t\t\t\t\t\tid: 'title', \r\n \t\t\t\t\t\t\t\tproperties: { \r\n \t\t\t\t\t\t\tcolor: 'black',\r\n \t\t\t\t\t\t\t\t\t\tfont: { fontFamily:'Arial', fontSize: 14, fontWeight:'bold' },\r\n \t\t\t\t\t\t\t\t\t\tleft: 10, \r\n \t\t\t\t\t\t\t\t\t\ttop: 10,\r\n \t\t\t\t\t\t\t\t\t\twidth: 200\r\n \t\t\t\t\t\t\t\t\t\t}\r\n \t\t\t\t\t\t\t\t},\r\n \t\t\t\t\t\t\t\t{ \r\n \t\t\t\t\t\t\t\ttype: 'Ti.UI.Label', \r\n \t\t\t\t\t\t\t\tbindId: 'subtitle',\r\n \t\t\t\t\t\t\t\tid: 'subtitle', \r\n \t\t\t\t\t\t\t\tproperties: { \r\n \t\t\t\t\t\t\tcolor: 'black',\r\n \t\t\t\t\t\t\t\t\t\tfont: { fontFamily:'Arial', fontSize: 10 },\r\n \t\t\t\t\t\t\t\t\t\tleft: 10, \r\n \t\t\t\t\t\t\t\t\t\ttop: 30,\r\n \t \t\t\t\t\t\t\t\t\t\twidth: 200\r\n \t\t\t\t\t\t\t\t}\r\n \t\t\t\t\t\t\t\t},\r\n \t\t\t\t\t\t\t\t{ \r\n \t\t\t\t\t\t\t\ttype: 'Ti.UI.Label', \r\n \t\t\t\t\t\t\t\tbindId: 'meta',\r\n \t\t\t\t\t\t\t\tid: 'meta', \r\n \t\t\t\t\t\t\t\tproperties: { \r\n \t\t\t\t\t\t\tcolor: 'gray',\r\n \t\t\t\t\t\t\t\t\t\tfont: { fontFamily:'Arial', fontSize: 10 },\r\n \t\t\t\t\t\t\t\t\t\tleft: 10, \r\n \t\t\t\t\t\t\t\t\t\ttop: 45,\r\n \t\t\t\t\t\t\t\t\t\twidth: 200\r\n \t\t\t\t\t\t\t\t}\r\n \t\t\t\t\t\t\t\t},\r\n \t\t\t\t\t\t\t\t{\r\n \t\t \t\t\t\t\t\ttype: 'Ti.UI.View',\r\n \t\t\t\t\t\t\t\t\t\tid: 'buttonWrapper' ,\r\n \t\t\t\t\t\t\t\t\t\tproperties: {\r\n \t\t\t\t\t\t\t\t\t\twidth: 40,\r\n\t\t\t\t\t\t\t\t\t\t\theight: Ti.UI.FILL,\r\n\t\t\t\t\t\t\t\t\t\t\tright:0,\r\n\t\t\t\t\t\t\t\t\t\t\tbackgroundColor:\"#fbfbfb\"\r\n \t\t\r\n \t\t\t\t\t\t\t\t\t\t},\r\n \t\t\t\t\t\t\t\t\t\tevents: {\r\n \r\n \t\t\t\t\t\t\t\t\t\tclick: function (_evt){\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tif(_evt.source.parent){\t\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tvar hiddenLbl = _evt.source.parent.parent.children[0].children[0]; \r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tTi.API.info('click hiddenLbl '+(hiddenLbl));\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\thiddenLbl.applyProperties({\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttext: \"You have added it!\",\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ttextAlign: \"center\"\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t});\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t_evt.source.parent.animate({ \r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tleft: 200,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tduration: 250 \r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}, function(){\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t_evt.source.parent.parent.parent.animate({\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\topacity: 0.0,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tduration: 500\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t},function(){\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tvar section = listView.sections[_evt.sectionIndex];\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tsection.deleteItemsAt(_evt.itemIndex, 1, false);\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t});\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t});\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t} \r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\r\n \t\t\t\t\t\t\t\t\t\t},\r\n \t\t\r\n \t\t \t\t\t\t\t\t\t\tchildTemplates: [\r\n \t\t \t\t\t\t\t\t\t\t\t\t{\t\t \r\n \t\t\t\t\t\t\t\t\t\t\ttype: 'Ti.UI.Label', \r\n \t\t\t\t\t\t\t\t\t\t\tbindId: 'rightButton',\r\n \t\t\t\t\t\t\t\t\t\t\tid: 'rightButton', \r\n \t\t\t\t\t\t\t\t\t\t\tproperties: { \r\n \t\t\t\t\t\t\t\t\t\tcolor: \"#999\",\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tborderColor:\"#999\",\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tborderWidth: 3,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tborderRadius:15,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\twidth:30,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\theight: 30,\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tfont: {fontFamily: \"Arial\", fontSize: 25},\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\ttextAlign:\"center\",\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\ttouchEnabled: false\r\n \t\t\t\t\t\t\t\t\t\t\t}\r\n \t\t\t\t\t\t\t\t\t\t\t},\r\n \r\n \t\t\t\t\t\t\t\t\t],\r\n \t\t\r\n \t\t\t\t\t\t\t\t\t},\r\n \t\t\t\t\t\t\t\t\r\n \t\t\t\t\t\t\t\t\r\n \t\t\t\t\t\t\t\t\r\n \r\n \t\t\t\t\t\t],\r\n \t\t\r\n \t\t\t\t\t\t\t},\r\n \t\t \t\t\t\t\t\r\n \r\n \t\t\t\t],\r\n \t\t\r\n \t\t\t\t},\r\n ],\r\n \t\t\r\n \t},\r\n ]\r\n};\r\n\r\nvar listView = Ti.UI.createListView({\r\n templates: { 'template': template }, \r\n defaultItemTemplate: 'template',\r\n \r\n});\r\n\r\n\r\nvar listSection = Ti.UI.createListSection();\r\n\t\r\nvar ListItem = [\r\n {title:{text:'Appcelerator'}, subtitle:{text:'Mobile Software'}, meta:{text:'25077 followers'}, hiddenLbl:{text:'Slide >'}, pic:{image:'/images/corejs.png'}, rightButton:{text:'+' },properties: { \ttop:5,\r\n\theight: 70,\r\n\tbackgroundColor: \"#EEE\"}},\r\n {title:{text:'Appcelerator'}, subtitle:{text:'Mobile Software'}, meta:{text:'25077 followers'}, hiddenLbl:{text:'Slide >'}, pic:{image:'/images/corejs.png'}, rightButton:{text:'+' },properties: { \ttop:5,\r\n\theight: 70,\r\n\tbackgroundColor: \"#EEE\"}},\r\n {title:{text:'Appcelerator'}, subtitle:{text:'Mobile Software'}, meta:{text:'25077 followers'}, hiddenLbl:{text:'Slide >'}, pic:{image:'/images/corejs.png'}, rightButton:{text:'+' },properties: { \ttop:5,\r\n\theight: 70,\r\n\tbackgroundColor: \"#EEE\"}},\r\n {title:{text:'Appcelerator'}, subtitle:{text:'Mobile Software'}, meta:{text:'25077 followers'}, hiddenLbl:{text:'Slide >'}, pic:{image:'/images/corejs.png'}, rightButton:{text:'+' },properties: { \ttop:5,\r\n\theight: 70,\r\n\tbackgroundColor: \"#EEE\"}},\r\n {title:{text:'Appcelerator'}, subtitle:{text:'Mobile Software'}, meta:{text:'25077 followers'}, hiddenLbl:{text:'Slide >'}, pic:{image:'/images/corejs.png'}, rightButton:{text:'+' },properties: { \ttop:5,\r\n\theight: 70,\r\n\tbackgroundColor: \"#EEE\"}},\r\n {title:{text:'Appcelerator'}, subtitle:{text:'Mobile Software'}, meta:{text:'25077 followers'}, hiddenLbl:{text:'Slide >'}, pic:{image:'/images/corejs.png'}, rightButton:{text:'+' },properties: { \ttop:5,\r\n\theight: 70,\r\n\tbackgroundColor: \"#EEE\"}},\r\n {title:{text:'Appcelerator'}, subtitle:{text:'Mobile Software'}, meta:{text:'25077 followers'}, hiddenLbl:{text:'Slide >'}, pic:{image:'/images/corejs.png'}, rightButton:{text:'+' },properties: { \ttop:5,\r\n\theight: 70,\r\n\tbackgroundColor: \"#EEE\"}},\r\n \r\n];\r\nlistSection.setItems(ListItem);\r\nsections.push(listSection);\r\nlistView.setSections(sections);\r\nwin.add(listView);\r\nwin.open();\r\n\r\n{code}\r\n- Create a folder named \"images\" in the Resource directory\r\n- Put the \"corejs.png\" image to the folder\r\n- Run the app in iOS Device\r\n\r\n\r\nh4. Actual Results\r\nClick on the \"+\" sing of any row ( on the right side ) to delete that row. Doing so the row below that, will move upward.\r\nThe lower row should come straight to the top, not suppose to flick and then appear.\r\n\r\n\r\nh4. Extra info\r\nSee Screencast and code sample\r\n\r\nSee the screencast here:\r\nhttp://www.screencast.com/t/aKPw3okcqgRP", "attachment": [ { "id": "51026", "filename": "corejs.png", "author": { "name": "ahossain", "key": "ahossain", "displayName": "Amimul Hossain", "active": false, "timeZone": "Asia/Dhaka" }, "created": "2014-09-06T05:02:03.000+0000", "size": 4920, "mimeType": "image/png" }, { "id": "46487", "filename": "FloatingWindows.zip", "author": { "name": "bgrantges@appcelerator.com", "key": "bgrantges", "displayName": "Bert Grantges", "active": false, "timeZone": "America/Chicago" }, "created": "2014-03-07T22:24:57.000+0000", "size": 3635413, "mimeType": "application/zip" } ], "flagged": false, "summary": "iOS - ListViewSection.deleteItemsAt with animation causes clipping on elements that move up", "creator": { "name": "bgrantges@appcelerator.com", "key": "bgrantges", "displayName": "Bert Grantges", "active": false, "timeZone": "America/Chicago" }, "subtasks": [], "reporter": { "name": "bgrantges@appcelerator.com", "key": "bgrantges", "displayName": "Bert Grantges", "active": false, "timeZone": "America/Chicago" }, "environment": "iOS 7.0.3", "comment": { "comments": [ { "id": "417132", "author": { "name": "hknoechel", "key": "hansknoechel", "displayName": "Hans Knöchel", "active": true, "timeZone": "Europe/Berlin" }, "body": "I am unable to reproduce this issue with the latest SDK 6.0.3.GA. There has been a lot of progress since then, so probably this side-effect has been fixed without knowing.", "updateAuthor": { "name": "hknoechel", "key": "hansknoechel", "displayName": "Hans Knöchel", "active": true, "timeZone": "Europe/Berlin" }, "created": "2017-04-10T18:25:44.000+0000", "updated": "2017-04-10T18:25:44.000+0000" } ], "maxResults": 11, "total": 11, "startAt": 0 } } }