In the android OS you can change font-family in the settings. I am making a react-native app and I don't want to the device to load a different font than I am setting for my app.
I am having trouble finding answers on how to disable this function in the android OS. I see lots of stuff for font scaling but nothing to disable changing font from within the android OS.
Justin, look in to setting the prop called allowFontScaling to false, this is keep your Font the same to what your app intentionally needs.
Link:
https://facebook.github.io/react-native/docs/text.html#allowfontscaling
I needed my font family to stay the same only for my apps header so I just took a screen shot of the font I wanted and added the screen shot for my header instead of a Text component.
Related
Recently I have face an issue related to font size. In normal case, font size of text are fine but when display zoomed is selected in iphone, app gets unusable as design gets worse. Is there any way to resolve this in React Native ?
I want to create a web app such as this?
I already have a mobile app how do I display my mobile app like this on the large screens?
On large screens, I want a mobile and then mobile app running within it.
This is the link for the website shown in image
I want my Website to work like this, how can I achieve it?
I already have an mobile app made using ionic, what i want is to use that app for large screens like this website has used.
I'm not sure if I understand what you're asking.
To make responsive websites, you should use this:
#media (min-width: Xpx) {
}
You can define your minimum width here, that indicates the size of browser at which these settings should be applied. If you're using sass, nest this and apply your browser-sized settings there.
I hope that was helpful, but maybe I misunderstood the question and it's more complicated
I don't have any experience of this problem but there is a dedicated article here: https://ionicframework.com/blog/tips-tricks-for-ionic-on-desktop/
This can be created by using an Iframe on the Desktop.
So I created an SVG for the borders of the mobile and rendered my app inside the SVG using the Iframe.
Since I am using Iframe so my app takes mobile width as viewport width and is rendered as it should on mobile.
I'm coding an application React-Native in which i need one screen to be locked on landscape (without any action from the user), how can i do this ?
I tried the "transform" props but couldn't manage to make it works
In Android :
Navigate to the AndroidManifest.xml file. the path is android/app/src/main and set android:screenOrientation to the landscape.
In iOS:
Open iOS folder of your project with Xcode. In general tab, find device orientation and set it to landscape left or right.
The abovementioned is ok to change the orientation of all the screens. if you need to change one particular page only, you can use this library.
In Phonegap I have come across the problem, that if we change the font size of the mobile device from the setting to normal to large then the css which has applied to the application breaks.
So how to overcome this problem ? I have searched a lot but not able to find any solution regarding it.
Any help or advice would be helpful.
It works fine when device font-size is normal.
Image here
As I change the device font-size from setting>Display>fonts to Huge
Image here
Just found out the solution exactly as i need.
By using this plugin.
And Just write the following in your onDeviceReady function in index.js.
if(window.MobileAccessibility){
window.MobileAccessibility.usePreferredTextZoom(false);
}
This will just ignore the system font preferences.
By the information you passed I think that if you adjust the media queries, and the viewport you will have the desired result.
Viewport example. Phonegap Application text and layout too small
Media queries example. Scaling a Phonegap app for different Android screen sizes/densities?
I'm working with a Windows 8 app using Java Script.
In windows 8 there is only one snap view and that is fixed one. But when we come to the windows 8.1 we can resize the snap view. I want to do is keep that fixed size snap view in windows 8.1 also. That means, I want to stop resizing snap view when my windows 8 app running on windows 8.1..
Is there any way for it...?
Looking for example or any guide... Thank you
#dougajmcdonald is correct. The user is in control and will be able to resize any app to most any size, so your app will need to account for it. You can change the minimum size of your app which gives Windows a hint about where to give the user a snap point. For instance, if you say your app's minimum size is 500px then when the user is dragging the separator, it will snap to 500 pixels, but it will still allow them to resize to say 587 pixels.
I don't believe you can stop it, as it's a part of the OS and apps are supposed to adhere to it.
You can control your app via media queries in the CSS to fix size to particular values when the app width is at certain values.
Or you can detect the application state and look for 'snapped' and set sizes in the JS code perhaps.
EDIT:
In order to use CSS which applies to the application in snapped mode you can find good examples in the MS Template applications, taken from their CSS you can use:
#media screen and (-ms-view-state: snapped) { // my styles }
Which will allow you to apply specific styles in the snapped state.