I created a design in React Native using <View> only but later I tried wrapping whole code in ScrollView and it disturbed whole design

Question

         <ScrollView  style={{ flexGrow: 1 }} >
            <View style={styles.container}>
              <View style={styles.container1}>
                <View style={styles.container3}></View>
                <View style={styles.container4}></View>
              </View>
              <View style={styles.container2}></View>
           </View>
         </ScrollView>


container: {
        flex: 1,
    },
    container1:{
        flex: 2,
        flexDirection: 'column',
    },container2:{
        flex: 3.8,
        backgroundColor: 'yellow',
    },container3:{
        flex: 0.35,
        flexDirection: 'row',
    },container4:{
        flex: 0.65,
        paddingTop:15,
        paddingLeft:10,
        paddingRight:10,
        // paddingBottom:10,
        flexDirection: 'row',
        backgroundColor: 'red',
    }

i am facing problem with the above code