I have a code to speak a text passed from html. Which I was able to make it working using below code.
Here is the code:
tts = new TextToSpeech(this, this);
myWebView = (WebView) findViewById(R.id.webviewid);
//The html text is from the server.
myWebView.loadDataWithBaseURL(null,
"<html>" +
"<head><meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, user-scalable=no\">" +
"</head>" +
"<body>" +
"<input class=\"textBox\" id=\"pass\" type=\"text\" maxlength=\"30\" required/>" +
"<input type=\"button\" value=\"Say hello\" onClick=\"androidSpeak('Hello Android!')\" />" +
"<script type=\"text/javascript\">" +
" function androidSpeak(texttospeak) {" +
" Android.textToSpeak(texttospeak);" +
" }" +
"</script>" +
"</body>" +
"</html>", "text/html", "UTF-8", null);
WebSettings webSettings = myWebView.getSettings();
webSettings.setJavaScriptEnabled(true);
myWebView.addJavascriptInterface(new WebAppInterface(this), "Android");
Here is my Java script interface:
protected class WebAppInterface {
Context mContext;
/** Instantiate the interface and set the context */
WebAppInterface(Context c) {
mContext = c;
}
/** Show a toast from the web page */
@JavascriptInterface
public void textToSpeak(String texttospeak) {
Toast.makeText(mContext, texttospeak, Toast.LENGTH_SHORT).show();
speakOut(texttospeak);
}
}
private void speakOut(String text) {
tts.speak(text, TextToSpeech.QUEUE_ADD, null);
}
The above code works as expected. My question is how can I invoke TTS or any other feature (like alarm or making a call etc) through javascript. That means is it possible to call tts.speak() method from javascript. Or in another way, I wanted to invoke androids TTS through javascript instead of creating Java Script Interface (like above). This way I don't have to give an update to user for every feature that I am going to add.
Example: Please Note: Below is an example, which I know is incorrect. This is to give you an overview what I need to.
//The html text is from the server.
myWebView.loadDataWithBaseURL(null,
"<html>" +
"<head><meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, user-scalable=no\">" +
"</head>" +
"<body>" +
"<input class=\"textBox\" id=\"pass\" type=\"text\" maxlength=\"30\" required/>" +
"<input type=\"button\" value=\"Say hello\" onClick=\"androidSpeak('Hello Android!')\" />" +
"<script type=\"text/javascript\">" +
" function androidSpeak(texttospeak) {" +
" tts = new TextToSpeech(this, this);" +
" tts.speak(text, TextToSpeech.QUEUE_ADD, null);" + <<< directly invoke the android's TTS.
" }" +
"</script>" +
"</body>" +
"</html>", "text/html", "UTF-8", null);
Is there any plugin that I need to add. Please let me know. Any help is appreciated.
You may take a look at Intel XDK: https://software.intel.com/en-us/html5/tools and download it from http://xdk-software.intel.com/. It provides a cordova build option which you mentioned in your reply to a previous answer: https://software.intel.com/en-us/html5/articles/using-the-cordova-for-android-ios-etc-build-option
Thanks