有些应用中有追加翻译功能的需求,这回我们说说说如何在Titanium开发的应用当中,实现翻译功能。
我们采用调用Google的翻译API来实现。
(1)首先创建一个WebView用来显示翻译后的文字显示。
var tranlateView = Titanium.UI.createWebView({
top:2,
left:75,
height:30,
width:240,
backgroundColor:'#FFFFFF',
url:'translate.html'
});
(2)在需要翻译功能的处理中追加一下代码
tranlateText.evalJS("javascript:translate('" + inMsg+ "')");
其中的inMsg就是需要翻译的文字。
其中的translate.html代码如下:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("language", "1");
function g_translate(strInput,out){
google.language.translate(strInput, "ja-JP", "en", function(result){
if (!result.error){
document.getElementById(out).innerHTML=result.translation;
}else
document.getElementById(out).innerHTML=strInput;
});
}
</script>
<body style="background-color:#fff">
<div id="show" style="font-size:16px; color:#666;"></div>
<script language="javascript">
function translate(strTranslate)
{
document.getElementById("show").innerHTML="Translating.....";
g_translate(strTranslate, "show");
}
</script>
</body>
</html>
google.language.translate的参数中设置你要翻译的语言。
=========================================
=========================================
说点翻译功能以外的话题,Titanium的evalJS函数是相当的了得,几近恐怖啊!为什么这么说了。因为它能直接操作Webview中的内容,就跟使用自己的Page一样。
比如:
以下是一个简单封装的浏览器,然后打开了一个通过日本的电车站名查询的页面。
如果我们在代码的最后追加一下代码:
webView.addEventListener('load',function(e){
webView.evalJS( ' $("a:contains(\'上野駅\')").text("蒲田駅"); ' );
});
那么我们在运行一次,你将看到的是:
上野站已经被改成了莆田站了。
这是一个简单的例子,如果有人能够灵活的使用该功能,你将会有一些意想不到的收获!!