How to change the font size according to the screen size in android if I set the font sizes according to a specific phone?

Question

I set all the font sizes in my .xml files so that they appear correctly on a specific phone (iPhone 11, to be exact). How do I change the font sizes according to screen sizes of individual phones?

Answer 1

For fonts in Android using sp is highly recommended.

For text views you might want to take a look at Android TextView AutoSizing

Answer 2

Use this library, it is pretty impressive and supports almost all resolutions and is very effective. Add these dependecies in gradle and sync gradle :

Benefit : Very easy to use, and text size change as per screen size.

Use this for view size(height, width, margin, etc.)

implementation 'com.intuit.sdp:sdp-android:1.0.6'

Usage :

android:layout_marginBottom="@dimen/_30sdp"

Use this for text sizes :

implementation 'com.intuit.ssp:ssp-android:1.0.6'

Usage :

android:layout_marginBottom="@dimen/_14ssp"

Answer 3

You first need to get the screen size ratio between iPhone 11 and the phone on which the app is running. Define a static variable in your MainActivity:

private static double SCREEN_SIZE_RATIO;

Then get iPhone 11's screen size. Don't use the raw dimensions because they don't take into account the fact that the screen does not cover the entire phone. Instead, take the pixel resolution and divide it by the ppi. Calculate iPhone 11's diagonal length and your target phone's diagonal length, and divide the latter by the former to get the screen size ratio.

private void calculateScreenSizeRatio() {
    double iphone11Width = ((double) 828) / ((double) 326); // Values from https://www.apple.com/iphone-11/specs/
    double iphone11Height = ((double) 1792) / ((double) 326);
    double iphone11Diagonal = Math.hypot(iphone11Width, iphone11Height);

    DisplayMetrics displayMetrics = getResources().getDisplayMetrics();
    double screenWidthPixels = displayMetrics.widthPixels;
    double screenHeightPixels = displayMetrics.heightPixels;
    double screenWidth = screenWidthPixels / displayMetrics.xdpi;
    double screenHeight = screenHeightPixels / displayMetrics.ydpi;
    double screenDiagonal = Math.hypot(screenWidth, screenHeight);

    SCREEN_SIZE_RATIO = screenDiagonal / iphone11Diagonal;
}

Note that when calculating the diagonal length, the ratio of height-to-width is not taken into account, which introduces a slight inaccuracy.

Now, write a static function to get the font size (which was originally defined in the .xml), multiply it by the screen size ratio, and set the result to the new font size.

public static void setTextSize(TextView view) {
    view.setTextSize(TypedValue.COMPLEX_UNIT_PX, (float) (view.getTextSize() * SCREEN_SIZE_RATIO));
}

The getTextSize() function returns the size in pixels, that's why we set the size in pixels (using TypedValue.COMPLEX_UNIT_PX). Remember that both EditText and Button subclass from TextView, so this function can also be used for EditTexts and Buttons.

In your MainActivity, write a function similar to the following:

private void setTextSizes() {
    setTextSize(emailEditText);
    setTextSize(passwordEditText);
    setTextSize(logInButton);
    setTextSize(registerTextView);
    setTextSize(invalidTextView);
    setTextSize((TextView) findViewById(R.id.text_view_no_account));
}

In other activities, write a function similar to the following:

private void setTextSizes() {
    MainActivity.setTextSize(amountEditText);
    MainActivity.setTextSize((TextView) findViewById(R.id.edit_text_payment_method));
    MainActivity.setTextSize((TextView) findViewById(R.id.add_button));
    MainActivity.setTextSize(creditDebitCardTextView);
    MainActivity.setTextSize(bankTransferTextView);
}

You can put any of your TextViews, EditTexts and Buttons in this function. Remember to cast your EditTexts and Buttons to (TextView) when using findViewbyId(), as I've done with edit_text_payment_method and add_button in the second code snippet.

Finally call setTextSizes() in onCreate() in each of your acivities, preferably after you have assigned the class variables.