React Native UI Challenge positioning elements - react-native

Question

Today i want to do something like the picture below. I want to arrange the matches so that they form these numbers. But I'm not sure if the way I did it will be responsive on different phones? I don't think so ..
My code so far is
import { StatusBar } from "expo-status-bar";
import { Image, StyleSheet, View } from "react-native";
export default function App() {
return (
<View style={styles.container}>
<StatusBar style="auto" hidden={true} />
<Image
style={{
height: 80,
width: 80,
position: "absolute",
top: "61%",
left: "10%",
transform: [{ rotate: "90deg" }],
}}
source={require("./assets/match.png")}
/>
<Image
style={{
height: 80,
width: 80,
position: "absolute",
top: "56.8%",
left: "19.8%",
transform: [{ rotate: "180deg" }],
}}
source={require("./assets/match.png")}
/>
<Image
style={{
height: 80,
width: 80,
position: "absolute",
top: "52%",
left: "10%",
transform: [{ rotate: "90deg" }],
}}
source={require("./assets/match.png")}
/>
<Image
style={{
height: 80,
width: 80,
position: "absolute",
top: "44%",
left: "10%",
transform: [{ rotate: "90deg" }],
}}
source={require("./assets/match.png")}
/>
<Image
style={{
height: 80,
width: 80,
position: "absolute",
top: "48%",
left: "0%",
}}
source={require("./assets/match.png")}
/>
</View>
);
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: "#fff",
alignItems: "center",
justifyContent: "center",
},
});
So on my iPhone it looks like that -
But on Android it not looks good at all -
So I want to ask is there a way I can position the matches correctly or i should create image in photo editor and use it in app?
Sorry for my bad English!