Change font WebView for an already loaded site with Android - android

I have been searching for days but could not find solution for my problem. Please kindly take a look:
Input: a WebView with an already loaded web.
Output: change the font of that loaded web inside the WebView.
What I have done so far is this:
#SuppressLint("SetJavaScriptEnabled")
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mWebView = (WebView) findViewById(R.id.webview);
mWebView.getSettings().setJavaScriptEnabled(true);
mWebView.setWebViewClient(new WebViewClient());
mWebView.loadUrl("http://www.bbc.co.uk/");
and then, this is how I change the font inside webview:
1/ way 1:
mWebView.loadUrl("javascript:(function() { var s=document.createElement('style');s.innerHTML ="
+ " '#font-face{font-family:ZawGyi-One;src:url(\"http://db.tt/OQ1RZoWc\");}"
+ "body,div,h1,h2,h3,input,textarea{font-family:ZawGyi-One! important;}';"
+ "document.getElementsByTagName('head')[0].appendChild(s);document.getElementsByTagName('body')[0].style.fontFamily = \"ZawGyi-One\"})()");
2/ way 2:
mWebView.loadDataWithBaseURL(
null,
"<script>javascript:(function() { var s=document.createElement('style');s.innerHTML ="
+ " '#font-face{font-family:ZawGyi-One;src:url(\"http://db.tt/OQ1RZoWc\");}"
+ "body,div,h1,h2,h3,input,textarea{font-family:ZawGyi-One! important;}';"
+ "document.getElementsByTagName('head')[0].appendChild(s);document.getElementsByTagName('body')[0].style.fontFamily = \"ZawGyi-One\"})() </script>",
"text/html", "UTF-8", null);
3/ way 3:
mWebView.setWebViewClient(new WebViewClient() {
#Override
public void onPageFinished(WebView view, String url) {
// TODO Auto-generated method stub
super.onPageFinished(view, url);
mWebView.loadUrl("javascript:(function() { var s=document.createElement('style');s.innerHTML ="
+ " '#font-face{font-family:ZawGyi-One;src:url('file:///android_asset/fonts/BLKCHCRY.TTF');}"
+ "body,div,h1,h2,h3,input,textarea{font-family:ZawGyi-One! important;}';"
+ "document.getElementsByTagName('head')[0].appendChild(s);document.getElementsByTagName('body')[0].style.fontFamily = \"ZawGyi-One\"})()");
}
});
But unfortunately, none of my solutions works. Even though I have tried to change html file insdie /assets/ folder and also the fonts are stored at /assets/fonts/ folder, I cannot walk through this.
**One more question: is it really possible to change font style inside an already loaded site of webview ? Someone, please kindly guide me.
I am appreciated your great help.

look into this answer..How to change font face of Webview in Android?..
Or try this demo project..https://github.com/mayooresan/Japs-Attack-Ceylon--Android-App
Hope it will helps you.

At last, I have figured it out:
1/ Without making change in the content of webpage you cant change the font.
WebView is basically a view to display web pages That web pages may be static(eg html) or dynamic. But it doesn't change the look and feel of web page. so It wil display the text exactly same as that of webpage. If you need to change the font then you have to change it in webpage (may be in html).
(from Webview change font ? _android)
2/ one more solution for this is about changing font from the rendering engine of webview, for Chrome app, it should be now is Blink, or Internet app, it would be Webkit.
So, if anyone is facing the same problem as I was, my little piece of advice is find the way around, you normally do not have enough time or authorize to make the change at rendering engine of webview. :)
Have a nice day.

Related

Show only certain parts of a web page in a web view, AndroidStudio?

How can I get the certain parts from Website and show in WebView, Android Studio???
Below Image is that I want get part (square in red part)
and site is this : https://kimpga.com
I'd like to display only the red part as an Android web view. What should I do?
and then I used this method: webView.loadUrl("javascript:document.getElementsByClassName('').style.display='none'");
but that website doesn't have div id and doesn't work method!
+) add homepage source
Please understand to attach the overall picture. I'd like to show you the part of div selected in blue through a web view.
I solved it!
using
mWebView.setWebViewClient(new WebViewClient(){
#Override
public void onPageFinished(WebView webView, String url)
{
webView.loadUrl("javascript:(function() { " +
"document.getElementsByClassName(//classname//)[index of document].style.display='none'; " +
"})()");
}
});

Web view problems

