React native check if tablet or screen in inches
Solution 1
Based on @martinarroyo's answer, a way to go about it use the react-native-device-info package.
However the android implementation is based on screen resolution. That can be a problem as there are many tablet devices with a lower resolution than many mobile devices and this can cause problems.
The solution I will be using and am suggesting is use react-native-device-info for apple devices and for android devices go with a simple ratio logic of the type:
function isTabletBasedOnRatio(ratio){
if(ratio > 1.6){
return false;
}else{
return true;
}
}
This is not a perfect solution but there are many small tablets with phonelike ratios as well or even phablets ( android is blurry) and this solutions is inclusive towards those as well.
Solution 2
You can use the react-native-device-info package along with the Dimensions API. Check the isTablet()
method and apply different styles according on the result.
Solution 3
If you don't want to use library react-native-device-info use can use this code below, not sure it't work perfect but may be help
export const isTablet = () => {
let pixelDensity = PixelRatio.get();
const adjustedWidth = screenWidth * pixelDensity;
const adjustedHeight = screenHeight * pixelDensity;
if (pixelDensity < 2 && (adjustedWidth >= 1000 || adjustedHeight >= 1000)) {
return true;
} else
return (
pixelDensity === 2 && (adjustedWidth >= 1920 || adjustedHeight >= 1920)
);
};
Return-1
An engineer at heart, I enjoy trying different languages, frameworks and programming paradigms. I like making things work, then finding the faults in the system and repeating the process until it all ticks predictably. I appreciate good design in all levels, from the smallest software module to the configuration of the company's procedures, team dynamics, even in art. I love being around positive and driven people, good literature and trying different cuisines.
Updated on July 22, 2022Comments
-
Return-1 almost 2 years
I've established a different render logic for tablets and mobile devices. I was wondering if there is a way to get the screen size in inches or maybe even any module to automatically detect if the device is a tablet or not.
The reason I am not using the dimensions api directly to get the screen resolution is that there are many android tablets with lower resolution than many of their mobile counterparts.
Thanks.