Highlight the selected text in webview. [Android] - android

I have certain text in the web view. I can select those text . I want to highlight those text but I have no idea how to do it. Anyone having any idea about it, please help! Thanx!

you need to run java script
public static String Highlightscript = " <script language=\"javascript\">" +
"function highlightSelection(){" +
"var userSelection = window.getSelection();" +
"for(var i = 0; i < userSelection.rangeCount; i++)"
+ " highlightRange(userSelection.getRangeAt(i));" +
"}" +
"function highlightRange(range){"+
"span = document.createElement(\"span\");"+
"span.appendChild(range.extractContents());"+
"span.setAttribute(\"style\",\"display:block;background:#ffc570;\");"+
"range.insertNode(span);}"+
"</script> ";
and
webView.loadUrl("javascript:highlightSelection()");
make sure you enabled javascript
WebView myWebView = (WebView) findViewById(R.id.webview);
WebSettings webSettings = myWebView.getSettings();
webSettings.setJavaScriptEnabled(true);

In Android 4.1(jellybean), WebView.findAll() is deprecated, we should use WebView.findAllAsync instead.
reference
Wish this help:)

Related

jqmath can not render matrix?

I want to write table(matrix) with jqmath but the output is not correct .
I copy jqmath example .
there is my code :
webView = (WebView) findViewById(R.id.wv);
WebSettings settings = webView.getSettings();
settings.setJavaScriptEnabled(true);
String path="file:///android_asset/mathscribe/";
String js = "<html><head>"
+ "<link rel='stylesheet' href='"+path+"jqmath-0.4.3.css'>"
+ "<script src='"+path+"jquery-1.4.3.min.js'></script>"
+ "<script src='"+path+"jqmath-etc-0.4.3.min.js' charset=\"utf-8\"></script>"
+ "</head><body>"
+ "<script>var s = '$(\\table \\ cos θ, - \\sin θ; \\sin θ, \\cos θ)$ gives a rotation by $θ$';M.parseMath(s);document.write(s);</script>"
+ "</body>";
webView.loadDataWithBaseURL("file:///android_asset/mathscribe/", js, "text/html", "UTF-8", null);
the output is linear matrix like below :
I suggest that combine slash and t (\t)in " var s = '$( \table \ cos θ, - \sin θ; \sin θ, \cos θ) " cause this problem because the t character is gone and first line moved to right.
How I can solve this problem?
SOlVED
if I replace every slash with 4 slash the result is correct ....
I think it's best to replace the line:
+ "<script>var s = '$(\\table \\ cos θ, - \\sin θ; \\sin θ, \\cos θ)$ gives a rotation by $θ$';M.parseMath(s);document.write(s);</script>" +
with:
+ "$(\\table \\cos θ, - \\sin θ; \\sin θ, \\cos θ)$ gives a rotation by $θ$" +
or:
+ "$(`table `cos θ, - `sin θ; `sin θ, `cos θ)$ gives a rotation by $θ$" +

How to control webview in android to display proper google visualization maps?

I am trying to display geo map using google's visualization in android's webview
My web view settings are as follows -
webView.getSettings().setJavaScriptEnabled(true);
webView.getSettings().setBuiltInZoomControls(true);
webView.getSettings().setUseWideViewPort(true);
webView.requestFocusFromTouch();
webView.requestFocus(View.FOCUS_DOWN);
webView.getSettings().setLoadWithOverviewMode(true);
webView.setInitialScale(getScale());
//webView.setWebViewClient(new WebViewClient());
webView.setWebChromeClient(new WebChromeClient());
// String containing js to draw map using google's Visualization:Geochart
String js = "<html><head>" +
"<script type='"+"text/javascript"+"' src='"+"https://www.google.com/jsapi"+"'></script>"+
"<script type='"+"text/javascript"+"'>" +
"google.load('"+"visualization"+"', '"+"1"+"', {packages:['"+"geomap"+"']});" +
"google.setOnLoadCallback(drawRegionsMap);" +
" function drawRegionsMap() {" +
" var data = google.visualization.arrayToDataTable([" +
"['Country', '"+name+"']," + build +
"]);" +
"var options = {colors: ['"+startColor+"', '"+endColor+"']};" +
"var chart = new google.visualization.GeoChart(document.getElementById('regions_div'));" +
"chart.draw(data, options);" +
"}" +
"</script>" +
"</head>" +
"<body bgcolor='#E6E6FA'>" +
"<div id='"+"regions_div"+"' style='"+"width:100%; height: 100%;"+"'></div>" +
"</body>" +
"</html>";
The code is working fine . I get different regions of map with different colors. But I need that only web view get translated in landscape mode by keeping default screen orientation of fragment (activity) as POTRAIT . Also when I click on region a popup displays the proper name of country, but popup also opens outside the region on click on any where in the map. Even I tried on chrome browser in mobile it has same problem. Where as the same visualization is working fine on normal web browser on computer.

