WebView中动态出现的内容在React Native Expo应用程序中从底部被截断

Question

我正在动态获取数据，但是如果内容较少，则会留出空间，如果内容较多，则会从底部截断。

这是本机代码：

<View style={styles.slideContainer} key={(Event, index) => Event.id.toString()}>   
          <ScrollView style={styles.container}>
            <View style={styles.container}>       
            <Text style={styles.headerItem}>{Event.newsHde}</Text>          
            <Image style={styles.image} source={{ uri: (imagesUrl != "") ? (imagesUrl) : imgSRC}}  />
            <WebView
              scrollEnabled
              source={{html: '<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0">'+Event.news}}
              style={{height: Dimensions.get('window').height, width: Dimensions.get('window').width}}
            />
            <Image style={styles.image} source={{ uri: (imagesUrl2 != "") ? (imagesUrl2) :  imgSRC}}  />
        </View>        
      </ScrollView>
      </View>

这是上面的CSS：

const styles = StyleSheet.create({

     container: {
        flex: 1,
        paddingTop: 5,
      },
      item: {
        padding: 5,
        fontSize:16,
      },
      headerItem: {
        padding: 5,
        fontWeight:"bold" ,
        fontSize:18,
      },
      image: {
        flex: 1,
        padding: 10,
        width: '100%',
        height: 350,
        resizeMode: 'contain', 
      },
      subHeader: {
        paddingLeft: 8,
        flex: 1,
        flexDiection: 'row',
        alignItems: 'center',
        justifyContent: 'flex-start'
      },
      slideContainer: {
        flex: 1,
        alignItems: "center",
        justifyContent: "center"
      }
});

我希望屏幕根据内容进行更改。目前底部已被截断，请参见下图：