WebView text size

Question

Sometimes, when I load my page (no static content, constructed on the fly) I see the font size too small 1. If I reload I see it properly 2. I go back and forth and see it properly. And then ... small. Not a specific page, not on specific times. Not even specific version: I deploy on ICS device, no problem, then change something (like the font-size) and here is the problem. Same for deploys at 8 and 10 emulators.

My view is pretty straightforward:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_weight="1"
    android:orientation="vertical" >
    <WebView
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/webviewArticle"
        android:layout_width="match_parent"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:padding="12dp" >
    </WebView>
</LinearLayout>

The HTML construction (the content parameter is formatted html)

String toShow = new StringBuffer()
    .append("<html>")
    .append("<head>")
    .append("<style type='text/css'>body{ font-size: large; color: #FFFFFF; background-color: #000000;}</style>")
    .append("</head>")
    .append(String.format(
        "<body><h1>%s</h1><div><img src='%s' alt='%s' style='width:100%%; height:auto' /></div><div style='background-color:#000000;'>%s</div><div><h3>%s</h3></div></body>",
        article.getTitle(),
        article.getImageLink().toString(),
        article.getTitle(),
        article.getContent().replace("%", "%25"), //html
        article.getAuthor()))
    .append("</html>")
    .toString();

mBrowser.getSettings().setBuiltInZoomControls(true);
mBrowser.setInitialScale(1);
CompatibilityUtils.setLoadWithOverviewMode(mBrowser, true); //set based on android version
mBrowser.getSettings().setUseWideViewPort(true);
mBrowser.loadDataWithBaseURL("fake://in/order/to/refresh", toShow, "text/html", "utf-8",null);

Any hint?

Additional description 12/09/25: as the images suggest, the WebView thinks that the available space is half the screen and lays the text accordingly. This is is odd. What is oddest is that it thinks so for the text (the header above the image and the div below) and not the image!!!

score 8 · Accepted Answer · answered Sep 25 '12 at 00:01

8

WebSettings settings= webView.getSettings();

this

settings.setTextSize(WebSettings.TextSize.SMALLEST);

or

settings.setDefaultFontSize(10);//Larger number means larger font size

answered Sep 25 '12 at 00:01

Mohammad Ersan

12,304
8
54
77

Thanks but it is not a font size issue, really (I tested you suggestions, just in case :) ). Please see the additional info and see if you have a hint :) Thx – denispyr Sep 25 '12 at 18:09
1

try to remove `mBrowser.getSettings().setUseWideViewPort(true);` – Mohammad Ersan Sep 25 '12 at 19:50
Thx MoshErsan for the try, your answer put me on track :) therefore I will accept it. It is the overviewMode actually (see [link](http://stackoverflow.com/questions/5448841/what-do-setusewideviewport-and-setloadwithoverviewmode-precisely-do) for what-is-what). The text comes ok but :'( I have image size issues. I will open a new question on this. I don't believe it is **that** hard to put up a simple header-image-text html page. – denispyr Sep 26 '12 at 17:16
1

The final resolution was to remove setUseWideViewPort, change setInitialScale to 0 (eg the default) and set overview mode to false. I am not really sure why I used the viewport and the overview mode in the first place; most probably a copy/paste that worked until now :/ Thx again MoshErsan – denispyr Sep 26 '12 at 19:45
@MoshErsan it appears setTextSize() was deprecated in API level 14. – Quv Jun 30 '13 at 18:29

WebView text size

1 Answers1

Linked