3

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?

MK_Pierce
  • 916
  • 2
  • 10
  • 26

0 Answers0