{"id":22308779,"url":"https://github.com/ratson/react-native-recyclerview-list-android","last_synced_at":"2025-07-29T06:31:02.895Z","repository":{"id":57339472,"uuid":"124515634","full_name":"ratson/react-native-recyclerview-list-android","owner":"ratson","description":"Fork of https://github.com/godness84/react-native-recyclerview-list","archived":false,"fork":false,"pushed_at":"2019-04-05T16:47:48.000Z","size":210,"stargazers_count":4,"open_issues_count":1,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2024-11-22T00:48:31.759Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"Java","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/ratson.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2018-03-09T09:02:58.000Z","updated_at":"2022-05-17T09:00:11.000Z","dependencies_parsed_at":"2022-09-16T13:00:44.822Z","dependency_job_id":null,"html_url":"https://github.com/ratson/react-native-recyclerview-list-android","commit_stats":null,"previous_names":[],"tags_count":23,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ratson%2Freact-native-recyclerview-list-android","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ratson%2Freact-native-recyclerview-list-android/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ratson%2Freact-native-recyclerview-list-android/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ratson%2Freact-native-recyclerview-list-android/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ratson","download_url":"https://codeload.github.com/ratson/react-native-recyclerview-list-android/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":227990286,"owners_count":17852266,"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":[],"created_at":"2024-12-03T20:15:15.256Z","updated_at":"2024-12-03T20:15:15.998Z","avatar_url":"https://github.com/ratson.png","language":"Java","funding_links":[],"categories":[],"sub_categories":[],"readme":"# This is fork\n\nFork from https://github.com/godness84/react-native-recyclerview-list with [following changes](https://github.com/ratson/react-native-recyclerview-list-android/compare/66df1b0ea013122b6bc3f2c04713e35f85df5420...master).\n\nInstall via `npm install react-native-recyclerview-list-android --save`.\n\n# react-native-recyclerview-list\n\nA RecyclerView implementation for ReactNative, that overcomes some limitations of `FlatList`, `VirtualizedList` and `ListView`.\n\n## Supported React Native Versions\n| Component Version     | RN Versions    |\n|-----------------------|---------------|\n| **0.1.x**          | **0.45, 0.46**   |\n| **0.2.0 - 0.2.2**  | **0.47, 0.48**   |\n| **0.2.3**          | **\u003e= 0.49**   |\n\n## Features\n\n- **Supports native animation during adding or removal of items** (as the classic RecyclerView does)\n- **Add items at the top with no scrolling issue**: it means that you can easily implement an infinite scroll in both directions\n- **Scroll to whatever index you want**: even if you don't know the exact dimensions of your rendered items, you can scroll to any index without any scrolling issue\n- **Control the scrolling velocity**: the `velocity` param in the `scrollToIndex` method is exactly for this\n- **Initial scroll index**: specify the scroll position at startup, and there will be no flicker\n- **Low memory usage**: it renders just the visible items plus some extra items around\n\n## Caveats\n\n- It's just for Android.\n- Just vertical linear layout. No fancy layouts as grid.\n\n## Getting started\n\n`$ npm install react-native-recyclerview-list --save`\n\n### Mostly automatic installation\n\n`$ react-native link react-native-recyclerview-list`\n\n### Manual installation\n\n\n#### Android\n\n1. Open up `android/app/src/main/java/[...]/MainActivity.java`\n  - Add `import com.github.godness84.RNRecyclerViewList.RNRecyclerviewListPackage;` to the imports at the top of the file\n  - Add `new RNRecyclerviewListPackage()` to the list returned by the `getPackages()` method\n2. Append the following lines to `android/settings.gradle`:\n  \t```\n  \tinclude ':react-native-recyclerview-list'\n  \tproject(':react-native-recyclerview-list').projectDir = new File(rootProject.projectDir, \t'../node_modules/react-native-recyclerview-list/android')\n  \t```\n3. Insert the following lines inside the dependencies block in `android/app/build.gradle`:\n  \t```\n      compile project(':react-native-recyclerview-list')\n  \t```\n\n\n## Usage\n```javascript\nimport RecyclerviewList, { DataSource } from 'react-native-recyclerview-list';\n\n// Take an array as data\nvar rawdata = [\n  { id: 1, text: 'Item #1' },\n  { id: 2, text: 'Item #2' },\n  { id: 3, text: 'Item #3' },\n  { id: 4, text: 'Item #4' },\n  { id: 5, text: 'Item #5' }\n];\n\n// Wrap your data in a DataSource.\n// The second argument is the 'keyExtractor' function that returns the unique key of the item.\nvar dataSource = new DataSource(rawdata, (item, index) =\u003e item.id);    \n\n...\n\n// Render the list\nrender() {\n  return (\n    \u003cRecyclerviewList\n      style={{ flex: 1 }}\n      dataSource={dataSource}\n      renderItem={({item, index}) =\u003e (\n        \u003cText\u003e{item.text} - {index}\u003c/Text\u003e\n      )} /\u003e\n  );\n}   \n```\n\n# Props\n\nProp name             | Description   | Type      | Default value\n----------------------|---------------|-----------|--------------\n`style`               | Style for the list | object | {}\n`dataSource`          | The datasource that contains the data to render | DataSource | none\n`windowSize`          | Number of items to render at the top (and bottom) of the visible items | int | 30\n`initialListSize`     | Number of items to render at startup. | int | 10\n`initialScrollIndex`  | Index of the item to scroll at startup | int | none\n`initialScrollOffset` | Offset of the scroll position at startup | int | none\n`itemAnimatorEnabled` | Whether animates items when they are added or removed | boolean | true\n`ListHeaderComponent` | Component to render as header | component | none\n`ListFooterComponent` | Component to render as footer | component | none\n`ListEmptyComponent`  | Component to render in case of no items | component | none\n`ItemSeparatorComponent`  | Component to render as item separator | component | none\n`onVisibleItemsChange`    | Called when the first and last index of the visible items change | function | none\n`onScroll`                | Called when the list is scrolling | function | none\n`onScrollBeginDrag`       | Called when the user starts scrolling | function | none\n`onScrollEndDrag`         | Called when the user stops dragging | function | none\n\n# Methods\n\nMethod name           | Params                          | Description\n----------------------|---------------------------------|------------\n`scrollToIndex`       | `{ index, animated, velocity, viewPosition, viewOffset }` | Scroll the list to the `index`ed item such that it is positioned in the viewable area such that `viewPosition` 0 places it at the top, 1 at the bottom, and 0.5 centered in the middle. `viewOffset` is a fixed number of pixels to offset the final target position.  It can be `animated`. `velocity` is the amount of milliseconds per inch.\n`scrollToEnd`         | `{ animated, velocity }` | Scroll to the end of the list. It can be `animated`. `velocity` is the amount of milliseconds per inch.\n\n# DataSource\n\nIt wraps your array, giving you some useful methods to update the data.\n\n## Methods\n\nMethod name           | Params                          | Description\n----------------------|---------------------------------|------------\n`push`                | item                            | Add an item to the end of the array\n`unshift`             | item                            | Add an item to the beginning of the array\n`splice`              | index, deleteCount, ...items    | Equals to `Array.prototype.splice`\n`set`                 | index, item                     | Set the item at the specified index\n`get`                 | index                           | Returns the item at the specified index\n`size`                |                                 | Returns the length of the array\n`setDirty`\t\t\t  | \t\t\t\t\t\t\t\t| Forces the RecyclerViewList to render again the visible items\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fratson%2Freact-native-recyclerview-list-android","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fratson%2Freact-native-recyclerview-list-android","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fratson%2Freact-native-recyclerview-list-android/lists"}