Inverted FlatList inside scroll

[yunus-atmaca]

Bug

I'm using BottomSheetFlatList with inverted prop to show user comments but BottomSheet inside scroll is not working. I mean I cannot scroll to the top. But when I remove the prop( "inverted" ), it works really well.

Environment info

Library	Version
@gorhom/bottom-sheet	3
react-native	0.64.0
react-native-reanimated	^2.0.0
react-native-gesture-handler	^1.10.3

Reproducible sample code

<BottomSheet
        ref={bottomSheetRef}
        index={1}
        backgroundComponent={backComponent}
        backdropComponent={null}
        handleComponent={null}
        snapPoints={snapPoints}
        onChange={handleSheetChanges}>
        <View style={[styles.contentContainer,]}>
          <View style={styles.headerContainer}>
            <Text
              text={t('comment')}
              size={17}
              font={'heavy'}
            />
          </View>
          <BottomSheetFlatList
            ref={ref}
            horizontal={false}
            showsVerticalScrollIndicator={false}
            data={comments}
            inverted
            renderItem={renderMessage}
            keyExtractor={(_, i) => 'key ' + i}
          />
          <Footer
            eventId={eventId}
          />
        </View>
      </BottomSheet>

any recommendation to fix the scrolling issue?

[github-actions[bot]]

@yunus-atmaca: hello! :wave:

This issue is being automatically closed because it does not follow the issue template.

[stephenkelzer]

I am also running into this issue. Is there any timeline on this being fixed by chance?

[stephenkelzer]

Update - I think I found a workable solution for my problem. Scrolling upward was not working when I added the inverted property.. however, after adding the onRefresh and refreshing properties as well, things seem to be working great and as expected!

[pietroanello]

Update - I think I found a workable solution for my problem. Scrolling upward was not working when I added the inverted property.. however, after adding the onRefresh and refreshing properties as well, things seem to be working great and as expected!

I fixed only on iOS with this method. Still trying to fix for Android too

[ursnj]

@gorhom Any update on this issue, Not able to scroll BottomSheetFlatList when list is inverted. ???

[sonal-maniya]

A working solution for me, use Flstlist from react-native-gesture-handler.

import {FlatList} from 'react-native-gesture-handler';

[Nodonisko]

Using FlatList from react-native-gesture-handler helped with my issue that I was not able to scroll in horizontal FlatList on Android.

[ils-anwarshah]

A working solution for me, use Flstlist from react-native-gesture-handler.

import {FlatList} from 'react-native-gesture-handler';

Worked for me thanks

[jdnichollsc]

@yunus-atmaca are you getting the same error using ListHeaderComponent and ListFooterComponent props of the BottomSheetFlatList? 🤔

[Karthik-B-06]

Has the support for inverted FlatList (BottomSheetFlatList) dropped? How has anyone achieved this?