Font size difference caused by Android font size settings

Hi!

I’m developing an app and I’m using Android to test the app. While testing with a couple of devices I found out that some devices had different font sizes. After some searching I noticed these devices had their font size settings in Android set to small font. I’ve been searching if there’s a way to set the font size to a fixed amount but haven’t been able to find out how.

I’ve made two screenshots, one with a small font size and one with a normal font size.

Does anyone know how I can set the font size to a fixed amount or how to prevent the font sizes from changing depending on the phone settings? Thanks!

I have this problem,too.
How can i solve this issue?? font size to fix??

I am also struggling with this - surely it can’t be a new use case and there MUST be a way of disabling the app responding to system base font size changes?

I found the solution using a cordova plugin to disable the user preferred text zoom.

You can find the plugin here: https://github.com/phonegap/phonegap-mobile-accessibility and add in the platform ready event:

platform.ready().then(() => {
    [...]
    if(window.MobileAccessibility){
       window.MobileAccessibility.usePreferredTextZoom(false);
    }
    [...]
});
7 Likes

thanks man, saved me some trouble!

The UI didn’t scale well on small screen-dimensional phones and modified the whole user interface when an app set’s “Huge” accessibility choices looked stupid.
What I did was put the following code below in my BaseActivity (an Activity class that all my activities extend from)

public void adjustFontScale(Configuration configuration) {
    if (configuration.fontScale > 1.30) {
        LogUtil.log(LogUtil.WARN, TAG, "fontScale=" + configuration.fontScale); //Custom Log class, you can use Log.w
        LogUtil.log(LogUtil.WARN, TAG, "font too big. scale down..."); //Custom Log class, you can use Log.w
        configuration.fontScale = (float) 1.30;
        DisplayMetrics metrics = getResources().getDisplayMetrics();
        WindowManager wm = (WindowManager) getSystemService(WINDOW_SERVICE);
        wm.getDefaultDisplay().getMetrics(metrics);
        metrics.scaledDensity = configuration.fontScale * metrics.density;
        getBaseContext().getResources().updateConfiguration(configuration, metrics);
    }
}

And called it right after my super.onCreate() like so

adjustFontScale(getResources().getConfiguration());

What this code does is identify whether the user sets its font scale to more than 1.30f (1.30f is “large” on Note 5 but probably varies somewhat from one device to the next). If your user sets your font too big (“Extra Large,” “Huge”…) we just size the app to “Large.”

Other Tip:
You can set their width / height with sp instead of classical dp if you want certain layouts to scale with your custom fonts ( weird font text) (say, a Relative Layout that is used to build backdrop to your fonts). The layout changes with the fonts on your application when a user changes their font size. Nice little trick.-Nice little trick.

1 Like

After searching a lot I solved it with this

Add this code to your MainActivity.java


package io.ionic.demo.pg.cap.ng;

import com.getcapacitor.BridgeActivity;
import android.webkit.WebSettings;
import android.webkit.WebView;


public class MainActivity extends BridgeActivity {

    public void onResume() {
    super.onResume();
    WebSettings settings = bridge.getWebView().getSettings();
    settings.setTextZoom(100);
    settings.setSupportZoom(false);
    }


}

Just do the package name changes with your own.

2 Likes

Thanks for sharing such a piece of wonderful knowledge. Would you please let me know which font is applied on pdfhour website?

I have not got the answer. However, I have found the font of pdfhour website. Anyways thanks.