React-native-navigation: [V2] ScrollView top content insets on iOS are incorrect when using drawBehind: true on the TopBar

Created on 20 Sep 2018  路  2Comments  路  Source: wix/react-native-navigation

Issue Description

When using a ScrollView with a TopBar on iOS, the content inset is incorrect when drawBehind: true is set on the TopBar. If you hide the topBar, the content inset is correct.

The scrollview does move under the TopBar like it should, but the content is offset. If I am using drawBehind, I would expect the content offset to not be there, and I would have to adjust the offset manually.

Steps to Reproduce / Code Snippets / Screenshots

// top bar style settings
topBar: {
    visible: true,
    translucent: true,
    transparent: true,
    drawBehind: true,
}
// RN render code
<ScrollView style={{flex:1, backgroundColor: 'limegreen'}} contentContainerStyle={{flexGrow: 1}}>
    <View style={{flex: 1, backgroundColor: 'red'}}></View>
 </ScrollView>

Environment

  • React Native Navigation version: 2.0.2556
  • React Native version: 0.55.1
  • Platform(s) (iOS, Android, or both?): iOS
  • Device info (Simulator/Device? OS version? Debug/Release?): Simulator, iOS 11.4, Debug

Most helpful comment

@jordanfloyd You can try and set contentInsetAdjustmentBehavior on your scroll view:

<ScrollView contentInsetAdjustmentBehavior="never">...</ScrollView>

All 2 comments

@jordanfloyd You can try and set contentInsetAdjustmentBehavior on your scroll view:

<ScrollView contentInsetAdjustmentBehavior="never">...</ScrollView>

@adamterlson thank you. I had tried automaticallyAdjustContentInsets with no success, I didn't realize there was a different property for iOS 11+

Was this page helpful?
0 / 5 - 0 ratings