@stream-io/flat-list-mvcp
    TypeScript icon, indicating that this package has built-in type declarations

    0.10.2 • Public • Published

    maintainVisibleContentPosition prop support for Android react-native.

    License Npm Package Compatibility

    [ Built with at Stream ]

    In react-native, ScrollView (and FlatList) component have support for a prop maintainVisibleContentPosition, which is really useful for chat-like applications where you want to see new messages scroll into place. Also you might need it in other applications where you need bi-directional infinite scroll. Although currently its only supported on iOS. So here we have built a simple wrapper for FlatList and ScrollView to add support for this prop for android. On iOS, we simply return FlatList and ScrollView from react-native package.

    We built this wrapper for our in-house react-native chat sdk, but we are making it public, in case it helps other devs from react-native community.

    Before you proceed, please don't forget to also check other relevant packages, built at Stream:

    ⚠️ Horizontal list is currently not supported on this package.

    Example

    #  clone the repo
    git clone https://github.com/GetStream/flat-list-mvcp.git
    cd flat-list-mvcp/Example
    
    # Install npm and pod dependencies
    yarn; npx pod-install;
    
    # run the app
    npx react-native run-android

    Installation

    yarn add @stream-io/flat-list-mvcp

    Usage

    import { FlatList, ScrollView } from '@stream-io/flat-list-mvcp';
    
    <FlatList
        maintainVisibleContentPosition={{
            autoscrollToTopThreshold: 10,
            minIndexForVisible: 1,
        }}
        ...
    />
    
    <ScrollView
        maintainVisibleContentPosition={{
            autoscrollToTopThreshold: 10,
            minIndexForVisible: 1,
        }}
        ...
    />

    Expo support

    This package doesn't support Expo managed workflow. There is a feature request open for expo - https://expo.canny.io/feature-requests/p/android-maintainvisiblecontentposition-on-flatlist (please upvote)

    Credits

    Thanks to stackia for https://github.com/facebook/react-native/pull/29466#issuecomment-664367382

    Contributing

    PRs for improvement are welcome :)

    License

    MIT

    Install

    npm i @stream-io/flat-list-mvcp

    DownloadsWeekly Downloads

    9,508

    Version

    0.10.2

    License

    MIT

    Unpacked Size

    175 kB

    Total Files

    51

    Last publish

    Collaborators

    • marco-ulge
    • vangalilea88
    • martincupela
    • stream-release-bot
    • madsroskar
    • caleb.murphy
    • zita.szupera
    • petyosi
    • tbarbugli
    • tschellenbach
    • jaapbakker88
    • vishtree
    • lukesmetham