React native ios中底部的Scrollview截止

React native ios中底部的Scrollview截止,react-native,flexbox,uiscrollview,react-native-ios,React Native,Flexbox,Uiscrollview,React Native Ios,我有以下代码片段。在ios设备中,最后一个元素被切断。有人能帮我解决这个问题吗 <View > <Animated.View style={[ { transform: [ { translateX: this.state.x } ] }, { flexBasis: "100%" }

我有以下代码片段。在ios设备中,最后一个元素被切断。有人能帮我解决这个问题吗

  <View >
    <Animated.View
      style={[
        {
          transform: [
            {
              translateX: this.state.x
            }
          ]
        },
        { flexBasis: "100%" }
      ]}
    >
      <ScrollView
        contentContainerStyle={{ flexGrow: 1}}
        importantForAccessibility="no"
        onScroll={(event) => {
          this.setYOffset(event.nativeEvent.contentOffset.y);
        }}
        onContentSizeChange={(contentWidth, contentHeight) => {
          this.maxHeight = contentHeight;
        }}
      >
        <KeyboardAwareScrollView>
          <View style={styles.containerViewStyle} importantForAccessibility="no">
                 <Row />
                 <Row />
                 <Row />
                 <Row />
                 <Row />
          </View>
        </KeyboardAwareScrollView>
      </ScrollView>
    </Animated.View>
  </View>
我已经尝试将flex:1设置为最外层视图。但这并不能解决问题。有人能帮我理解这里的问题吗?

尝试在contentContainerStyle中为滚动视图提供paddingBottom,如:


将填充底部添加到上述样式可以解决此问题。但是我觉得这不是一个正确的方法。我在想,我们是否可以在不使用paddingBottom的情况下实现同样的效果。我认为我们必须提供paddingBottom,以便在scrollview的底部获得一些额外的空间。flex不应该在不提供paddingBottom的情况下覆盖它吗?不。flex与scrollview的行为不同与正常视图相比。
const styles = {
  containerViewStyle: {
    flex: 1,
    flexDirection: "column",
    justifyContent: "space-between"
  }
};  
<ScrollView
    contentContainerStyle={{ paddingBottom: 40 }}
>

    {/* Children */}
</ScrollView>