i want to decrease height but its not decreasing in react-native

I have created a component VeiwImageScreen and i imported in App.js I want this picture in mid of the screen that the two div above it can clearly be seen I have given width 80% its working height do not

I want to decrease its height  and align it in center I have given align-items center but due to height it not coming in middle here is my code

    <View style={styles.Container}>
          <View style={styles.closeIcon}></View>
          <View style={styles.deleteIcon}></View>
          <View></View>
          <Image
            
            style={styles.VeiwImage}
            source={require("../assets/horror-background.jpg")}
          />
        </View>
this is my styling I want this picture in mid of the screen I have given width 80% and height 80%
const styles = StyleSheet.create({
  Container: {
    justifyContent: "center",
    alignItems: "center",
    height: "100%",
    width: "100%",
  },
  VeiwImage: {
    flex: 1,
    width: "80%",
    height: 10,
  },
  closeIcon: {
    width: 50,
    height: 50,
    backgroundColor: colors.red,
    position: "absolute",
    zIndex: 1,
    top: 20,
    left: 20,
  },
  deleteIcon: {
    zIndex: 1,
    width: 50,
    height: 50,
    backgroundColor: colors.black,
    position: "absolute",
    top: 20,
    right: 20,
  },
});