I have some problem in my web view.
I want to load a string from a WordPress blog, witch have html tags such as <a> and image tag and ... .
So my problems are:
As I mention above, I want to load a local string and I want to handle user click on the links, so I load data like this into the web view:
WebView webview = (WebView) this.findViewById(R.id.mainWV);
webview.setWebViewClient(new MyWebViewClient());
webview.getSettings().setJavaScriptEnabled(true);
webview.getSettings().setDomStorageEnabled(true);
String s="<p>It will enable Seattle-based Alaska to expand into lucrative hubs such</p>\n<p><img class=\"aligncenter size-full wp-image-1035\" src=\"http://ichef.bbci.co.uk/news/660/cpsprodpb/D09F/production/_89070435_89069565.jpg\" alt=\"\" width=\"300\" height=\"120\" /></p>\n<p>as San Francisco and Los Angeles.</p>\n";
webview.loadDataWithBaseURL("", s, "text/html", "utf-8", "");
and another way I tried was:
String head1 = "<head></head>";
String text = "<html>" + head1
+ "<body dir=\"rtl\" >" + s
+ "</body></html>";
webview.loadData(text, "text/html", "utf-8");
and my client is :
class MyWebViewClient extends WebViewClient {
#Override
public boolean shouldOverrideUrlLoading(WebView view, String url) {
Log.d("USER_CLICKED", url + "USER_CLICKED");
return true;
}
}
Ok, now when I run the app, and when I click on <a> I never see 'USER_CLICKED', but the webview content change and it seems web view is empty, I mean is white as snow.
notice 1: when I try this:
webview.loadUrl("https://android-arsenal.com/");
and run the app, when I click on the links in the loaded web view, every thing is OK, and i see this Log: 'USER_CLICKED' and the related URL.
notice 2: yes i try a lots of different URL, but loading from string, nothings change in click handling.
notice 3: I test in android 5.1 and 4.1 in 4.1 clicked recognized and is see 'User.. but in the 5.1 the white page story happens.(Edit: android 6 also do not show 'USER... ')
my number 2 problem is, when I call this:
webview.loadDataWithBaseURL("", s, "text/html", "utf-8", "");
the image tag does not load! I mean it is just ignore to load the images, and I do not know why.
notice 3: when I copy text from inside the web view there is some rectangle in the text.
OK every one, after a long time, i find the problem, so as i mentioned above, i take string from WordPress rest API(json), so in my word, the string should be OK, but as i find out, there is some extra '\' in the string, and the string is like:
<p>It will enable Seattle....
, as simple it is i just use:
s=s.replaceAll("\\","");
so, thank any one who see this post.
A URL is a URL. The first item is HTML, not a URL. If you want to load the URL then you have to pass a valid URL (not HTML) and do not expect the URL to be magically parsed out of the HTML string that you are loading. In fact the first item is not even valid HTML, it is a part of HTML, potentially a snippet, but it's not even enclosed in the HTML tags that I expect a web view would need.

WebView.loadDataWithBaseURL. Go exactly to #label

How to go EXACTLY to http://example.com/index.html#label if content to webview loading via WebView.loadDataWithBaseURL ?
By default webview go to root only. How go to label ?
WebView doesn't have such functionality from the box.
You can achieve this with the help of javascript, but this is a bit of ugly.
You should load your html page and then add javascript code to it.
After this you can load your webview and call javascript methods from current page.
Check this link for example how that can be done.
WebView jump to anchor using loadDataWithBaseUrl
Example goes here
webContents.setWebViewClient(new WebViewClient(){
#Override
public void onPageFinished(WebView view, String url) {
String id = "895884";
webContents.loadUrl("javascript:scrollAnchor(" + id + ");");
}
});

Android - Search for text inside of a Webview after loading

I've been searching, but I can't find a code that works with mine, I've found some similar questions, but the others not work with my "after loading" code.
What I need is search for a text, if exist show the page normally (do nothing, I mean, let continue), if not exist, show a html message on the same webview with this code:
String MsgError = "<html><body><h1 style='color:#FF0000'>Error</h1><br /><a style='color:#000000'>An error occurred while page is loading, please try again later.</a></body></html>";
mWebView.loadData(MsgError, "text/html", "UTF-8");
I have to find a text like this one:
Text
This is my "after loading" code:
#Override
public void onPageFinished(WebView view, String url) {
super.onPageFinished(view, url);
view.clearCache(true);
}
Thanks in advanced.
Perhaps it may be interesting to look here, where somebody explains how to extract the HTML as a string from a webview. You could perform a String.matches() on that string. Depending on the result you get, you can either let the WebView be, or redirect it to your own, custom error page.

Non-clickable links in WebView

In my app, I am pulling down some HTML from a web service and displaying it in a WebView. Most of the time the app will display links in the HTML just fine, as in they are clickable and open up the Android Browser. Other times, however, the links are not clickable. It turns out sometimes the service will provide HTML with links that are not inside an href, and are just plain text.
Is there anyway for a WebView to parse the HTML and make these links "clickable"? I know the default Android Browser can do it, but I'm not sure about WebViews.
The Webview may not have built-in detectors to auto-link plain URLs within a page, but you could run a JavaScript function within the WebView to parse the URLs when the page finishes loading.
Basically, something like the following (I haven't checked this code for syntax yet, but it should give you the idea):
final WebView webview = (WebView)findViewById(R.id.browser);
/* JavaScript must be enabled if you want it to work, obviously */
webview.getSettings().setJavaScriptEnabled(true);
/* WebViewClient must be set BEFORE calling loadUrl! */
webview.setWebViewClient(new WebViewClient() {
#Override
public void onPageFinished(WebView view, String url)
{
webview.loadUrl("javascript:(function() { " +
"var exp = /(\b(https?|ftp|file):\/\/[-A-Z0-9+&##\/%?=~_|!:,.;]*[-A-Z0-9+&##\/%=~_|])/ig; " +
"document.getElementsByTagName('body')[0].innerHTML = document.getElementsByTagName('body')[0].innerHTML.replace(exp,'<a href='$1'>$1</a>');" +
"})()");
}
});
webview.loadUrl("http://code.google.com/android");
Note that the above JavaScript borrows the URL-parsing JavaScript regex from " How to replace plain URLs with links?," and more info can be found on JavaScript injection within the Android WebViewClient reference and at http://lexandera.com/2009/01/injecting-javascript-into-a-webview/ (not me).

Categories

Resources