LATEST UPDATE: So if you don’t mind doing it client side you can use the dynamic importing as suggested by a few people below. This will be for use cases where you use static page generation. i created a component which passes all the react-device-detect exports as props (it would be wise to filter out … Read more
This question is a bit old but I couldn’t find a better answer when I googled it. Most desktops now are touch enabled, so detecting it is irrelevent. The best way to detect them is by screen size. With Modernizr you can use if (Modernizr.mq(‘only all and (max-width: 480px)’)) { …}
Use this: public static boolean isTablet(Context context) { return (context.getResources().getConfiguration().screenLayout & Configuration.SCREENLAYOUT_SIZE_MASK) >= Configuration.SCREENLAYOUT_SIZE_LARGE; } which will return true if the device is operating on a large screen. Some other helpful methods can be found here.
If you want to know what environment you’re on, try using Bootstrap’s own CSS classes. Create an element, add it to the page, apply its helper classes and check if it’s hidden to determine if that’s the current environment. The following function does just that: Bootstrap 4 function findBootstrapEnvironment() { let envs = [‘xs’, ‘sm’, … Read more
The issue is that the Android User-Agent is a general User-Agent and there is no difference between tablet Android and mobile Android. This is incorrect. Mobile Android has “Mobile” string in the User-Agent header. Tablet Android does not. But it is worth mentioning that there are quite a few tablets that report “Mobile” Safari in … Read more
This subject is discussed in the Android Training: Use the Smallest-width Qualifier If you read the entire topic, they explain how to set a boolean value in a specific value file (as res/values-sw600dp/attrs.xml): <resources> <bool name=”isTablet”>true</bool> </resources> Because the sw600dp qualifier is only valid for platforms above android 3.2. If you want to make sure … Read more