If I was using a TextView, I could use TextView#setTypeFace. But I was using a WebView and I feared that things would be more complicated than that. So how do I do this?
Here's how we can make it work.
Step 1: We would need to have our font face included in our project's /assets folder. So look for a TTF file that you can use freely, make sure the author/creator allows you to re-distribute it!
Step 2: Edit your HTML file to include some CSS stuff, just so the WebView would know what font you want to use. Here's a sample file:
<html><head><link href="YourCssFile.css" rel="stylesheet" type="text/css" /></head><body><span class="phon">This string contains special characters: əˈpåstrəfi </span></body></html>Make sure that the href references are correct. In this case, my CSS file, HTML file and font file are in the same folder.
Step 3: Define your CSS file. In this case, our YourCssFile.css would be:
@font-face {Step 4: Load the file in your WebView! You can use
font-family: "My font";
src: url('MyFontFile.TTF');
}
.phon, .unicode {
display: inline;
font-family: 'My font', Verdana, sans-serif;
font-size: 14pt;
font-weight: 500;
font-style:normal;
color: black;
}
WebView webView = (WebView) findViewById(R.id.myWebview);or
webView.loadUrl("path/to/html/file");
webView.loadDataWithBaseURL("file:///android_asset/",If you will use the second option, your article variable would contain the HTML string. Just make sure that you escape your quotation marks with a backslash (\).
article, "text/html", Encoding.UTF_8.toString(), null);
IMPORTANT NOTE: This feature seems to be broken in Android 2.0 and 2.1, as reported here.