{ "id": "172704", "key": "TIMOB-26630", "fields": { "issuetype": { "id": "7", "description": "gh.issue.story.desc", "name": "Story", "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": "2019-01-11T01:50:01.000+0000", "created": "2018-12-05T12:32:18.000+0000", "priority": { "name": "Low", "id": "4" }, "labels": [ "scrollView", "toImage" ], "versions": [ { "id": "20238", "description": "", "name": "Release 7.5.0", "archived": false, "released": true, "releaseDate": "2018-11-15" } ], "issuelinks": [], "assignee": { "name": "ybanev", "key": "ybanev", "displayName": "Yordan Banev", "active": true, "timeZone": "Europe/Athens" }, "updated": "2019-01-11T01:50:04.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": "Hello!\r\nI have a scrollview added on window, while taking the screenshot of scrollview, it takes toImage() of the area that is visible on the window, but not of full scrollview, how I can overcome this issue ?\r\n{code}\r\nvar win = Ti.UI.createWindow({\r\n\tbackgroundColor : \"white\",\r\n});\r\n\r\nvar scrollview = Ti.UI.createScrollView({\r\n\twidth : \"100%\",\r\n\theight : \"100%\",\r\n\t// contentHeight:\"auto\",\r\n\tlayout : \"vertical\"\r\n});\r\nwin.add(scrollview);\r\nscrollview.addEventListener(\"click\", function(e) {\r\n\r\n\tvar win2 = Ti.UI.createWindow({\r\n\t\tbackgroundColor : \"white\",\r\n\t});\r\n\tvar scrollVw = Ti.UI.createScrollView({\r\n\t\twidth : \"100%\",\r\n\t\theight : \"100%\",\r\n\t\t// contentHeight:\"auto\",\r\n\t\tlayout : \"vertical\"\r\n\t}), varImageVw = Ti.UI.createImageView({\r\n\t\twidth : \"100%\",\r\n\t\theight : Ti.UI.SIZE,\r\n\t\timage : scrollview.toImage(),\r\n\r\n\t});\r\n\tscrollVw.add(varImageVw);\r\n\twin2.add(scrollVw);\r\n\twin2.open();\r\n});\r\nvar view1 = Ti.UI.createView({\r\n\ttop : 0,\r\n\twidth : \"100%\",\r\n\theight : \"400\",\r\n\tbackgroundColor : \"red\"\r\n});\r\nscrollview.add(view1);\r\n\r\nvar view2 = Ti.UI.createView({\r\n\ttop : 0,\r\n\twidth : \"100%\",\r\n\theight : \"400\",\r\n\tbackgroundColor : \"green\"\r\n});\r\nscrollview.add(view2);\r\n\r\nvar view3 = Ti.UI.createView({\r\n\ttop : 0,\r\n\twidth : \"100%\",\r\n\theight : \"400\",\r\n\tbackgroundColor : \"blue\"\r\n});\r\nscrollview.add(view3);\r\n\r\nvar view4 = Ti.UI.createView({\r\n\ttop : 0,\r\n\twidth : \"100%\",\r\n\theight : \"400\",\r\n\tbackgroundColor : \"yellow\"\r\n});\r\nscrollview.add(view4);\r\n\r\nvar view5 = Ti.UI.createView({\r\n\ttop : 0,\r\n\twidth : \"100%\",\r\n\theight : \"400\",\r\n\tbackgroundColor : \"pink\"\r\n});\r\nscrollview.add(view5);\r\n\r\nwin.open();\r\n{code}\r\nwhile clicking on first window scrollview, image is displayed in next window scrollview, you will notice its not taking toImage() of complete scrollview, as its not displaying in 2 window.\r\n\r\nTest Environment:\r\n{code}\r\nOperating System\r\n Name = Microsoft Windows 10 Pro\r\n Version = 10.0.17134\r\n Architecture = 32bit\r\n # CPUs = 4\r\n Memory = 17091956736\r\nNode.js\r\n Node.js Version = 8.9.1\r\n npm Version = 5.5.1\r\nTitanium CLI\r\n CLI Version = 5.1.1\r\nTitanium SDK\r\n SDK Version = 7.5.0.GA\r\n SDK Path = C:\\ProgramData\\Titanium\\mobilesdk\\win32\\7.5.0.GA\r\n Target Platform = android\r\n{code}\r\n\r\nThanks \r\n", "attachment": [], "flagged": false, "summary": "ScrollView: toImage() not taking complete screenshot of scrollview", "creator": { "name": "aislam", "key": "aislam", "displayName": "Aminul Islam", "active": false, "timeZone": "Etc/GMT-6" }, "subtasks": [], "reporter": { "name": "aislam", "key": "aislam", "displayName": "Aminul Islam", "active": false, "timeZone": "Etc/GMT-6" }, "environment": "Operating System\r\n Name = Microsoft Windows 10 Pro\r\n Version = 10.0.17134\r\n Architecture = 32bit\r\n # CPUs = 4\r\n Memory = 17091956736\r\nNode.js\r\n Node.js Version = 8.9.1\r\n npm Version = 5.5.1\r\nTitanium CLI\r\n CLI Version = 5.1.1\r\nTitanium SDK\r\n SDK Version = 7.5.0.GA\r\n SDK Path = C:\\ProgramData\\Titanium\\mobilesdk\\win32\\7.5.0.GA\r\n Target Platform = android", "closedSprints": [ { "id": 1106, "state": "closed", "name": "2019 Sprint 1", "startDate": "2018-12-31T19:39:58.070Z", "endDate": "2019-01-11T19:39:00.000Z", "completeDate": "2019-01-14T17:17:47.552Z", "originBoardId": 114 } ], "comment": { "comments": [ { "id": "444487", "author": { "name": "ybanev", "key": "ybanev", "displayName": "Yordan Banev", "active": true, "timeZone": "Europe/Athens" }, "body": "[~aislam] I don't think that currently there is a way to get all the content of the ScrollView to be converted to an image.", "updateAuthor": { "name": "ybanev", "key": "ybanev", "displayName": "Yordan Banev", "active": true, "timeZone": "Europe/Athens" }, "created": "2018-12-11T16:04:29.000+0000", "updated": "2018-12-11T16:04:48.000+0000" }, { "id": "444490", "author": { "name": "ybanev", "key": "ybanev", "displayName": "Yordan Banev", "active": true, "timeZone": "Europe/Athens" }, "body": "PR: https://github.com/appcelerator/titanium_mobile/pull/10529\r\n\r\nThis is a PR with one possible way to deal with the matter in the ticket. It is not a general solution for containers extending beyond the screen size, but for ScrollView only. I don't want to put a milestone(fix version) to it, because it may not get merged in this state at all.", "updateAuthor": { "name": "ybanev", "key": "ybanev", "displayName": "Yordan Banev", "active": true, "timeZone": "Europe/Athens" }, "created": "2018-12-11T16:20:38.000+0000", "updated": "2018-12-11T16:20:38.000+0000" }, { "id": "444501", "author": { "name": "jquick", "key": "jquick", "displayName": "Joshua Quick", "active": true, "timeZone": "America/Los_Angeles" }, "body": "We need to double check what the iOS behavior is for this.\r\n\r\nPersonally, I think ScrollView.toImage() should capture the container (including the border), not the contents. The issue with capturing the contents is that for a very long ScrollVIew, the image file may be too big to fit into memory.\r\n\r\nI haven't tested this yet. So, I'm not sure which we do yet.", "updateAuthor": { "name": "jquick", "key": "jquick", "displayName": "Joshua Quick", "active": true, "timeZone": "America/Los_Angeles" }, "created": "2018-12-11T19:20:37.000+0000", "updated": "2018-12-11T19:20:37.000+0000" }, { "id": "444544", "author": { "name": "ybanev", "key": "ybanev", "displayName": "Yordan Banev", "active": true, "timeZone": "Europe/Athens" }, "body": "[~jquick] A really good point. I did not think about content big enough to cause memory issues.\r\n\r\nCurrently we use whatever is assigned as a {{nativeView}} for calculating the dimensions of the image generated. In the case of TiUIScrollView it is a SwipeRefreshLayout, containing TiVerticalScrollView\\TiHorizontalScrollView depending on the type of the ScrollView.", "updateAuthor": { "name": "ybanev", "key": "ybanev", "displayName": "Yordan Banev", "active": true, "timeZone": "Europe/Athens" }, "created": "2018-12-12T11:30:22.000+0000", "updated": "2018-12-12T11:30:22.000+0000" }, { "id": "444561", "author": { "name": "jquick", "key": "jquick", "displayName": "Joshua Quick", "active": true, "timeZone": "America/Los_Angeles" }, "body": "I just tested this on iOS now.\r\nOn iOS, {{ScrollView.toImage()}} captures the {{ScrollView}} container, including its border if applied. It does not capture the offscreen inner contents.\r\n\r\nAndroid does the same, except it excludes the border.\r\n\r\nBut in any case, the behavior between Android and iOS is nearly the same (except for the border).\r\nThis is not a bug.\r\n\r\nSo, it isn't really clear to me what the customer wants. Does this person want to capture the inner contents including the parts that are offscreen? If so, then the solution would be to wrap all of the views within a parent view within the ScrollView and capture that. This way it'll work on both Android and iOS.", "updateAuthor": { "name": "jquick", "key": "jquick", "displayName": "Joshua Quick", "active": true, "timeZone": "America/Los_Angeles" }, "created": "2018-12-12T22:15:43.000+0000", "updated": "2018-12-12T22:15:43.000+0000" }, { "id": "445070", "author": { "name": "smohammed", "key": "smohammed", "displayName": "Samir Mohammed", "active": true, "timeZone": "America/Los_Angeles" }, "body": "Closing ticket. If this is a mistake feel free to reopen. ", "updateAuthor": { "name": "smohammed", "key": "smohammed", "displayName": "Samir Mohammed", "active": true, "timeZone": "America/Los_Angeles" }, "created": "2019-01-08T12:02:53.000+0000", "updated": "2019-01-08T12:02:53.000+0000" } ], "maxResults": 12, "total": 12, "startAt": 0 } } }