I need to use the UhmanicHafs.ttf font in webView Html page to get the Expected output.
I am setting uthmanic font:
webviewHTML.loadDataWithBaseURL("file:///android_asset/fonts/UthmanicHafs.ttf",
myHtmlString, "text/html", Xml.Encoding.UTF_8.toString(), null);
Then I am getting the Actual Output
If I removed the UthmanicHafs.ttf font like this :
webviewHTML.loadDataWithBaseURL("file:///android_asset/", myHtmlString, "text/html", Xml.Encoding.UTF_8.toString(), null);
I am getting this Expected Output
What I need:
I need to use the Uthmanic Font and get the Expected output.Anyone can help with this.Thank you.
you need set the custom font like below in your css file
For this example wrote the CSS to:
#font-face {
font-family: 'feast';
src: url('fonts/yourfont.ttf');
}
body {font-family: 'feast';}
Then use the assets path as the base url:
loadDataWithBaseURL("file:///android_asset/",myhtml,"text/html","utf-8",null);
then it should be working fine.
Related
My need is to set HTML string into TextView but the problem is the <p style=\"text-align:center\"><span style=\"font-family:montserrat\"><span style=\"color:#660099\"><strong>Hello World</strong></span></span></p>\r\n
That font-family:montserrat is not applied to Text.
Note: I tried to load this HTML string using WebView but there is also same problem is raising.
Please suggest a workaround.
Thanks
Add your font file to your android project, in your case:
montserrat.tff
Define like this in your html string:
#font-face { font-family: montserrat; src: url('fonts/montserrat.ttf'); }
Then try like this:
yourWebView.loadDataWithBaseURL("file:///android_asset/",htmlString,"text/html","utf-8",null);
I have working with webview in which i want to inject css to webview that i have achieved with the following link.
But if i want to add custom font to css i have using the following code
#font-face {
font-family: 'avenir_next'; /*a name to be used later*/
src: url('OTF_FILE_LINK'); /*URL to font*/
}
body {
font-family: avenir_next;
}
I need to know that its is possible to load otf file from the Android Asset folder insted of using 'OTF_FILE_LINK'.
This problem seems familiar but it's not! I have a webpage on a web server and a webview in Android application that loads the webpage. And instead of loading some font from the Internet (or website), i want to load fonts directly from asset folder of Android device (to save data and faster). What i have done is to embed this code in the website with the hope it can use the font in Android asset folder instead:
#font-face {
font-family: 'DejaVuSans';
src: url('file:///android_asset/fonts/DejaVuSans.ttf'); /* but this does not work*/
}
body {
font-family: 'DejaVuSans';
color: red;
}
(link Change WebView font using CSS; font file in asset folder. (problem))
I currently test with android 4.+. Can anyone have the solution? Thanks
file: urls retrieve files from within one's own computer. For websites you should use relative or absolute urls. Here's a relative url example:
src: url('android_asset/fonts/DejaVuSans.ttf');
Here's a absolute url example:
src: url('http://www.example.com/android_asset/fonts/DejaVuSans.ttf');
I have pictures/movies in my webview, and i have a problem with the resize.
I have a CSS for my webview in which i set
img{width:100%;}
But how to set the just height ? Because currently I have picture which take the half of the screen.
My other problem is i have
in my content, how can I delete it ?
To modify the styling of the HTML you could load a custom css like this:
final String customCssLink = "<link rel=\"stylesheet\" type=\"text/css\" href=\"style.css\">";
webView.loadDataWithBaseURL("file:///android_asset/", customCssLink + html, "text/html", "UTF-8", null);
And you can remove all of the from the HTML like this:
String.replace(" ", "");
But with both those things you have to be very careful. Modifying HTML is just like HTML parsing a big source of bugs and rather error prone. If at all possible I would advice against doing stuff like this, but if you have no other choice try to at least be as careful as possible.
I'm trying to change the font of web pages loaded in to a Browser app developed for Android. Currently my custom font is hosted in a URL & I access the font from there by injecting a JavaScript to the page to change the style sheet (CSS) font face.
Here is the current code:
var css = '#font-face {font-family: "dhanika"; src: url(http://www.sample.lk/DhanikaWeb.ttf);} si {font-family: "dhanika"}';
var style = document.getElementsByTagName("style")[0];
style.appendChild(document.createTextNode(css));
This code works perfectly. But it takes some time to load the font from the URL. And also it is not good to load the font each time since it may incur data charges.
Therefore I wanna know weather there is a method to access my custom font from the JavaScript, if I place my font in my app's 'Assets' folder. Glad if anyone can provide the code.
Any help is appreciated!
From what I know about Android and #font-face, Android currently chokes on the local() declaration. The best method for using #font-face with all browsers is to use double declarations. Example
#font-face { font-family:'fontName'; src:url('fontName.eot'); font-weight:normal; font-style:normal; }
#font-face { font-family:'fontName'; src:url(//:) format('no404'), url('fontName.woff') format('woff'), url('fontName.ttf') format('truetype'), url('fontName.svg') format('svg'); font-weight:normal; font-style:normal; }
The Easiest way to do this is to use FontSquirrel's #font-face generator