I developed an app for iOS that I'd like to integrate into Android/Samsung. To establish dimensions, I import the dimensions from react native, then in my stylesheet I set them with respect to the device size.
For example:
import {Dimensions} from 'React-Native';
<View style = {styles.container}>
<View style = {styles.header}>
</View>
<View style = {styles.middle}>
</View>
<View style = {styles.footer}
</View>
</View>
const {height}= Dimensions.get("screen");
const { width } = Dimensions.get("screen");
const styles = StyleSheet.create({
container: {
flex: 1,
flexDirection: 'column',
},
header:{
height: height*0.1,
width: width,
},
middle:{
height: height*0.6,
width: width,
},
footer:{
height: height*0.3,
width: width,
},
This works great for iOS, but this does not work the same for Android / Samsung devices. How do I make it so my screen dimensions work for both iOS and for Android?