set the text direction in WebView to RTL - android

how can I change text direction to the Right to Left in webview ?
This is my code
WebView web = (WebView) findViewById(R.id.web);
web.getSettings().setJavaScriptEnabled(true);
web.loadDataWithBaseURL("", myhtml, "text/html", "UTF-8", "");

I think that you need to change the dir="RTL in your HTML code.
for example:
<body dir="rtl">
<p>Some Text that will be RTL aligned</p>
</body>
WebView just allow you to view webpages but doesn't change the text direction. That only depends on the HTML markup in the web page.
If it still doesn't work, you might have issues in your HTML. You can share your code here and I can try to help you further.
Tom.

it work for me:
desc.loadDataWithBaseURL("http://www.atfonline.ir/", "<html dir=\"rtl\" lang=\"\"><body>" + outhtml + "</body></html>", "text/html", "UTF-8", null);

Related

Android load urls after loading custom html in webview

I working on android application , I am loading custom html data with a submit button and form submission .. custom html loads successfully in webview later when I redirect from inside the html content it asks for external browser . How can i fix to be work in same webview ?
here is my code:
wb = (WebView)findViewById(R.id.webv);
wb.getSettings().setLoadsImagesAutomatically(true);
wb.getSettings().setJavaScriptEnabled(true);
wb.setScrollBarStyle(View.SCROLLBARS_INSIDE_OVERLAY);
String customHtml= "<html>...</html>"
wb.loadData(customHtml, "text/html", "UTF-8");
Add this line
wb.setWebViewClient(new WebViewClient());
Use below code;
WebView view = new WebView(MainActivity.this);
view.setVerticalScrollBarEnabled(false);
((LinearLayout)rootView.findViewById(R.id.text_about)).addView(view);
view.loadData(getString(R.string.about), "text/html; charset=utf-8", "utf-8");
in your string.xml
<string name="about"><![CDATA[ <html> <head></head> <body style="text-align:justify;color:#059bba;background-color:#FF‌​F;"> here enter your text </body> </html> ]]> </string>

Showing iframes in android webview correctly

I want to show some html content in webView. Here is my code:
String htmlContent = "..."; // some content here
webViewContent.getSettings().setJavaScriptEnabled(true);
webViewContent.setWebViewClient(new WebViewClient());
webViewContent.setHorizontalScrollBarEnabled(false);
webViewContent.setHorizontalScrollBarEnabled(false);
webViewContent.getSettings().setSupportMultipleWindows(false);
webViewContent.getSettings().setAllowFileAccess(true);
webViewContent.getSettings().setLayoutAlgorithm(WebSettings.LayoutAlgorithm.SINGLE_COLUMN);
webViewContent.setWebChromeClient(new WebChromeClient());
webViewContent.setBackgroundColor(ContextCompat.getColor(context, R.color.background_final_page));
webViewContent.loadDataWithBaseURL(null, htmlContent , "text/html", "UTF-8", null);
It shows text and images well, but when i have iframe in htmlContent , for example
<iframe allowtransparency="true" frameborder="0" scrolling="no" src="https://www.facebook.com/plugins/post.php?href=link" width="100%"></iframe>
webView shows iframe not correctly, with cropped height.When i added height="100%" to iframe code, it has no result. When i set height=600 or height=400, it works, but i cannt know in advance height size of iframe.
So, how i can to fix it?

How to render css file from url in to the webview in android

I have css file url-> http:...../test.css.
Now I have html string htmlString=:
<div class=\"detailInfo\">\r\n<table class=\"leftFloat\">\r\n<tbody>\r\n<tr>\r\\r\n<\/tbody>\r\n<\/table>\r\n<\/div>*
Then,
webView=(WebView) findViewById(R.id.webViewDetials);
webView.setBackgroundColor(0x00000000);
webView.getSettings().setJavaScriptEnabled(true);
webView.loadDataWithBaseURL("http://.../css/test.css", attributes, mime, encoding, null);
I don't know to render above url css in below htmlString html string. any idea.
There are lots of example get css from assets folder but i cannot find load css from url.
I have faced such type of problem, May be helpful for you,
webView=(WebView) findViewById(R.id.webView1);
webView.getSettings().setJavaScriptEnabled(true);
StringBuilder sb = new StringBuilder();
sb.append("<HTML><HEAD><LINK href=\"http://test.com/css/test.css\" type=\"text/css\" rel=\"stylesheet\"/></HEAD><body>");
sb.append(attributes.toString());
sb.append("</body></HTML>");
webView.loadDataWithBaseURL(null, sb.toString(), "text/html", "utf-8", null);
Hopefully, it works.
related Links:
and github plugin: https://github.com/NightWhistler/HtmlSpanner
Android WebView renders blank/white, view doesn't update on css changes or HTML changes, animations are choppy
use Jsoup to cut the CSS t
doc = Jsoup.connect(MyTaskParams.base_URL+MyTaskParams.sub_URL).get();
doc.head().getElementsByTag("link").remove();
doc.head().appendElement("link").attr("rel", "stylesheet").attr("type", "text/css").attr("href", "http://www.xyz.cm/pages/myown.css");

android detect image click inside webview?

i want to detect <img click inside webview ? if so how ? i need an example plz
so far as i know i can detect <a href click inside webview by useing WebViewClient
but i need to detect <img click without using java script can i ?
this is my code :
WebView webview = ( WebView ) findViewById(R.id.wv);
WebSettings settings = webview.getSettings();
settings.setUseWideViewPort(true);
settings.setLoadsImagesAutomatically(true);
String summary = "<html><body>You scored <fieldset><legend>adfadf</legend>"
+ " <a href='http://192.168.1.100/1.jpg'><img src='http://192.168.1.100/1.jpg' /></a> </fieldset> "
+ " <b>192</b> points.</body></html>";
webview.loadData(summary, "text/html", null);
Refer this answer,
Detect click on HTML button through javascript in Android WebView
Same procedure track image click as well. If it doesn't work, create a button in HTML and place the image as background for the button, so you can track the button using answer given in the link.
Thanks.

Rendering HTML in a WebView with custom CSS

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());

Categories

Resources