Nativebase: [Android] ListView/FlatList not able to scroll inside Content component

[thienlhh]

I have a FlatList inside a Content component with some other components that make the Content over height and scrollable. The problem I have that the FlatList was not able to scroll when Content scrollable.

react-native, react and native-base version

react: 16.0.0-alpha.12
react-native: 0.45.1
native-base: 2.2.0

Expected behaviour

The List should scrollable

Steps to reproduce (code snippet or screenshot)

My list:
<FlatList style={{ width: '100%', borderWidth: 1, borderColor: '#e0e1e2', marginTop: 10, height: 270, flex: 1 }} data={positions} renderItem={this.renderPosition} keyExtractor={(item, index) => item.id} />

Is the bug present in both ios and android or in any one of them?

Android only

[sachithamh]

same issu

[shivrajkumar]

@thienlhh Remove the height from the FlatList. If you really need the list to be taking up only that much of space. Wrap it with a View maybe and apply the height there

[thienlhh]

Thanks @shivrajkumar for tip, may be I'll try later as my project running to deadline. I have to use an other workaround by using NestedScrollView

[jkeller22]

I am encountering this same issue, and I do not have a fixed height set for the FlatList, but on a View as suggested by @shivrajkumar.

[shivrajkumar]

@jkeller22 Were you able to resolve this as per suggestion?

[bispul]

did anyone find any solution?

[akhil-geekyants]

@thienlhh In this case, if possible use a <View/> instead of <Content/>.

As wrapping the ListView inside the ScrollView the parent scroll action dominates the child scroll action which leads only ScrollView to scroll.

See React Native issue comment here

[akhil-geekyants]

Closing the issue due to no response

[alekspickle]

Did any of suggested earlier and nothing seems to be helping. Any update? My FlatList not even nested, still it is showing no signs of life or scrollability in particular...

<View> <FlatList data={numbers} renderItem={this._renderNumbers} keyExtractor={this._keyExtractor} /> </View>

[akhil-geekyants]

@alexgnatrow can you try this https://github.com/facebook/react-native/issues/1966#issuecomment-285130701