Changing text color in a WebView?

Question

There's a method for altering background color but not font.
Any ideas?

score 38 · Answer 1 · answered Jun 17 '12 at 09:08

something like

String text = "<html><head>"
          + "<style type=\"text/css\">body{color: #fff; background-color: #000;}"
          + "</style></head>"
          + "<body>"                          
          + your_string_text_here
          + "</body></html>";

webview1.loadData(text, "text/html", "utf-8");

score 21 · Answer 2 · answered Jun 05 '16 at 17:59

21

I had to put it in the onPageFinished method.

_webView.setWebViewClient(new WebViewClient() {
    public void onPageFinished(WebView view, String url) {
        _webView.loadUrl(
            "javascript:document.body.style.setProperty(\"color\", \"white\");"
        );
    }
});

answered Jun 05 '16 at 17:59

djunod

4,698
2
29
28

partially work, some of the font color still not overwritten – Beeing Jk Mar 20 '18 at 04:04
@BeeingJk that is because the font is overridden by the site – Sambhav. K May 21 '22 at 06:02

score 12 · Accepted Answer · answered Aug 10 '09 at 16:30

12

I'm not sure I understand. The WebView just displays the HTML you give it so you would just use normal HTML/CSS to modify the content displayed within.

answered Aug 10 '09 at 16:30

MattC

12,193
10
53
77

Sure, but I'd like to do that w/o modifying the underlying html. – yanchenko Aug 10 '09 at 17:14
Is the underlying HTML something from a third party? You could always inject javascript at the end that will modify it and then call the javascript from the Activity itself doing wvMyWebView.loadUrl("call javascript function here"); – MattC Aug 10 '09 at 18:05
@MattC what if you change the app theme and you want to see changes instantly. – Faisal Shaikh Jul 08 '20 at 00:52

score 11 · Answer 4 · answered Apr 05 '17 at 05:45

This worked for me

myWebView.getSettings().setJavaScriptEnabled(true);
myWebView.setWebViewClient(new WebViewClient() {
public void onPageFinished(WebView view, String url) {
    view.loadUrl(
        "javascript:document.body.style.setProperty(\"color\", \"white\");"
    );
  }
});

score 6 · Answer 5 · answered Jan 23 '14 at 19:22

6

This is the easiest way I found (change the text color to white for example):

webview.loadUrl("javascript:document.body.style.color=\"white\";");

answered Jan 23 '14 at 19:22

RafaelJan

2,314
23
36

how to change the font type – Make it Simple Jul 15 '14 at 10:38
note that you will have to enable javascript for the web view in question, otherwise the call will have no effect – sfera Sep 15 '14 at 08:25

score 2 · Answer 6 · answered Dec 20 '15 at 21:48

2

@rafraph's answer didn't work for me. I had to use

webView.loadUrl("javascript:document.body.style.setProperty(\"color\", \"white\");");

answered Dec 20 '15 at 21:48

Jess Smith

167
1
8

score 2 · Answer 7 · answered Mar 19 '11 at 10:06

When the buffer is SPANNABLE, modifying the HTML directly is an ideal solution. The font, color, typeface, style can all be affected through HTML:

String szMessage = "<font face='trebuchet' size=30><a href=zz><b>click me</b></a></font>";

TextView tv = (TextView)findViewById(R.id.tv_message);
tv.setText(Html.fromHtml(szMessage), BufferType.SPANNABLE);

score 1 · Answer 8 · answered Nov 03 '16 at 22:26

You can concatenate your answer one body tag HTML with CSS style hex color, this is an example using a JSON response

First: function for decode JSON to HTML format

public String stripHtml(String html) {
    return Html.fromHtml(html).toString();
}

Second: Load data in WebView (no url)

 String string_html;
 string_html = "&lt;body style=&quot;color:#535362;&quot;&gt;" + youStringHTML + "&lt;/body&gt;";
 webView.loadDataWithBaseURL(null, stripHtml(string_html), "text/html", "utf-8", null);

Changing text color in a WebView?

8 Answers8

Linked