1.0.5 • Published 5 years ago

react-native-alphabetflatlist v1.0.5

Weekly downloads
9
License
MIT
Repository
github
Last release
5 years ago

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.

npm.io

Props

You can use all the props provided by FlatList.

NameTypeDefaultRequiredDescription
dataarrayYESExpects array of strings. If you are passing array of objects then also use matchFieldName prop.
renderItemfunctionYES
keyExtractorfunction(item, index) => index.toString()
viewabilityConfigobject{ itemVisiblePercentThreshold: 50 }
getItemLayoutfunctionYES
mainFlatListContainerStyleobject{}
alphabetListPropsobject{ alphabetListContainerStyle: {},alphabetButtonStyle: {},selectedAlphabetButtonStyle: {},alphabetTextStyle: {},selectedAlphabetTextStyle: {}}
matchFieldNamestringfalseIf data array contains object then pass a field name whose value you want to show on main list. See Issue #2.