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.
Related
I want to implement a Rich text editor by using a webview in android. Content can be loaded by using a HTML file (which resides in assets) without any problem. But if user has edited the content of the webview (with all the formatting), I need to get the modified content as a HTML string and save it in the database. How can I do this?
I tried in many ways but it seems that we need to pass a URL to get the content of the webview. But after editing the webview content, how can we get the edited URL? or current updated webview content to HTML formatted string?
Using below code I made editable web view.
String msgBody = "<html>\n"+
"<body>\n"+
"<div id=\"content\" contenteditable=\"true\" style=\"font-family:Helvetica;font-size:14px\">" + a +" </div>\n"+
"</body>"+
"</html>";
// wbview = (WebView)this.findViewById(R.id.wbview);
wbView.getSettings().setJavaScriptEnabled(true);
wbView.loadDataWithBaseURL("", msgBody, "text/html", "UTF-8", "");
wbView.setHorizontalScrollBarEnabled(true);
wbView.setVerticalScrollBarEnabled(true);
In iOS we can get it easily by using below code line.
NSString* html=[_tbEmail.webView stringByEvaluatingJavaScriptFromString:#"document.getElementsByTagName('body')[0].innerHTML"];
I would like to know if one of your could embed GIFV format into your app. I am trying to embed it using a webview but without success.
Actually GIFV format is closer to a video format than a gif.
Whatever suggestion would be nice. Thanks in advance.
After work around of this issue, I couldn't find a solution which could display GIFV format like a video.
But, my solution to this issue has been to use a webview using the same way that i was using to make able to load "gif" files and if you remove directly the "v" from the name of the file, you can show it as a .gif file.
Resuming, remove the "v" from the .gifv file name and display it as a .gif.
The way that i am injecting code to make able to display gifs into the webview is:
public void getContentWebView(String url, WebView webView)
{
String html = "<!DOCTYPE html><html><body><img src=\""+ url +"\" width=\"100%\" height=\"100%\"></body></html>";
webView.loadData(html, "text/html", "utf-8");
}
So in Android I wanted to justify the text so I decided to use the Webview.It works fine but the only issue I have is that the background of my app is not white. So whenever I see the text, it always has a white background. So can I add a body tag to enable it to change the background color?
String text = "<html><body style=\"text-align:justify\"> %s </body> </Html> ";
// I want to include a body tag above which will make the background this color = #e6e6e6
String data = "My Text";
WebView webView = (WebView) findViewById(R.id.WebView);
webView.loadData(String.format(text, data), "text/html", "utf-8");
Take a look at the following link.
Android TextView Justify Text
It explains the justify rules in android. How to do it in webview and it also has a support library you could use to do native.
Try
webView.setBackgroundColor("#00000000")
for transparent background.
Try:
String text = "<html><body style=\"text-align:justify; background-color:#e6e6e6;\"> %s </body></html>"
The background-color CSS property should let you set the background to whatever you want it to be.
Edit: Kalel Wade's answer is better since it's done through the Android properties as opposed to the HTML.
I would like to set some html content in my webview with some pictures.
I've read on the internet i must use loadDataWithBaseUrl to do such a thing because i need to link the folder of images (basUrl) in order.
My html content nicely loads, i can even ran the javascripts perfectly, but for some reason my images cannot be loaded.
Somewhere i've read there are some security reasons and thats why i cant load images from sd card to webview and some says it can be easily done via loadDataWithBaseUrl, so i really dont know which one is true.
Here is my method i tried, maybe with some mistakes so dont be rude:
I got my html file here:
mnt/sdcard/com.mypackage.myproject/3/3.html
My images are here:
mnt/sdcard/com.mypackage.myproject/3/images/Cover.png
And this is my content loading:
myWebView.loadDataWithBaseURL("file:///mnt/sdcard/com.mypackage.myproject/3", myHtml, "text/html", "utf-8", "");
In my html code:
<img src="images/Cover.png" alt="Cover.png" height="820"/>
So as you see i give the baseUrl, and for some reason the webview cannot load my images.
As many said, this can be a solution:
mWebView = (WebView) findViewById(R.id.webview);
mWebView.getSettings().setAllowFileAccess(true);
mWebView.getSettings().setJavaScriptEnabled(true);
mWebView.getSettings().setBuiltInZoomControls(true);
String base = Environment.getExternalStorageDirectory().getAbsolutePath().toString();
String imagePath = "file:/"+ base + "/test.jpg";
String html = "<html><head></head><body><img src=\""+ imagePath + "\"></body></html>";
mWebView.loadData(html, "text/html","utf-8");
BUT, i have 700 different html files and there are many images in many different places... so i cannot modify the html code.
Is there a way to link the image folder to my html files to properly use them as a baseUrl?
You have a syntax error in your loading statement. You have to put : after file
myWebView.loadDataWithBaseURL("file:///mnt/sdcard/com.mypackage.myproject/3", myHtml, "text/html", "utf-8", "");
You don't need to put full path of your image into html.
img src="images/test1.jpg"
Instead
img src=\""+ imagePath + "\"
I am working on an app which needs to display some dynamically queried
HTML content, including CSS.
WebView seems to be the best implementation for this type of work.
I ran into an error when testing it out, and tracked it down to the
following css tag:
hr{width:100%!important}
Android WebView seems to be incapable of displaying any html that
includes this line.
Some research shows that the attribute was deprecated
(link: http://www.w3schools.com/tags/att_hr_width.asp), but it works
on all browsers.
Below is some html, including this line. It will render fine in any
browser.
<html>
<head>
<style type=\"text/css\">
hr{width:100%!important}
</style>
</head>
<body>
Some text
</body>
</html>
And, in Android:
String exampleCSS = "<html><head><style type=\"text/css\">" +
"hr{width:100%!important}" +
"</style></head><body>" +
"Some text" +
"</body></html>";
WebView webView = (WebView) findViewById(R.id.web_html_about);
webView.loadData(exampleCSS, "text/html", "utf-8");
The result is a "Web page not available" error in the webview.
Is this a known issue due to deprecation? Is it a bug with WebView?
Is there any known work around for such issues?
It looks like the android webview passes content using the data:// scheme, and as a result, you would have to urlencode the content for it to work as expected.
In my case, the css/html is provided to me, so I had to use the following work around:
Example
((WebView) findViewById(R.id.web_body)).loadDataWithBaseURL(null, content, null, "utf-8", null);
This seems to work, and get passed this particular issue above.
Thanks to all that answered.
Dale.
Hr is not depreciated, though it has been given symantic meaning. It indicates a change in content.
I'm not sure what is causing your issue, but I can tell you your markup as written is unnecessary. Hr is a block level element, and so it already has a 100% width.