{"id":15141896,"url":"https://github.com/nstudio/nativescript-pulltorefresh","last_synced_at":"2025-09-29T10:31:23.590Z","repository":{"id":57132266,"uuid":"51085658","full_name":"nstudio/nativescript-pulltorefresh","owner":"nstudio","description":":recycle: NativeScript plugin for PullToRefresh controls","archived":true,"fork":false,"pushed_at":"2021-06-24T15:21:51.000Z","size":18492,"stargazers_count":143,"open_issues_count":14,"forks_count":27,"subscribers_count":5,"default_branch":"master","last_synced_at":"2024-04-13T17:13:24.145Z","etag":null,"topics":["android","ios","nativescript","nativescript-plugin","nativescript-pulltorefresh","typescript"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/nstudio.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2016-02-04T15:41:39.000Z","updated_at":"2023-11-07T12:41:35.000Z","dependencies_parsed_at":"2022-08-29T05:00:30.617Z","dependency_job_id":null,"html_url":"https://github.com/nstudio/nativescript-pulltorefresh","commit_stats":null,"previous_names":["bradmartin/nativescript-pulltorefresh"],"tags_count":8,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nstudio%2Fnativescript-pulltorefresh","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nstudio%2Fnativescript-pulltorefresh/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nstudio%2Fnativescript-pulltorefresh/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nstudio%2Fnativescript-pulltorefresh/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/nstudio","download_url":"https://codeload.github.com/nstudio/nativescript-pulltorefresh/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":234611836,"owners_count":18860229,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["android","ios","nativescript","nativescript-plugin","nativescript-pulltorefresh","typescript"],"created_at":"2024-09-26T09:20:23.020Z","updated_at":"2025-09-29T10:31:16.291Z","avatar_url":"https://github.com/nstudio.png","language":"TypeScript","readme":"\u003ca align=\"center\" href=\"https://www.npmjs.com/package/nativescript-community/ui-pulltorefresh\"\u003e\n    \u003ch2 align=\"center\"\u003eNativeScript-PullToRefresh\u003c/h2\u003e\n\u003c/a\u003e\n\u003ch4 align=\"center\"\u003e\nNativeScript plugin to use Pull to Refresh on any view.\n\u003c/h4\u003e\n\n---\n\n## UPDATE\n\nThis plugin has been migrated to nativescript-community as of June 24, 2021.\nThe repo can be found here: https://github.com/nativescript-community/ui-pulltorefresh\n\n## Installation\n\n#### NativeScript 7+:\n\n```bash\nns plugin add @nstudio/nativescript-pulltorefresh\n```\n\n#### NativeScript prior to 7:\n\n```bash\ntns plugin add @nstudio/nativescript-pulltorefresh@2.0.0\n```\n\n#### [Android - _SwipeRefreshLayout_](http://developer.android.com/reference/android/support/v4/widget/SwipeRefreshLayout.html)\n\n#### [iOS - _UIRefreshControl_](https://developer.apple.com/library/ios/documentation/UIKit/Reference/UIRefreshControl_class/)\n\n### Sample Screen\n\n| Android                                        | iOS                                    |\n| ---------------------------------------------- | -------------------------------------- |\n| ![Android Sample](screens/android_refresh.gif) | ![iOS Sample](screens/ios_refresh.gif) |\n\n## Usage\n\n### NativeScript Core\n\n#### XML\n\n```xml\n\u003cpage xmlns=\"http://schemas.nativescript.org/tns.xsd\"\n      xmlns:PullRefresh=\"@nstudio/nativescript-pulltorefresh\"\n      loaded=\"pageLoaded\"\u003e\n    \u003cPullRefresh:PullToRefresh refresh=\"refreshList\" indicatorFillColor=\"#fff000\" indicatorColor=\"#3489db\"\u003e\n        \u003clist-view items=\"{{ users }}\"\u003e\n            \u003clist-view.itemTemplate\u003e\n                \u003clabel text=\"{{ name }}\" row=\"0\" col=\"1\"textWrap=\"true\" class=\"message\" /\u003e\n            \u003c/list-view.itemTemplate\u003e\n        \u003c/list-view\u003e\n    \u003c/PullRefresh:PullToRefresh\u003e\n\u003c/page\u003e\n```\n\n#### JS\n\n```javascript\nfunction refreshList(args) {\n  // Get reference to the PullToRefresh component;\n  var pullRefresh = args.object;\n\n  // Do work here... and when done call set refreshing property to false to stop the refreshing\n  loadItems().then(\n    (resp) =\u003e {\n      // ONLY USING A TIMEOUT TO SIMULATE/SHOW OFF THE REFRESHING\n      setTimeout(() =\u003e {\n        pullRefresh.refreshing = false;\n      }, 1000);\n    },\n    (err) =\u003e {\n      pullRefresh.refreshing = false;\n    }\n  );\n}\nexports.refreshList = refreshList;\n```\n\n### Angular NativeScript\n\n```typescript\nimport { registerElement } from \"nativescript-angular/element-registry\";\nregisterElement(\"PullToRefresh\", () =\u003e require(\"@nstudio/nativescript-pulltorefresh\").PullToRefresh);\n\nrefreshList(args) {\n         const pullRefresh = args.object;\n         setTimeout(function () {\n            pullRefresh.refreshing = false;\n         }, 1000);\n    }\n```\n\n#### HTML\n\n```html\n\u003cPullToRefresh\n  (refresh)=\"refreshList($event)\"\n  indicatorFillColor=\"#fff000\"\n  indicatorColor=\"#3489db\"\n\u003e\n  \u003cListView [items]=\"itemList\"\u003e\n    \u003ctemplate let-item=\"item\"\u003e\n      \u003clabel [text]=\"item.id\"\u003e\u003c/label\u003e\n    \u003c/template\u003e\n  \u003c/ListView\u003e\n\u003c/PullToRefresh\u003e\n```\n\n### NativeScript Vue\n\n```javascript\nimport Vue from 'nativescript-vue';\n\nVue.registerElement(\n  'PullToRefresh',\n  () =\u003e require('@nstudio/nativescript-pulltorefresh').PullToRefresh\n);\n```\n\n#### Component\n\n```vue\n\u003ctemplate\u003e\n  \u003cPage\u003e\n    \u003cPullToRefresh\n      @refresh=\"refreshList\"\n      indicatorFillColor=\"#fff000\"\n      indicatorColor=\"#3489db\"\n    \u003e\n      \u003cListView for=\"item in listOfItems\" @itemTap=\"onItemTap\"\u003e\n        \u003cv-template\u003e\n          \u003c!-- Shows the list item label in the default color and style. --\u003e\n          \u003clabel :text=\"item.text\" /\u003e\n        \u003c/v-template\u003e\n      \u003c/ListView\u003e\n    \u003c/PullToRefresh\u003e\n  \u003c/Page\u003e\n\u003c/template\u003e\n\n\u003cscript\u003e\nexport default {\n  methods: {\n    refreshList(args) {\n      var pullRefresh = args.object;\n      setTimeout(function () {\n        pullRefresh.refreshing = false;\n      }, 1000);\n    },\n  },\n};\n\u003c/script\u003e\n```\n\n## Properties\n\n- **refresh : function** _required_\n- **refreshing: boolean** - Notifies the widget that the refresh state has\n  changed.\n- **indicatorFillColor: Color** - the color of the indicator background fill.\n- **indicatorColor: Color** - the color of the indicator itself.\n\n## [Changelog](./CHANGELOG.md)\n\n## [Contributing](./CONTRIBUTING.md)\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnstudio%2Fnativescript-pulltorefresh","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fnstudio%2Fnativescript-pulltorefresh","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnstudio%2Fnativescript-pulltorefresh/lists"}