React Native ScrollView scrolling both directions

Question

I'm trying to get a React Native ScrollView to scroll horizontally and vertically, but for some reason it won't do it. I know it doesn't work on Android, but it is supposed to work on iOS.

I've looked at this issue: https://github.com/facebook/react-native/issues/2962

And did what it suggested, but it still only scrolls one direction.

This is how I have it declared:

<ScrollView directionalLockEnabled={false} horizontal={true} style={styles.container}>
    {this.buildContent()}
</ScrollView>

Any ideas on how to get this to scroll both directions?

Answer 1

There is currently not a direct way to achieve this. If setting contentContainerStyle prop is not a problem for you, you can go that way. If it is, you can always use 2 nested ScrollViews.

<ScrollView>
   <ScrollView horizontal={true}> 
      {this.buildContent()}
   </ScrollView>
</ScrollView>

Answer 2

try this:

    <ScrollView
      maximumZoomScale={2}
      minimumZoomScale={1}
      style={{ width: 320 }}
      contentContainerStyle={{ width: 321 }}
    >
      <View style={{ width: 321, height: 320, backgroundColor: "green" }} />
    </ScrollView>

contentContainerStyle Doc here,the property supported officially from [email protected]