All Projects → gameboyVito → React Native Ultimate Listview

gameboyVito / React Native Ultimate Listview

Licence: mit
A high performance FlatList providing customised pull-to-refresh | auto-pagination & infinite-scrolling | gridview layout | swipeable-row.

Programming Languages

javascript
184084 projects - #8 most used programming language
es6
455 projects

Projects that are alternatives of or similar to React Native Ultimate Listview

tulip-scroll
📜 多场景的下拉组件和更多,https://artiely.gitee.io/scroll-docs/
Stars: ✭ 44 (-91.15%)
Mutual labels:  infinite-scroll, pull-to-refresh
flutter examples
Random flutter examples
Stars: ✭ 18 (-96.38%)
Mutual labels:  pull-to-refresh, gridview
react-native-gridview
A React Native component that renders a grid of items. It uses ListView under the hood.
Stars: ✭ 16 (-96.78%)
Mutual labels:  listview, gridview
Placeholderview
This library provides advance views for lists and stacks. Some of the views are build on top of RecyclerView and others are written in their own. Annotations are compiled by annotation processor to generate bind classes. DOCS -->
Stars: ✭ 2,104 (+323.34%)
Mutual labels:  listview, gridview
Imageviewer
🔮图片浏览器,支持图片手势缩放、拖拽等操作,`自定义View`的模式显示,自定义图片加载方式,更加灵活,易于扩展,同时也适用于RecyclerView、ListView的横向和纵向列表模式,最低支持版本为Android 3.0及以上...
Stars: ✭ 363 (-26.96%)
Mutual labels:  listview, gridview
Overscroll Decor
Android: iOS-like over-scrolling effect applicable over almost all scrollable Android views.
Stars: ✭ 2,671 (+437.42%)
Mutual labels:  listview, gridview
vue-data-loading
Another component for infinite scroll and pull down/up to load data.
Stars: ✭ 63 (-87.32%)
Mutual labels:  infinite-scroll, pull-to-refresh
Google Books Android Viewer
Android library to bridge between RecyclerView and sources like web page or database. Includes demonstrator (Google Books viewer)
Stars: ✭ 37 (-92.56%)
Mutual labels:  listview, infinite-scroll
Adapter
A quick adapter library for RecyclerView, GridView, ListView, ViewPager, Spinner
Stars: ✭ 376 (-24.35%)
Mutual labels:  listview, gridview
Phoenix
Phoenix Pull-to-Refresh
Stars: ✭ 4,048 (+714.49%)
Mutual labels:  listview, pull-to-refresh
Taurus
A little more fun for the pull-to-refresh interaction.
Stars: ✭ 1,674 (+236.82%)
Mutual labels:  listview, pull-to-refresh
Flutter Layouts Exampls
Layout of the flutter example.such as Row,Comlun,listview,Just for learning.
Stars: ✭ 292 (-41.25%)
Mutual labels:  listview, gridview
Countdowntask
⌛️A countdown library for Android.
Stars: ✭ 64 (-87.12%)
Mutual labels:  listview, gridview
UnityDynamicScrollView
Dynamic scrollView based on UGUI
Stars: ✭ 161 (-67.61%)
Mutual labels:  listview, gridview
Ultimaterefreshview
UltimateRefreshView 实现下拉刷新,上拉加载更多的轻量级库;支持RecyclerView ,ListView ,ScrollView & WebView
Stars: ✭ 64 (-87.12%)
Mutual labels:  listview, pull-to-refresh
jh-weapp-demo
微信小程序项目- 实现一些常用效果、封装通用组件和工具类
Stars: ✭ 60 (-87.93%)
Mutual labels:  listview, gridview
Superadapter
[Deprecated]. 🚀 Adapter(BaseAdapter, RecyclerView.Adapter) wrapper for Android. 一个Adapter同时适用RecyclerView、ListView、GridView等。
Stars: ✭ 638 (+28.37%)
Mutual labels:  listview, gridview
React Native Super Grid
Responsive Grid View for React Native
Stars: ✭ 971 (+95.37%)
Mutual labels:  listview, gridview
react-native-paginated-listview
A simple paginated react-native ListView with a few customization options
Stars: ✭ 14 (-97.18%)
Mutual labels:  listview, infinite-scroll
android-page
android 分页列表数据加载引擎,主要封装了android分页列表数据加载的各个组件,如果你有一个需要分页加载的List列表,都可以使用此框架实现。
Stars: ✭ 15 (-96.98%)
Mutual labels:  listview, gridview

React Native Ultimate Listview

This Library includes two components: UltimateListView and UltimateRefreshView

  • UltimateListView: A high performance FlatList providing customised pull-to-refresh | auto-pagination & infinite-scrolling | gridview layout | swipeable-row. The truly ultimate version that I have done the most tricky part for you, you can treat this module as an enhanced FlatList with all excellently extra features, comparing to the official version.
  • UltimateRefreshView: A refreshable ScrollView providing customised pull-to-refresh feature, which has already been using in the UltimateListView, but it can be used independently.

This module supports both of iOS and Android platforms.

All codes are written in ES6 syntax, and meet most rules of Eslint syntax

Quick installation

Know Issue (v3.3.0): On Android, if you are using CustomRefreshView, and the total hight of your first load data is less than your device height, then the RefreshView may still sticky on the top. However, if the data you loaded is beyond your screen, everything's fine. This issue only happen on Android, any PR is welcome.

Demo

iOS Android
FlatList

Usage

import { UltimateListView, UltimateRefreshView } from 'react-native-ultimate-listview'
    <UltimateRefreshView onRefresh={this.onRefresh}>
         <YourView/>
    </UltimateRefreshView>

    <UltimateListView
       ref={ref => this.listView = ref}
       key={this.state.layout}
       onFetch={this.onFetch}
       keyExtractor={(item, index) => `${index} - ${item}`} 
       refreshableMode="advanced" // basic or advanced
       item={this.renderItem} // this takes three params (item, index, separator)       
       displayDate
       arrowImageStyle={{ width: 20, height: 20, resizeMode: 'contain' }}/>

Or you can look through this link: Usage

Documentation

Breaking Changes

  • Provide a new Component , which extends

  • Change import syntax to:

    import { UltimateListView, UltimateRefreshView } from 'react-native-ultimate-listview'

Contribution

@gameboyVito - [email protected]om

  1. Fork this Repository, then run yarn or npm install in the root folder
  2. After modifying the code, in the root folder, run yarn eslint-fix or npm run eslint-fix
  3. Make sure your code satisfy the eslint rules, then commit and push your code
  4. Open your Github, create a pull request to me. I will review it ASAP, thanks a lot.

Why FlatList

I have found some articles to explain why you need to use FlatList instead of the legacy ListView. There are some obvious reasons:

  1. FlatList is just like the UICollectionView or RecyclerView, which can dramatically reduce memory usage. It also provides smoother animation when you have an extremely long list.
  2. FlatList supports scrollToIndex function, which is pretty convenient when you want to scroll to an item with index, instead of depending the y-offset.
  3. FlatList recommend developer to use PureComponent to reduce unnecessary re-rendering, this can really boost the performance and make your app run faster.

License

MIT

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].