CODEWITHSUNDEEP
reactjsreact-nativereact-native-ios
Oliver84
Oliver84

Reputation: 307

Dimensions.get('screen').width returns wrong width in iPad simulator?

Dimensions.get('screen').width is returning a width of 320 for my iPad simulator.

No matter which iPad device I try to use in the simulator, it returns a 320 x 480 screen and window resolution

.

Am I doing something wrong here or does this just not work right in the simulator?

Upvotes: 1

Views: 3346

Answers (3)

steffeydev
steffeydev

Reputation: 161

I know this is after the fact, but you can also use react-native-device-info, which has a method isTablet(). I'm not sure what version of RN you are using, but Dimensions.get('window') should work fine, I think the issue might have been that you were using 'screen' instead of 'window'.

Upvotes: 0

Oliver84
Oliver84

Reputation: 307

Thanks to @Dani Akash I think I found a solution that will work for what I'm trying to do here. React Native: How to Determine if Device is iPhone or iPad

The suggestion was to use the aspect ratio to determine if it's a tablet or not. 

import { Dimensions } from 'react-native';
const {height, width} = Dimensions.get('window'); 
const aspectRatio = height/width;

if(aspectRatio>1.6) {

   // Code for Iphone

}
else {

   // Code for Ipad

}

Upvotes: 1

Val
Val

Reputation: 22817

the unit of react-native width & height is density-independent pixels, not normal pixels.

Why use density-independent pixels?

There are too many dimensions with smartphone devices. Components should looks the same regardless of screen dimensions.

Setting dimensions this way is common for components that should always render at exactly the same size, regardless of screen dimensions.

For most cases you can just use Layout with Flexbox.

Upvotes: 0

Related Questions