JSPM

  • Created
  • Published
  • Downloads 19595
  • Score
    100M100P100Q142968F
  • License MIT

m-list-view ui component for react

Package Exports

  • rmc-list-view

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (rmc-list-view) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

rmc-list-view


NPM version build status Test coverage gemnasium deps npm download

Screenshots

Development

npm install
npm start

Example

http://localhost:8999/examples/

online example: http://react-component.github.io/m-list-view/

install

rmc-list-view

Usage

see examples

API

same as React Native ListView (v0.26).

current not support:

In general, do not support platform-specific feature, like: android endFillColor, ios alwaysBounceHorizontal. And, use css style instead of react-native's style.

  • onChangeVisibleRows
  • stickyHeaderIndices
  • ScrollView props:
    • keyboardDismissMode (not support control keyboard)
    • keyboardShouldPersistTaps (not support control keyboard)
    • onContentSizeChange (use onLayout instead)
    • removeClippedSubviews
    • showsHorizontalScrollIndicator (use css style instead)
    • showsVerticalScrollIndicator (use css style instead)
  • View props

new

  • useBodyScroll (boolean, false) - use html body's scroll
  • stickyHeader (note: if set it, ScrollComponent will be render into the head of body element, auto enable useBodyScroll)
  • renderBodyComponent - render listview body wrapper component
  • renderSectionBodyWrapper - render listview section body wrapper component
  • useZscroller (boolean, false) - use zscroller to well support RefreshControl and pull up refresh.(useBodyScroll and sticky not work when enable useZscroller)
  • scrollerOptions - zscroller options

Note: if you set renderScrollComponent, you need to write your own scroll logic like ScrollView component(see /examples/MyScroller.js).

ListView.IndexedList

  • quickSearchBarTop (object{value:string, label:string}, default '#') - top button
  • quickSearchBarStyle (object) - quickSearchBar's style
  • onQuickSearch (function())
  • showQuickSearchIndicator (boolean, false) - show quick search indicator
  • delayTime (number) - default 100ms, delay render time (delay render these items of totalRowCount - initialListSize)
  • delayActivityIndicator (react node) - delay render activity indicator

Note: should not enable useZscroller on IndexedList.

ListView.RefreshControl

  • icon (any) - refresh indicator, include pull and release state
  • loading (any) - loading indicator
  • distanceToRefresh (number, default 50) - distance to refresh
  • onRefresh (function, required) - onRefresh callback
  • refreshing (boolean, false) - whether to show refreshing state

Test Case

npm test
npm run chrome-test

Coverage

npm run coverage

open coverage/ dir

License

rmc-list-view is released under the MIT license.