How to change font face of Webview in Android?

Question

I want change the default font of webview to a custom font. I\'m using webview in developing an bilingual browser app for Android.

I tried getting an instance of cus

Answer 1

There's a working example of this in this project. It boils down to:

1. In your assets/fonts folder, place the desired OTF or TTF font (here MyFont.otf)

2. Create a HTML file that you'll use for the WebView's content, inside the assets folder (here inside assets/demo/my_page.html):

   
   
   
   
   
   Your text can go here! Your text can go here! Your text can go here!
   
   
   

3. Load the HTML into the WebView from code:

   webview.loadUrl("file:///android_asset/demo/my_page.html");
   

Take note that injecting the HTML through loadData() is not permitted. As per the documentation:

Note that JavaScript's same origin policy means that script running in a page loaded using this method will be unable to access content loaded using any scheme other than 'data', including 'http(s)'. To avoid this restriction, use loadDataWithBaseURL() with an appropriate base URL.

As @JaakL suggests in the comment below, for loading HTML from a string, you should instead provide the base URL pointing to your assets:

webView.loadDataWithBaseURL("file:///android_asset/", htmlData);

When referencing the font in htmlData, you may then simply use /fonts/MyFont.otf (omitting the base URL).