HTML page in WEBVIEW is slow and laggy

I am working on an jQuery Mobile application which uses HTML pages for UI
There are some JS function through which i call some native functions. There are some popups and dialogs with input fields, but when i open some dialog or popup in html the logCat gives me this warning
W/webview_proxy(8104): java.lang.Throwable: Warning: A WebView method was called on thread
'WebViewCoreThread'. All WebView methods must be called on the UI thread. Future versions of
WebView may not support use on other threads.
and while entering values in these input fields page and keyboard starts blinking.
that's how i am calling theses native functions
JS Function
function SettingMethod()
{
activity.setSettings();
}
Android Method
#JavascriptInterface
public void setSettings() {
SharedPreferences settings = PreferenceManager
.getDefaultSharedPreferences(MainActivity.this);
final String webServiceURL = settings.getString("URL", "");
final String InputFolder = settings.getString("INPUTFOLDER", "");
final String OutPutFolder = settings.getString("OUTPUTFOLDER", "");
index.loadUrl("javascript:setSettings('" + webServiceURL + "','"
+ InputFolder + "','" + OutPutFolder + "')");
}
how can i remove this lag ?
Problem solved by using
runOnUiThread(new Runnable() {
public void run() {
index.loadUrl("javascript:setSettings('" + webServiceURL + "','"
+ InputFolder + "','" + OutPutFolder + "')");
}
});

Html Checkbox in android webview

I want to know:-
In my project i am using html content and displaying them in android webview. and i am using eclipse ide. this is tiny code.
"<form name =\"frm\">"+
"<input type=\"checkbox\" name =\"First\" value =\"xyz\">xyz<br>"+
"<input type=\"checkbox\" name =\"First\" value =\"abc\">abc<br>"+
"</form>"
my question is how can i get check box state .its checked or unchecked.
or how can i catch the state in my java code.
UPD:-
public String html = "<form name =\"frm\">"+
"<input type=\"checkbox\" name =\"First\" value =\"xyz\">as<br>"+
"<input type=\"checkbox\" name =\"Second\" value =\"zyx\">as<br>"+
"<input type =\"button\" onclick =\"callDoSomething()\"><br>"+
"</form>" +
"<script type=\"text/javascript\">"+
"function callDoSomething() {"+
" var theName = document.frm.First.value;"+
"alert('theName ')"+
"}"+
"</script>";
First, both of your checkboxes are named "First", you should probably name second one "Second". If you want to search checkboxes by value - just add a simple js for loop.
Assuming you want to get the results from your Android code (as opposed to JS event like clicking a button), here's how you get Java boolean value for you checkbox by name:
// assuming your activity is MyActivity, target checkbox name
// is in the targetCheckboxName var and webView has the document
// loaded already
Object jsi = new Object() {
#JavascriptInterface
public String reportCheckboxState(String name, boolean isChecked) {
new AlertDialog.Builder(MyActivity.this).setMessage(name + " is " +
isChecked).create().show();
}
};
webView.addJavascriptInterface(jsi, "injection");
webView.loadUrl(
"javascript:injection.reportCheckboxState(frm." + targetCheckboxName +
".name, frm." + targetCheckboxName + ".checked);"
);
But really, it's a very simple trick. Judging by comments to the question, you should probably read up on JavaScript and WebView.addJavaScriptInterface()

Implementing HTML book-like pagination

I found a solution to this somewhat at HTML book-like pagination I am not being able to implement the same on the android using eclipse 3.6. The code I am using is as follows:
mWebView.setWebViewClient(new WebViewClient() {
public void onPageFinished(WebView view, String url) {
// Column Count is just the number of 'screens' of text. Add one for partial 'screens'
int columnCount = Math.floor(view.getHeight() / view.getWidth())+1;
// Must be expressed as a percentage. If not set then the WebView will not stretch to give the desired effect.
int columnWidth = columnCount * 100;
String js = "var d = document.getElementsByTagName('body')[0];" + "d.style.WebkitColumnCount=" + columnCount + ";" + "d.style.WebkitColumnWidth='" + columnWidth + "%';";
mWebView.loadUrl("javascript:(function(){" + js + "})()");
}
});
mWebView.loadUrl("file:///android_asset/chapter.xml");
The LogCat shows that the width and height displayed to me are 0. Am I putting it at the wrong place? Any help would be appreciated.
Thanks
i found this solution and it worked for me. Try Nacho L solution on this HTML book-like pagination?

Categories

Resources