I'm trying to load local html file:
WebView webView = (WebView)findViewById(R.id.webView1);
webView.getSettings().setDefaultTextEncodingName("utf-8");
webView.setWebChromeClient(new WebChromeClient());
webView.loadUrl("file:///android_asset/www/index.html");
index.html contains this:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
</head >
<body>
რაღაც ტექსტი
</body>
</html>
but it doesn't work. Can anyone help?
P.S. that text is in Georgian
Edit: I've tried loading that text using almost every possible method I've found - loadDataWithBaseURL and loadData methods didn't work either.
Closed: Here is the problem: That version of Android didn't recognize Georgian characters.
You can use HTML codes of UNICODE characters to display them in WebView.
Just replace the characters with their respective html code.
Refer here for Html codes of Georgian characters.
You can use this approach;
String start = "<html><head><meta http-equiv='Content-Type' content='text/html' charset='UTF-8' /></head><body>";
String end = "</body></html>";
webView.loadData(start + YOURCONTENT + end,"text/html; charset=UTF-8", null);
Ensure that your file is actually encoded as UTF-8.
Check if your editor save it as UTF-8. It could be the problem.
Related
I view a lot of htmls with text inside, but there seems to be one html that is not displayed correctly, for some reason all the tilde characters display an unknown character, this is strictly related to that particular html document?
Since all the others htmls are viewed perfectly in webview, i guess it has nothing to do inside android studio?
Intial portion of html document
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html><head>
<link href="Content/watermark.css" rel="stylesheet" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Código de Proceso Penal</title></head>
<script src="Scripts/jquery-2.1.4.min.js"></script>
CADE
This happens due to fact that Webview is not able to detect encoding.
If you are using Webview loadData() or void loadDataWithBaseURL() method, try passing "UTF-8" as encoding, you can check same here, on developer.android.com..
it this doesn't work try with "iso-8859-1" or "iso-8859-15" encoding
Actually I want to load complete site from internet link but i want to load css files from mobile (means not from internet). Because I want to load all page faster using internal local css file.
Example :
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="dist/css/bootstrap.min.css" />
<link rel="stylesheet" href="dist/css/font-awesome.min.css" />
</head>
</html>
So Here I want to Load "bootstrap.min.css" and "font-awesome.min.css" from mobile memory only.
My Android Code :
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
String url = "http://www.MySiteName.com/";
view = (WebView) this.findViewById(R.id.webView);
view.getSettings().setJavaScriptEnabled(true); // Enable JavaScript Support
view.setWebViewClient(new WebViewClient()); // Links open or Navigate in same webView not in Browser
view.loadUrl(url);
}
Please put CSS in assets folder, and refer to CSS by relative path, and load HTML to WebView by loadDataWithBaseURL() method:
if your css file name is mycss.css
StringBuilder data = new StringBuilder();
data .append("<HTML><HEAD><LINK href=\"mycss.css\" type=\"text/css\" rel=\"stylesheet\"/></HEAD><body>");
data .append(tables.toString());
data .append("</body></HTML>");
webView.loadDataWithBaseURL("file:///android_asset/", data .toString(), "text/html", "utf-8", null);
thank you
Because the two other answers are just copy pastas and I happened to have the same issue I will help you with my solution:
You need to specify the file path in the head section of your html file.
Pay attention to the part after href
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="file:///android_asset/bootstrap.min.css" />
<link rel="stylesheet" href="file:///android_asset/font-awesome.min.css" />
</head>
</html>
I just can't get my head around why the other posters just copied and pasted and didn't even read what you were trying to tell them.
I hope this helps.
Be aware that your resources folder can be named differently.
I'm importing HTML to my app with this code:
MyTextView.setText(Html.fromHtml(""));
HTML is importing, but colors are not. How can I import HTML with colors?
Here is some sample HTML:
<!doctype html>
<html>
<head>
<title>MY HTML CODES</title>
</head>
<body>
<h3>MY HTML!</h3>
<p>This HTML <span style="color:#FF0000;"><strong> has a larger .</strong></span></p>
</body>
</html>
Use a spannable:
String myText = "How <i>are</i> <b>you</b>? "+
"<font color='green'>Nice</font> <font color='red'>to</font> meet you!";
MyTextView.setText(Html.fromHtml(myText), TextView.BufferType.SPANNABLE);
Edit: you can get different color using the font tag.
Html.fromHtml() does not support <span> elements or style attributes, let alone <head> or <title> and such.
You will either need to write your own parser for this, or convert this HTML into something that Html.fromHtml() will support (e.g., <font color="...">), or convert this HTML into something that my CWAC-RichTextUtils library will support.
You should display your HTML in a WebView http://developer.android.com/reference/android/webkit/WebView.html
String summary = "<html><body>You scored <b>192</b> points.</body></html>";
webview.loadData(summary, "text/html", null);
I am wondering how do I set the path for WebViews loadWithBaseURL correctly.
What I want to do is, to load html in a webview, that uses resources that are stored on the external storage.
For Example:
<html>
<head>
<style>body{ background-image:url(beach.jpg); }</style>
</head>
<body>
<img src="football.jpg" />
</body>
</html>
Where beach.jpg and ball.jpg are stored directly in the "root" directory of the phones external storage (/sdcard/beach.jpg and /sdcard/ball.jpg)
So I tried to load the content as follows:
String html = "<html> ... example from above ... </html>";
String base = Environment.getExternalStorageDirectory().getAbsolutePath().toString();
webView.loadDataWithBaseURL("file://" + base, html, "text/html", "utf-8", null);
However the path seems to be wrong, because I can't see the image in the webview.
Any suggestions?
Have you enabled file access on the webview?
webView.getSettings().setAllowFileAccess(true);
Additionally, if you are constructing the HTML yourself - you might consider using full paths for the images.
String html = "<html>... <img src=\"file://"+base+"/football.jpg\" />";
Have you give internet permission?
<uses-permission android:name="android.permission.INTERNET" />
These may also help..
Android webview loadDataWithBaseURL how load images from assets?
http://myexperiencewithandroid.blogspot.com/2011/09/android-loaddatawithbaseurl.html
Android v2.2-2.3.5: WebView : loadDataWithBaseURL : will only load page once
My app is using JSoup to download the HTML of a message board page (let's say in this case it is a page containing the posts of a given thread). I'd like to take this HTML, strip out unwanted items, and apply custom CSS to style it to be 'mobile' in a WebView.
Should I inject the styles into the HTML as I process it (since I will be processing it anyway) or is there a good way to add a CSS file to my app's assets and simply refer to it. I figure the latter would be ideal, but unsure how to go about it.
I see hints in WebView's loadDataWithBaseURL that you can refer to local assets, but not sure how to utilize it.
You could use WebView.loadDataWithBaseURL
htmlData = "<link rel=\"stylesheet\" type=\"text/css\" href=\"style.css\" />" + htmlData;
// lets assume we have /assets/style.css file
webView.loadDataWithBaseURL("file:///android_asset/", htmlData, "text/html", "UTF-8", null);
And only after that WebView will be able to find and use css-files from the assets directory.
ps And, yes, if you load your html-file form the assets folder, you don't need to specify a base url.
I assume that your style-sheet "style.css" is already located in the assets-folder
load the web-page with jsoup:
doc = Jsoup.connect("http://....").get();
remove links to external style-sheets:
// remove links to external style-sheets
doc.head().getElementsByTag("link").remove();
set link to local style-sheet:
// set link to local stylesheet
// <link rel="stylesheet" type="text/css" href="style.css" />
doc.head().appendElement("link").attr("rel", "stylesheet").attr("type", "text/css").attr("href", "style.css");
make string from jsoup-doc/web-page:
String htmldata = doc.outerHtml();
display web-page in webview:
WebView webview = new WebView(this);
setContentView(webview);
webview.loadDataWithBaseURL("file:///android_asset/.", htmlData, "text/html", "UTF-8", null);
here is the solution
Put your html and css in your /assets/ folder, then load the html file like so:
WebView wv = new WebView(this);
wv.loadUrl("file:///android_asset/yourHtml.html");
then in your html you can reference your css in the usual way
<link rel="stylesheet" type="text/css" href="main.css" />
It's as simple as is:
WebView webview = (WebView) findViewById(R.id.webview);
webview.loadUrl("file:///android_asset/some.html");
And your some.html needs to contain something like:
<link rel="stylesheet" type="text/css" href="style.css" />
If you have your CSS in the internal file storage you can use
//Get a reference to your webview
WebView web = (WebView)findViewById(R.id.webby);
// Prepare some html, it is formated with css loaded from the file style.css
String webContent = "<!DOCTYPE html><html><head><meta charset=\"UTF-8\"><link rel=\"stylesheet\" href=\"style.css\"></head>"
+ "<body><div class=\"running\">I am a text rendered with INDIGO</div></body></html>";
//get and format the path pointing to the internal storage
String internalFilePath = "file://" + getFilesDir().getAbsolutePath() + "/";
//load the html with the baseURL, all files relative to the baseURL will be found
web.loadDataWithBaseURL(internalFilePath, webContent, "text/html", "UTF-8", "");
Is it possible to have all the content rendered in-page, in a given div? You could then reset the css based on the id, and work on from there.
Say you give your div id="ocon"
In your css, have a definition like:
#ocon *{background:none;padding:0;etc,etc,}
and you can set values to clear all css from applying to the content.
After that, you can just use
#ocon ul{}
or whatever, further down the stylesheet, to apply new styles to the content.
You can Use Online Css link To set Style over existing content.
For That you have to load data in webview and enable JavaScript Support.
See Below Code:
WebSettings webSettings=web_desc.getSettings();
webSettings.setJavaScriptEnabled(true);
webSettings.setDefaultTextEncodingName("utf-8");
webSettings.setTextZoom(55);
StringBuilder sb = new StringBuilder();
sb.append("<HTML><HEAD><LINK href=\" http://yourStyleshitDomain.com/css/mbl-view-content.css\" type=\"text/css\" rel=\"stylesheet\"/></HEAD><body>");
sb.append(currentHomeContent.getDescription());
sb.append("</body></HTML>");
currentWebView.loadDataWithBaseURL("file:///android_asset/", sb.toString(), "text/html", "utf-8", null);
Here Use StringBuilder to append String for Style.
sb.append("<HTML><HEAD><LINK href=\" http://yourStyleshitDomain.com/css/mbl-view-content.css\" type=\"text/css\" rel=\"stylesheet\"/></HEAD><body>");
sb.append(currentHomeContent.getDescription());