react-native-alphabetflatlist

1.0.5 • Public • Published

react-native-alphabetflatlist

A Flatlist with alphabet sidebar.

Usage

    import AlphabetFlatList from 'react-native-flatlist'

    /* inside your render function */
    <AlphabetFlatList
        renderItem={this.renderItem}
        data={names}
        getItemLayout={this.getItemLayout}
        />

Example

Please check the example folder.

Props

You can use all the props provided by FlatList.

Name Type Default Required Description
data array YES Expects array of strings. If you are passing array of objects then also use matchFieldName prop.
renderItem function YES
keyExtractor function (item, index) => index.toString()
viewabilityConfig object { itemVisiblePercentThreshold: 50 }
getItemLayout function YES
mainFlatListContainerStyle object {}
alphabetListProps object {
 alphabetListContainerStyle: {},
 alphabetButtonStyle: {},
 selectedAlphabetButtonStyle: {},
 alphabetTextStyle: {},
 selectedAlphabetTextStyle: {}
}
matchFieldName string false If data array contains object then pass a field name whose value you want to show on main list. See Issue #2.

Package Sidebar

Install

npm i react-native-alphabetflatlist

Weekly Downloads

10

Version

1.0.5

License

MIT

Unpacked Size

12.1 kB

Total Files

5

Last publish

Collaborators

  • ayush.nawani