If the user has enlarged the font in the phone settings, how can I deactivate this setting?
I know one way for React Native. I need a web code like this:
//Here is React-Native example
if (Text.defaultProps) {
Text.defaultProps.allowFontScaling = false
} else {
Text.defaultProps = {}
Text.defaultProps.allowFontScaling = false
}
i couldn't find anything when I searched for a draft similar to this.
any idea?
thanks for your time.
Related
Using Linking.openURL('mailto:') with expo-linking opens the mail app with a 'compose mail' screen, how can i open the mail app directly on the inbox tab ?
Inspired by this stack overflow post, you can use the message:// url scheme to achieve this on iOS. If no content is provided, it defaults to the email inbox on iOS.
For android, things are a little trickier. You'll need expo-intent-launcher and a few extra params to complete the hand-off. A complete solution may look something like this:
import { startActivityAsync, ActivityAction } from 'expo-intent-launcher';
[...]
if (Platform.OS === "android") {
const activityAction = "android.intent.action.MAIN";
const intentParams: IntentLauncher.IntentLauncherParams = {
category: "android.intent.category.APP_EMAIL",
};
IntentLauncher.startActivityAsync(activityAction, intentParams);
}
else if (Platform.OS === "ios") {
Linking.openURL('message://');
}
Be sure to test on real devices if possible since the iPhone simulator doesn't have a mail client installed.
List of URL schemes on wikipedia
Update: If you don't mind an extra dependency, take a look at react-native-email-link which has the added benefit of allowing users to select from any installed email client. Neat!
I am trying to get the user to 'install' the shortcut icon to a webpage and use it as an icon to the PWA.
I am wondering if any of you had a chance to somehow discover if the user installed the shortcut on home screeen?
This is an interesting case, because when developing on Android or such one has access to such information, on the other hand I don't recall browser giving that information away.
The beforeinstallprompt will only fire if the user has NOT installed the PWA
First: Use that to check if installed
window.addEventListener('beforeinstallprompt', (e) => {
// If you get inside here, the PWA is not installed
});
Example code here
https://developers.google.com/web/fundamentals/app-install-banners
Second: If you are showing your own deferred prompt like the examples at the link above, you can listen to know if they close that without adding to home screen (A2HS)
// Wait for the user to respond to the prompt
this.deferredPrompt.userChoice
.then((choiceResult) => {
if (choiceResult.outcome === 'accepted') {
// User said yes to your A2HS
} else {
this.deferredPromptRejected = true;
}
});
Third: You can check if your PWA is running as a standalone
function isRunningStandalone() {
return (window.matchMedia('(display-mode: standalone)').matches);
}
Assuming that my Codename One web-app is supposed to run on a mobile device, I tried to lock its orientation to portrait.
My problem is that the following build hint doesn't force the use of a web-app in portrait mode:
javascript.manifest.orientation=portrait
Am I missing something?
I also tried the following native interface, without success:
(function (exports) {
var o = {};
o.lockPortraitOrientation_ = function (callback) {
// Screen Orientation API, https://w3c.github.io/screen-orientation/#examples
screen.orientation.lock('portrait');
callback.complete();
};
o.isSupported_ = function (callback) {
callback.complete(true);
};
exports.cool_teammate_apps_frontend_NativeUtilities = o;
})(cn1_get_native_interfaces());
Is the browser you tested on within the compatibility table here?
Assuming it is try this syntax for the native code:
screen.lockOrientationUniversal = screen.lockOrientation || screen.mozLockOrientation || screen.msLockOrientation;
if (screen.lockOrientationUniversal("portrait-primary")) {
// orientation was locked
} else {
// orientation lock failed
}
I'll check whether we can make our Display orientation calls map to these API's.
all I would try to make some optional layout in NextJS. My problem is that I have found some method to check the browser URL then serve content according to these URL. But by this way the server content an browser content are no longer identical, hence the schema breaks.
Here an snippet of my trial:
export default ({children, title = 'title' }) => {
var
contact = false;
if (exenv.canUseDOM ){ if (window.location.href==="http://localhost:4000/contact" ) { contact= true}; }
else {const contact = false};
if (contact){ return( <div>Hey it is contact ! </div> ) }
else { // return normal layout
My console returns me predictably:
Warning: Text content did not match. Server:
So... I'm wondering if I have to make some custom settings on a custom NextJS server to grant the backend/frontend behaviors?
Or maybe there is a less expensive solution in the area?
Any hint would be great,
thanks
You can't remove that warning, it is appear because you just render that layout from client side, so there is a different between layout rendered by server and layout rendered by client.
I don't know what variable exenv.canUseDOM is, but you can use process.browser to detect if the current process is server side rendering or not.
I am using magnific popup JS (http://dimsemenov.com/plugins/magnific-popup/) to produce a popup for a youtube video on my Drupal site. The implementation works fine, but only if I am logged into Drupal. If I am not logged in, the popup link will just go the the youtube page (eg jQuery not initialising).
I suspect there may be something going on with Drupal loading a different version of jQuery when I am logged in. It seems that I may be able to add something to my template file to fix this. Haven't figured it out yet (https://www.drupal.org/node/2165555)
I do not have access to add jQuery update module.
Fixed. Added below snippet to template.php to force a later version of jQuery to load.
function theme_name_js_alter(&$javascript) {
$node_admin_paths = array(
'node/*/edit',
'node/add',
'node/add/*',
'node/*/extend_review_date',
);
$replace_jquery = TRUE;
if (path_is_admin(current_path())) {
$replace_jquery = FALSE;
} else {
foreach ($node_admin_paths as $node_admin_path) {
if (drupal_match_path(current_path(), $node_admin_path)) {
$replace_jquery = FALSE;
}
}
}
// Swap out jQuery to use an updated version of the library.
if ($replace_jquery) {
$javascript['misc/jquery.js']['data'] = '//code.jquery.com/jquery-1.7.0.min.js';
}
}