Logo Gets Cropped In Other Devices

Question

I Am New To React Native And I am Facing A Issue With Responsive Image. This Code is working fine on my phone But when I try it on another phone The Image Gets Cropped In The Sides.

I Tried The Following solutions

Responsive image in React Native

React Native responsive image width while width/height ratio of image keeps the same

This is The Complete Code https://snack.expo.io/SuHBzDnNi

 return(
      <SafeAreaView style={styles.container}>
        <TouchableOpacity style={styles.Touch} onPress={this.MoveNextPage}>
           <Image resizeMode="contain" source={require("../logo.png")} style={styles.logo}/>
        </TouchableOpacity>
      </SafeAreaView>
    )
  }
}

const styles = StyleSheet.create({
    container:{
        flex:1,
        height:Dev_Height,
        width:Dev_Width,
        justifyContent:"center",
        alignItems:"center",
        backgroundColor:"#121212"
    },
    logo:{
      height:"100%",
      width:"100%"
    },
    Touch:{
      justifyContent:"center",
      alignItems:"center",
      height:"22%",
      width:"40%"
    }
})

Thank You : )