I have seen this line of code:
import { Dimensions, Platform } from 'react-native';
const { height, width } = Dimensions.get('window');
const deviceUtils = (function () {
const iPhone6Height = 667,
iphoneSEHeight = 568,
iPhoneXHeight = 812,
iPhoneXWidth = 375;
return {
dimensions: {
height,
width,
},
iPhone6Height,
iphoneSEHeight,
iPhoneXHeight,
iPhoneXWidth,
isIOS14: ios && parseFloat(Platform.Version as string) >= 14,
isLargePhone: width >= iPhoneXWidth,
isNarrowPhone: width < iPhoneXWidth,
isSmallPhone: height <= iPhone6Height,
isTallPhone: height >= iPhoneXHeight,
isTinyPhone: height <= iphoneSEHeight,
};
})();
export default deviceUtils;
I want to ask you why People need this exact height of iPhones ?
CodePudding user response:
It seems someone plans to write different code for “wide” and “narrow” and “wide”, and for three different classes of heights. They use the exact width / height of an iPhone X for example to make sure that an iPhone X falls into the wide and tall categories.
This is not usually what you should do. Decide what you want to be on a screen. Use constraints to fit everything. If you have problems fitting everything use a smaller font or an adjustable font, or put everything in a scroll view. Anyway, with notch and things at the bottom of the screen, things are more complicated than just “width” and “height”.
