[AC-2417] iOS: Pull to Refresh doesn't work in new SDK
| GitHub Issue | n/a |
|---|---|
| Type | Bug |
| Priority | n/a |
| Status | Closed |
| Resolution | Fixed |
| Resolution Date | 2012-10-12T22:09:00.000+0000 |
| Affected Version/s | n/a |
| Fix Version/s | n/a |
| Components | n/a |
| Labels | ios, pull, refresh |
| Reporter | Josh Lewis |
| Assignee | Shak Hossain |
| Created | 2012-09-04T07:34:34.000+0000 |
| Updated | 2016-03-08T07:41:27.000+0000 |
Description
This code
http://developer.appcelerator.com/blog/2010/05/how-to-create-a-tweetie-like-pull-to-refresh-table.html
Only seems to work on the 2.1b SDK I have installed, using the new ones doesnt work correctly. The view slides up, then back down to refresh, then back up to hide.
Check Kitchen Sink for the updated code.
Latest code: https://github.com/appcelerator/KitchenSink/blob/master/Resources/ui/handheld/ios/baseui/table_view_pull_to_refresh.js Commit history: https://github.com/appcelerator/KitchenSink/commits/master/Resources/ui/handheld/ios/baseui/table_view_pull_to_refresh.js
Hello, I tested this issue with the test code below (modified kitchen sink project). I can't reproduce this issue in latest Ti builds.
Test Environment
Mac OS X 10.8.6 Ti SDK 3.2.0.GA Ti CLI 3.2.0 IOS simulator 7.0.3Test Code
Thnaksvar win = Ti.UI.createWindow({ backgroundColor : "#fff", }); function formatDate() { var date = new Date(); var datestr = date.getMonth() + '/' + date.getDate() + '/' + date.getFullYear(); if (date.getHours() >= 12) { datestr += ' ' + (date.getHours() == 12 ? date.getHours() : date.getHours() - 12) + ':' + date.getMinutes() + ' PM'; } else { datestr += ' ' + date.getHours() + ':' + date.getMinutes() + ' AM'; } return datestr; } var data = [{ title : "Row 1" }, { title : "Row 2" }, { title : "Row 3" }]; var lastRow = 4; var tableView = Ti.UI.createTableView({ data : data }); win.add(tableView); var border = Ti.UI.createView({ backgroundColor : "#576c89", height : 2, bottom : 0 }); var tableHeader = Ti.UI.createView({ backgroundColor : "#e2e7ed", width : 320, height : 60 }); // fake it til ya make it.. create a 2 pixel // bottom border tableHeader.add(border); var arrow = Ti.UI.createView({ backgroundImage : "/images/whiteArrow.png", width : 23, height : 60, bottom : 10, left : 20 }); var statusLabel = Ti.UI.createLabel({ text : "Pull to reload", left : 55, width : 200, bottom : 30, height : "auto", color : "#576c89", textAlign : "center", font : { fontSize : 13, fontWeight : "bold" }, shadowColor : "#999", shadowOffset : { x : 0, y : 1 } }); var lastUpdatedLabel = Ti.UI.createLabel({ text : "Last Updated: " + formatDate(), left : 55, width : 200, bottom : 15, height : "auto", color : "#576c89", textAlign : "center", font : { fontSize : 12 }, shadowColor : "#999", shadowOffset : { x : 0, y : 1 } }); var actInd = Titanium.UI.createActivityIndicator({ left : 20, bottom : 13, width : 30, height : 30 }); tableHeader.add(arrow); tableHeader.add(statusLabel); tableHeader.add(lastUpdatedLabel); tableHeader.add(actInd); tableView.headerPullView = tableHeader; var pulling = false; var reloading = false; function beginReloading() { // just mock out the reload setTimeout(endReloading, 2000); } function endReloading() { // simulate loading for (var c = lastRow; c < lastRow + 10; c++) { tableView.appendRow({ title : "Row " + c }); } lastRow += 10; // when you're done, just reset tableView.setContentInsets({ top : 0 }, { animated : true }); reloading = false; lastUpdatedLabel.text = "Last Updated: " + formatDate(); statusLabel.text = "Pull down to refresh..."; actInd.hide(); arrow.show(); } tableView.addEventListener('scroll', function(e) { var offset = e.contentOffset.y; if (offset <= -65.0 && !pulling && !reloading) { var t = Ti.UI.create2DMatrix(); t = t.rotate(-180); pulling = true; arrow.animate({ transform : t, duration : 180 }); statusLabel.text = "Release to refresh..."; } else if (pulling && (offset > -65.0 && offset < 0) && !reloading) { pulling = false; var t = Ti.UI.create2DMatrix(); arrow.animate({ transform : t, duration : 180 }); statusLabel.text = "Pull down to refresh..."; } }); var event1 = 'dragEnd'; if (Ti.version >= '3.0.0') { event1 = 'dragend'; } tableView.addEventListener(event1, function(e) { if (pulling && !reloading) { reloading = true; pulling = false; arrow.hide(); actInd.show(); statusLabel.text = "Reloading..."; tableView.setContentInsets({ top : 60 }, { animated : true }); arrow.transform = Ti.UI.create2DMatrix(); beginReloading(); } }); win.open();