{ "id": "149679", "key": "TIMOB-19241", "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": "17608", "name": "Release 6.1.0", "archived": false, "released": true, "releaseDate": "2017-05-26" } ], "resolution": { "id": "1", "description": "A fix for this issue is checked into the tree and tested.", "name": "Fixed" }, "resolutiondate": "2017-01-12T09:16:10.000+0000", "created": "2015-07-14T15:48:40.000+0000", "priority": { "name": "Medium", "id": "3" }, "labels": [ "AL-5.4.0", "ios", "iphone" ], "versions": [], "issuelinks": [], "assignee": { "name": "vijaysingh", "key": "vijaysingh", "displayName": "Vijay Singh", "active": true, "timeZone": "America/Los_Angeles" }, "updated": "2017-01-20T19:03:45.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": "When a _TextField_ is in a _TableViewRow_, you can only enter one character and then the keyboard disappears.\r\n\r\n+Expected+: Tap into the grey hint text and enter multiple characters on the keyboard which does not disappear\r\n+Actual+: You can only enter one character and then the keyboard disappears.\r\n\r\nCode attached.", "attachment": [ { "id": "56158", "filename": "app.js", "author": { "name": "jannis", "key": "jannis", "displayName": "Jannis H", "active": true, "timeZone": "Europe/Berlin" }, "created": "2015-07-14T15:48:27.000+0000", "size": 306, "mimeType": "text/javascript" } ], "flagged": false, "summary": "iOS: Keyboard loses focus after 1 character when TextField is in a TableView TableViewRow", "creator": { "name": "jannis", "key": "jannis", "displayName": "Jannis H", "active": true, "timeZone": "Europe/Berlin" }, "subtasks": [], "reporter": { "name": "jannis", "key": "jannis", "displayName": "Jannis H", "active": true, "timeZone": "Europe/Berlin" }, "environment": "iOS (simulator & hardware)", "closedSprints": [ { "id": 565, "state": "closed", "name": "2016 Sprint 2 SDK", "startDate": "2016-01-16T01:30:40.264Z", "endDate": "2016-01-30T01:30:00.000Z", "completeDate": "2016-01-31T01:27:07.537Z", "originBoardId": 114 } ], "comment": { "comments": [ { "id": "358141", "author": { "name": "jannis", "key": "jannis", "displayName": "Jannis H", "active": true, "timeZone": "Europe/Berlin" }, "body": "FYI: If you give the TextField some size information upon creation, this doesn't seem to happen.", "updateAuthor": { "name": "jannis", "key": "jannis", "displayName": "Jannis H", "active": true, "timeZone": "Europe/Berlin" }, "created": "2015-07-22T09:06:39.000+0000", "updated": "2015-07-22T09:06:39.000+0000" }, { "id": "364779", "author": { "name": "roccog", "key": "roccog", "displayName": "Rocco Germinario", "active": true, "timeZone": "Europe/Rome" }, "body": "The problem is still present in SDK 4.1.1.GA\r\nSee also [https://community.appcelerator.com/topic/3279/textfield-inside-tableviewrow-loses-focus-after-typing-one-character-on-ios-device-not-in-simulator]", "updateAuthor": { "name": "roccog", "key": "roccog", "displayName": "Rocco Germinario", "active": true, "timeZone": "Europe/Rome" }, "created": "2015-09-23T10:02:45.000+0000", "updated": "2015-09-23T10:02:45.000+0000" }, { "id": "371582", "author": { "name": "fokkezb", "key": "fokke", "displayName": "Fokke Zandbergen", "active": true, "timeZone": "Europe/Amsterdam" }, "body": "The following test case demonstrates that if you use {{sections}} instead of {{data}} it *does* work. However, the [documentation|https://appcelerator.github.io/appc-docs/platform/latest/#!/api/Titanium.UI.TableView-property-sections] says that {{sections}} should not be used because of TIMOB-12616. Also this workaround is not a solution if you use Alloy since there it will always use {{data}}.\r\n\r\n{code:javascript}\r\nvar win = Titanium.UI.createWindow({\r\n\tbackgroundColor: '#fff'\r\n});\r\n\r\nvar row = Ti.UI.createTableViewRow();\r\n\r\nvar section = Ti.UI.createTableViewSection({\r\n\theaderTitle: 'Section'\r\n});\r\n\r\nvar text = Ti.UI.createTextField({\r\n\twidth: Ti.UI.FILL,\r\n\tbackgroundColor: 'red'\r\n});\r\n\r\nrow.add(text);\r\nsection.add(row);\r\n\r\nvar table = Ti.UI.createTableView({\r\n\ttop: 20,\r\n\t// data: [section],\t\tDOES NOT WORK\r\n\t// data: [row],\t\t\tDOES NOT WORK\r\n\tsections: [section]\t//\tDOES WORK\r\n});\r\n\r\nwin.add(table);\r\nwin.open();\r\n{code}", "updateAuthor": { "name": "fokkezb", "key": "fokke", "displayName": "Fokke Zandbergen", "active": true, "timeZone": "Europe/Amsterdam" }, "created": "2015-11-27T09:17:46.000+0000", "updated": "2015-11-27T09:17:46.000+0000" }, { "id": "371600", "author": { "name": "fokkezb", "key": "fokke", "displayName": "Fokke Zandbergen", "active": true, "timeZone": "Europe/Amsterdam" }, "body": "For Alloy you could use the {{module}} tag in {{}} with a module like:\r\n\r\n{code:javascript}\r\nexports.createTableView = createTableView;\r\n\r\nfunction createTableView(parameters) {\r\n\tparameters.sections = parameters.data;\r\n\tdelete parameters.data;\r\n\treturn Ti.UI.createTableView(parameters);\r\n}\r\n{code}", "updateAuthor": { "name": "fokkezb", "key": "fokke", "displayName": "Fokke Zandbergen", "active": true, "timeZone": "Europe/Amsterdam" }, "created": "2015-11-28T13:14:06.000+0000", "updated": "2015-11-28T13:14:06.000+0000" }, { "id": "373535", "author": { "name": "apetkov", "key": "apetkov", "displayName": "Angel Petkov", "active": true, "timeZone": "America/Los_Angeles" }, "body": "Hello , [~jannis] this issue is actually a layout related issue, if the textfield size is not specified it will be autosized , which coincidently is what's causing the issue. Upon adding character to the textField or textArea it will cause it to get resized which in turn causes the tableRow to be updated, which is what blurs the textField/textArea. After investigating the issue further with [~hansknoechel] we found that enabling autoLayout will fix the issue.In the 6.0.0 release autoLayout will be enabled by default. However for now you shall have to enable it manually through the tiapp.xml like so \r\n{code:xml}\r\n \r\n true\r\n \r\n{code}\r\n\r\nAlso Merry Christmas! ", "updateAuthor": { "name": "apetkov", "key": "apetkov", "displayName": "Angel Petkov", "active": true, "timeZone": "America/Los_Angeles" }, "created": "2015-12-26T17:57:53.000+0000", "updated": "2015-12-26T18:37:23.000+0000" }, { "id": "376522", "author": { "name": "korelogic", "key": "korelogic", "displayName": "Michael Hay", "active": true, "timeZone": "America/Los_Angeles" }, "body": "I don't think auto layout is a fix.\r\n\r\nI have an example where the keyboard is dismissed on every keypress. Each row contain a textArea with hight set to auto size. The textArea and the row should grow in height when the user types into the field. This was working before SDK 4.0.\r\n\r\n\r\n{code:java}\r\nvar self = Ti.UI.createWindow({\r\n titleControl: \"Test\",\r\n //extendEdges: [Titanium.UI.EXTEND_EDGE_ALL],\r\n layout: 'vertical',\r\n tabBarHidden: true,\r\n });\r\n​\r\n var table = Titanium.UI.createTableView({\r\n backgroundColor: 'red',\r\n separatorColor: 'transparent',\r\n allowsSelection: true\r\n });\r\n​\r\n self.add(table);\r\n​\r\n var sections = [];\r\n​\r\n for (iS = 0; iS < 3; iS++) {\r\n​\r\n var section = Ti.UI.createTableViewSection({\r\n title: \"Section \" + iS,\r\n height: 32,\r\n backgroundColor: \"green\"\r\n });\r\n​\r\n for (iR = 0; iR < 5; iR++) {\r\n​\r\n Ti.API.info(\"Create Row:\");\r\n​\r\n var row = Ti.UI.createTableViewRow({\r\n height: Ti.UI.SIZE,\r\n layout: 'vertical',\r\n selectionStyle: Ti.UI.iOS.TableViewCellSelectionStyle.NONE\r\n });\r\n​\r\n var textArea = Ti.UI.createTextArea({\r\n top: 1,\r\n left: 45,\r\n right: 50,\r\n height: Ti.UI.SIZE,\r\n color: '#555555',\r\n backgroundColor: \"blue\",\r\n borderWidth: 0,\r\n verticalAlign: Ti.UI.TEXT_VERTICAL_ALIGNMENT_TOP,\r\n suppressReturn:false,\r\n autocapitalization: Ti.UI.TEXT_AUTOCAPITALIZATION_SENTENCES,\r\n autocorrect: false,\r\n scrollable: false,\r\n returnKeyType: Titanium.UI.RETURNKEY_NEXT,\r\n borderStyle: Ti.UI.INPUT_BORDERSTYLE_NONE,\r\n });\r\n​\r\n row.add(textArea)\r\n​\r\n section.add(row);\r\n​\r\n }\r\n​\r\n sections.push(section);\r\n }\r\n​\r\n table.setData(sections)\r\n{code}\r\n", "updateAuthor": { "name": "korelogic", "key": "korelogic", "displayName": "Michael Hay", "active": true, "timeZone": "America/Los_Angeles" }, "created": "2016-02-10T16:18:40.000+0000", "updated": "2016-02-10T16:18:40.000+0000" }, { "id": "376528", "author": { "name": "apetkov", "key": "apetkov", "displayName": "Angel Petkov", "active": true, "timeZone": "America/Los_Angeles" }, "body": "[~korelogic] Hello, this is a layout problem , if you don't specify a size for the keyboard it will be resized the size of the content, which happened every time the textField is updated for better efficiency. This happened when you don't set the size of the keyboard or you set it to Ti.UI.SIZE or the deprecated method \"auto'. Every time the textField is resized it causes the tableView row to refresh which forces a blur. If you were to set {code:xml} true{code} like i described in my previous comment the issue doesn't persist. I apologize for the inconvenience", "updateAuthor": { "name": "apetkov", "key": "apetkov", "displayName": "Angel Petkov", "active": true, "timeZone": "America/Los_Angeles" }, "created": "2016-02-10T18:58:47.000+0000", "updated": "2016-02-10T19:03:36.000+0000" }, { "id": "376599", "author": { "name": "korelogic", "key": "korelogic", "displayName": "Michael Hay", "active": true, "timeZone": "America/Los_Angeles" }, "body": "I understand what is happening, the field recalculating size on input.\r\n\r\nFirstly, why does a relayout cause the field to lose focus? Makes no sense from a functionality point of view... So its a bug.\r\n\r\nSecondly, Have you tried my example. It is not fixed by using auto layout as you suggest.", "updateAuthor": { "name": "korelogic", "key": "korelogic", "displayName": "Michael Hay", "active": true, "timeZone": "America/Los_Angeles" }, "created": "2016-02-11T08:24:01.000+0000", "updated": "2016-02-11T08:24:01.000+0000" }, { "id": "376657", "author": { "name": "apetkov", "key": "apetkov", "displayName": "Angel Petkov", "active": true, "timeZone": "America/Los_Angeles" }, "body": "[~korelogic] I ran your code with some changes.You didn't open the window , there was also non UTF 8 white spaces in the app.js causing issues for the compiler and a wrong delegate namespace for selectionStyle. Ones auto layout is enabled it works as expected. Also please check you are running the most up to date SDK it can be found \r\n[Here|http://builds.appcelerator.com.s3.amazonaws.com/index.html#5_2_X]\r\n{code:javascript}\r\nvar self = Ti.UI.createWindow({\r\n titleControl: \"Test\",\r\n layout: 'vertical',\r\n tabBarHidden: true,\r\n});\r\n\r\nvar table = Titanium.UI.createTableView({\r\n backgroundColor: 'red',\r\n separatorColor: 'transparent',\r\n allowsSelection: true,\r\n});\r\n\r\nself.add(table);\r\nvar sections = [];\r\n// for (iS = 0; iS < 3; iS++) {\r\n\r\nvar section = Ti.UI.createTableViewSection({\r\n title: \"Section \",\r\n height: 32,\r\n backgroundColor: \"green\"\r\n});\r\nfor (var iR = 0; iR < 5; iR++) {\r\n Ti.API.info(\"Create Row:\");\r\n var row = Ti.UI.createTableViewRow({\r\n height: Ti.UI.SIZE,\r\n layout: 'vertical',\r\n //selectionStyle: Ti.UI.iOS.TableViewCellSelectionStyle.NONE\r\n });\r\n var textArea = Ti.UI.createTextArea({\r\n top: 1,\r\n left: 45,\r\n right: 50,\r\n height: Ti.UI.SIZE,\r\n color: '#555555',\r\n backgroundColor: \"blue\",\r\n borderWidth: 0,\r\n verticalAlign: Ti.UI.TEXT_VERTICAL_ALIGNMENT_TOP,\r\n suppressReturn: false,\r\n autocapitalization: Ti.UI.TEXT_AUTOCAPITALIZATION_SENTENCES,\r\n autocorrect: false,\r\n scrollable: false,\r\n returnKeyType: Titanium.UI.RETURNKEY_NEXT,\r\n borderStyle: Ti.UI.INPUT_BORDERSTYLE_NONE,\r\n });\r\n row.add(textArea)\r\n section.add(row);\r\n}\r\nsections.push(section);\r\ntable.setData(sections);\r\n\r\nself.open();\r\n{code}", "updateAuthor": { "name": "apetkov", "key": "apetkov", "displayName": "Angel Petkov", "active": true, "timeZone": "America/Los_Angeles" }, "created": "2016-02-11T19:38:27.000+0000", "updated": "2016-02-11T19:44:52.000+0000" }, { "id": "392768", "author": { "name": "htbryant", "key": "htbryant", "displayName": "Harry Bryant", "active": true, "timeZone": "Europe/London" }, "body": "*Reopening this ticket for a future release.* \r\n\r\nI can confirm the bug with the above test code, and that setting autolayout to {{true}} resolves the issue. After further discussion with [~hansknoechel], it was agreed that this issue should not occur regardless of whether autolayout is enabled or not.", "updateAuthor": { "name": "htbryant", "key": "htbryant", "displayName": "Harry Bryant", "active": true, "timeZone": "Europe/London" }, "created": "2016-08-09T21:39:46.000+0000", "updated": "2016-08-09T21:39:46.000+0000" }, { "id": "404440", "author": { "name": "vijaysingh", "key": "vijaysingh", "displayName": "Vijay Singh", "active": true, "timeZone": "America/Los_Angeles" }, "body": "PR: https://github.com/appcelerator/titanium_mobile/pull/8744", "updateAuthor": { "name": "vijaysingh", "key": "vijaysingh", "displayName": "Vijay Singh", "active": true, "timeZone": "America/Los_Angeles" }, "created": "2017-01-11T07:28:49.000+0000", "updated": "2017-01-11T07:28:49.000+0000" }, { "id": "404441", "author": { "name": "hknoechel", "key": "hansknoechel", "displayName": "Hans Knöchel", "active": true, "timeZone": "Europe/Berlin" }, "body": "Demo-Code (a bit simplified):\r\n{code:js}\r\nvar self = Ti.UI.createWindow();\r\n \r\nvar table = Titanium.UI.createTableView({\r\n backgroundColor: 'red',\r\n separatorColor: 'green',\r\n \r\n // --- Toggle this property to test with the NONE style as well\r\n // separatorStyle: Titanium.UI.TABLE_VIEW_SEPARATOR_STYLE_NONE,\r\n\r\n allowsSelection: true,\r\n});\r\n \r\nself.add(table);\r\nvar sections = [];\r\n \r\nvar section = Ti.UI.createTableViewSection({\r\n title: \"Section \",\r\n height: 32,\r\n backgroundColor: \"green\"\r\n});\r\n\r\nfor (var iR = 0; iR < 5; iR++) {\r\n var row = Ti.UI.createTableViewRow({\r\n height: Ti.UI.SIZE,\r\n layout: 'vertical', \r\n });\r\n var textArea = Ti.UI.createTextArea({\r\n top: 1,\r\n left: 45,\r\n right: 50,\r\n height: Ti.UI.SIZE,\r\n color: '#fff',\r\n backgroundColor: \"blue\",\r\n scrollable: false,\r\n });\r\n row.add(textArea)\r\n section.add(row);\r\n}\r\nsections.push(section);\r\ntable.setData(sections);\r\n \r\nself.open();\r\n{code}", "updateAuthor": { "name": "hknoechel", "key": "hansknoechel", "displayName": "Hans Knöchel", "active": true, "timeZone": "Europe/Berlin" }, "created": "2017-01-11T08:25:13.000+0000", "updated": "2017-01-11T08:29:15.000+0000" }, { "id": "404876", "author": { "name": "lmorris", "key": "lmorris", "displayName": "Lee Morris", "active": false, "timeZone": "America/Los_Angeles" }, "body": "I have tested the updated code and can confirm that it works fine.\r\nTested on;\r\niPhone 7\r\nMacOS 10.11.6 (15G31)\r\nStudio 4.8.1.201612050850\r\nTi SDK 6.1.0.v20170118152304\r\nAppc NPM 4.2.8\r\nAppc CLI 6.1.0\r\nTi CLI 5.0.11\r\nAlloy 1.9.5\r\nArrow 1.10.1\r\nXcode 8.2 (8C38)\r\nNode v4.6.0\r\nJava 1.7.0_80", "updateAuthor": { "name": "lmorris", "key": "lmorris", "displayName": "Lee Morris", "active": false, "timeZone": "America/Los_Angeles" }, "created": "2017-01-19T18:57:56.000+0000", "updated": "2017-01-19T18:57:56.000+0000" }, { "id": "404965", "author": { "name": "lmorris", "key": "lmorris", "displayName": "Lee Morris", "active": false, "timeZone": "America/Los_Angeles" }, "body": "I have tested the updated code and can confirm that it works fine. \r\nTested on; \r\niPhone 7 \r\nMacOS 10.11.6 (15G31) \r\nStudio 4.8.1.201612050850 \r\nTi SDK 6.1.0.v20170118152304 \r\nAppc NPM 4.2.8 \r\nAppc CLI 6.1.0 \r\nTi CLI 5.0.11 \r\nAlloy 1.9.5 \r\nArrow 1.10.1 \r\nXcode 8.2 (8C38) \r\nNode v4.6.0 \r\nJava 1.7.0_80", "updateAuthor": { "name": "lmorris", "key": "lmorris", "displayName": "Lee Morris", "active": false, "timeZone": "America/Los_Angeles" }, "created": "2017-01-20T19:03:45.000+0000", "updated": "2017-01-20T19:03:45.000+0000" } ], "maxResults": 18, "total": 18, "startAt": 0 } } }