Android Chinese characters in WebView - android

I have a html code which I saved in home.txt file and placed it raw folder. Now I want to display the same in a WebView. I used the following code for it.
homeWebview = (WebView) findViewById(R.id.homeWebview);
InputStream fileStream = getResources().openRawResource(R.raw.home);
int fileLen = fileStream.available();
// Read the entire resource into a local byte buffer.
byte[] fileBuffer = new byte[fileLen];
fileStream.read(fileBuffer);
fileStream.close();
displayText = new String(fileBuffer);
//Display content.
homeWebview.loadData(displayText, "text/html", "utf-8");
It is working fine. Now I have to display some Chinese characters in the html. I added the Chinese character in home.txt. Here it is the html code:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Language</title>
<style type="text/css">
body {font-family: HelveticaExt-normal, Helvetica, Arial, sans-serif;margin:0;font-size:20px;color:#000000;}
.mainWrapper {margin:0;}
p {margin: 10px;}
p.bodytext {margin: 0 10px 20px;}
.headerText { background:#eeeeee; background: -webkit-gradient(linear, left top, left bottom, from(#fefefe), to(#e0e0e0));border-top: 2px solid #000000;padding-bottom:7px;}
.headerText p {margin: 10px 10px 0 10px;}
a {color:#324f85;text-decoration:underline;}
.headerbar {border-top:2px solid #000000;border-bottom:2px solid #000000;height:34px;font-family:HelveticaExt-bold, Helvetica, Sans-serif;color:#fff;font-size:18px;padding-left:10px;line-height:34px;margin:0;
background:-webkit-gradient(linear, left top, left bottom, from(#494e4f), to(#787a7c));
}
.navigationList {list-style-type:none;padding:0;margin:0;}
.navigationList li {height:60px;border-bottom:2px solid #e0e0e0;background-position:10px center;background-repeat:no-repeat;padding-left:60px;line-height:28px;
}
</style>
</head>
<body>
<div class="mainWrapper">
<div class="headerText">
<p欢迎您到泰国语言主持人!www.test.com 欲了解更多信息!</p>
</div>
</div>
</body>
Now it is displaying the common characters well, but all the Chinese char is showing as unknown char. What is the prob in my code?

use webView.loadDataWithBaseURL (null, text, "text/html", "utf-8", null);

The home.txt file was not in UTF-8 encoded, I open it in notepad++ and change the encoding. Now it is showing properly.

I think problem in this line:
displayText = new String(fileBuffer);
You should change to
displayText = new String(fileBuffer, "UTF-8");

Related

Add Font Family And Gravity Right To Html

Hello i have this html from webservices and i load it into web view ,, its working good ,, now i need to add my font to this , and make its gravity right !
BodyNot = "<html> <head> <style> body { background-color: clear !important; } p,div,span,li { color:black; font-size:17px !important;background-color: clear !important;} embed, iframe, object, video {height: 160px; width: 355.0px;} img { height: 160px; width: 355.0px; } </style> </head> <body><p>" +
BodyNot +
"</p>" +
"</div></p></body> </html>";
serviceWebView.loadData(BodyNot, "text/html; charset=utf-8", "UTF-8");
serviceWebView.getSettings().setBuiltInZoomControls(true);
serviceWebView.getSettings().setDisplayZoomControls(false);
I'm a little bit guessing but I think that changing <p> to <p align="right"> will do the job.

Android WebView - CSS not working

Using Android 5.0.2...
The following is not showing up properly. I am unable to see any styling.
<!DOCTYPE html>
<html>
<head>
<style>
.bodyBG{
background: linear-gradient(#88DDFF, #55AAFF);
width:100%;
height:100%;
background-position: 0, 0;
background-size: 100%, 100%;
position: absolute;
}
</style>
</head>
<body>
<div class="bodyBG">
...
</div>
</body>
</html>
The WebView is loaded with the HTML like that.
WebView webView = (WebView) findViewById(R.id.webView);
webView.getSettings().setJavaScriptEnabled(true);
InputStream inputStream = context.getResources().openRawResource(R.raw.html_page);
byte[] bytes = new byte[inputStream.available()];
inputStream.read(bytes);
final String html = new String(bytes);
webView.loadData(html, "text/html", null);
webView.addJavascriptInterface(new JSWebApp(), "app");
How to fix it?

android webview doesn't render bullets properly

I have an android email client. When it receives message from an outlook2011 in mac, I get a html data like this:
<html><head></head><body style="word-wrap: break-word; -webkit-nbsp-mode: space; -webkit-line-break: after-white-space; color: rgb(0, 0, 0); font-size: 14px; font-family: Calibri, sans-serif; "><ol><li>One</li><li>Two</li><li>Three</li></ol></body></html>
And it shows the bullets properly.
However, When I receive similar message from Outlook2013 in Windows, I get this html data:
<html>
<head>
<style>
<!--
p.MsoNormal, li.MsoNormal, div.MsoNormal
{margin:0in;
margin-bottom:.0001pt;
font-size:11.0pt;
font-family:"Calibri","sans-serif"}
-->
</style>
</head>
<body lang="EN-US" link="#0563C1" vlink="#954F72">
<div class="WordSection1">
<p class="MsoListParagraph" style="text-indent:-.25in"><span style="">1.<span style="font:7.0pt "Times New Roman"">
</span></span>one</p>
<p class="MsoListParagraph" style="text-indent:-.25in"><span style="">2.<span style="font:7.0pt "Times New Roman"">
</span></span>two</p>
<p class="MsoListParagraph" style="text-indent:-.25in"><span style="">3.<span style="font:7.0pt "Times New Roman"">
</span></span>three</p>
</div>
</body>
</html>
And the webview in my app fails to render the bullets. It shows the text, but no bullets (numbered list).
The webview code is simple one.
private WebView mMessageContentView; //declaration
onCreate() {
mMessageContentView = whatever.getView(view, R.id.message_content);
//setup some zoom settings etc etc
mMessageContentView.setWebViewClient(someWebViewClientInstance);
}
private void setMessageHtml(String html) {
if (html == null) {
html = "";
}
if (mMessageContentView != null) {
mMessageContentView.loadDataWithBaseURL("email://", html, "text/html", "utf-8", null);
}
}
How can I fix this?
I added the following definition in style.css file in assets folder.
p.MsoNormal, li.MsoNormal, div.MsoNormal
{margin:0in;
margin-bottom:.0001pt;
font-size:12.0pt;
font-family:Cambria;}
p.MsoListParagraph, li.MsoListParagraph, div.MsoListParagraph
{margin-top:0in;
margin-right:0in;
margin-bottom:0in;
margin-left:.5in;
margin-bottom:.0001pt;
font-size:12.0pt;
font-family:Cambria;}
.MsoChpDefault
{font-family:Helvetica;}
Then the following code edit to add the external css file.
private void setMessageHtml(String html) {
if (html == null) {
html = "";
}
if (mMessageContentView != null) {
String htmlWithExternalCSS = addStyleDefinition(html);
mMessageContentView.loadDataWithBaseURL("email://", htmlWithExternalCSS, "text/html", "utf-8", null);
}
}
private String addStyleDefinition(String html) {
//insert at the end of <head> tag
String headTag = "<head>";
int index = html.indexOf(headTag);
StringBuffer buff = new StringBuffer(html);
buff.insert(index+headTag.length(), "<link rel=\"stylesheet\" type=\"text/css\" href=\"file:///android_asset/style.css\" />";);
return buff.toString();
}

Asset font is not loaded in android webView

I'm developing an android activity which is loading an HTML file into a webview. However this acitivty is not loading fonts in some phones e.g. HTC Desire or Sony Xperia Z with 4.4 or 4.1 androids. I want to know if i have missed something or it is only depends on phone which i'm testing my app.
private void loadToWebView(String s) {
try {
pageWebView.loadDataWithBaseURL("file:///android_asset/", s,
"text/html", "utf-8", null);
configureWebView(pageWebView);
} catch (Exception e) {
e.printStackTrace();
}
}
here is html header:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<style type="text/css">
#font-face { font-family: 'Persian'; src: url('file:///android_asset/fonts/b_yekan.ttf'); }
#font-face { font-family: 'Persian2'; src: url('file:///android_asset/fonts/b_homa.ttf'); }
#font-face { font-family: 'PersianTitle'; src: url('file:///android_asset/fonts/b_titr.ttf');}
body {font-family: 'Persian';}
h1 {font-family: 'PersianTitle';}
h2 {font-family: 'Persian2';}
</style>
fonts are located in assets/fonts/ like this
First of all, fonts path should be relative to your HTML/CSS file.
So, instead of this:
#font-face { font-family: 'Persian'; src: url('file:///android_asset/fonts/b_yekan.ttf'); }
Use something like this:
#font-face { font-family: 'Persian'; src: url('fonts/b_yekan.ttf'); }
Second, you must make sure that the target you are testing against actually supports Arabic script.
With that, below I am providing a working example.
assets/about_us.html:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<style type="text/css">
#font-face { font-family: 'B Homa'; src: url('fonts/BHOMA.TTF');}
#font-face { font-family: 'B Lotus'; src: url('fonts/BLOTUS.TTF');}
#font-face { font-family: 'B Lotus Bold'; src: url('fonts/BLOTUSBD.TTF');}
</style>
</head>
<body>
<p style="font-family:'B Homa';font-size:20px;">B Homa: مخصص</p>
<p style="font-family:'B Lotus';font-size:20px;">B Lotus: مخصص</p>
<p style="font-family:'B Lotus Bold';font-size:20px;">B Lotus Bold: مخصص</p>
</body>
</html>
BHOMA.TTF, BLOTUS.TTF and BLOTUSBD.TTF are downloaded from bornaray.com and stored in assets/fonts/ folder.
loadToWebView(), it is part of a Fragment, hence getActivity().getAssets():
private void loadToWebView() {
AssetManager assetManager = getActivity().getAssets();
try {
InputStream input = assetManager.open("about_us.html");
byte[] buffer = new byte[input.available()];
input.read(buffer);
input.close();
mWebView.loadDataWithBaseURL("file:///android_asset/",
new String(buffer), "text/html", "UTF-8", null);
} catch (IOException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
}
And the result:
Hope this helps.

Text without css tags in Android

I have an email body and it has html,css tags and I am trying to retrieve only the body text in Android.
I used;
String.valueOf(Html.fromHtml(body);
and that gave me the text with css tags. What should I do for retrieve only the text?
Result is holding in a String
Normally (when I first receive body );
<html>
<head>
<style><!--
.hmmessage P
{
margin:0px;
padding:0px
}
body.hmmessage
{
font-size: 10pt;
font-family:Tahoma
}
--></style></head>
<body class='hmmessage'><div dir='ltr'>
TEXTONE<div>TEXTTWO</div> </div></body>
</html>
After String.valueOf(Html.fromHtml(body);
<!-- .hmmessage P { margin:0px; padding:0px } body.hmmessage { font-size: 10pt; font-family:Tahoma } -->
TEXTONE
TEXTTWO
I just want to receive TEXTONE and TEXTTWO
fromHtml() supports only common HTML tags. HTML comments are not considered as tags, and are ignored. List of the tags, supported by fromHtml() can be found here.
Following code should fix your problem:
s = String.valueOf(Html.fromHtml(body);
s = s.replaceAll("(?s)<!--.*?-->", "");

Categories

Resources