aardio：用 WebView 模仿 mdict 界面

关注

原创 2023-09-03 08:59:54 1.2k 阅读 AI 写同款· GEO 优化 ›

aardio 用 WebView 模仿 mdict 界面的 dist 发布包 aardio 用 WebView2 模仿 mdict 界面的 dist发布包，源代码 https://blog.csdn.net/belldeep/article/details/132116149 立即下载

aardio：用 WebView 模仿 mdict 界面

main.aardio 见下面

import win.ui;
/*DSG{{*/
mainForm = win.form(text="aardio2";right=889;bottom=467)
mainForm.add(
button={cls="button";text="go";left=335;top=22;right=399;bottom=41;z=2};
button2={cls="button";text="prefix";left=426;top=21;right=497;bottom=40;z=4};
button3={cls="button";text="mp3play";left=533;top=19;right=592;bottom=39;z=5};
button4={cls="button";text="TTS读音";left=621;top=17;right=681;bottom=39;z=7};
custom={cls="custom";text="WebView2";left=165;top=55;right=889;bottom=469;z=3};
edit={cls="edit";left=17;top=19;right=317;bottom=43;edge=1;z=1};
listbox={cls="listbox";left=7;top=56;right=161;bottom=463;edge=1;items={};vscroll=1;z=6}
)
/*}}*/

import web.view;
var wb = web.view(mainForm.custom);

import web.json;
import console;

import io;
import sys;
import fsys.media;
import web.rest.jsonClient;
//创建 HTTP 客户端
var http = web.rest.jsonClient();

var basepath = "D:\mdict\data";

import com.sapi.voice; //导入语音组件
var voice = com.sapi.voice(); //创建语音对象
//导出本地函数给网页 JavaScript
wb.external = {
  speak = function(txt){
	if (string.len(txt) >0) {
		voice.speakAsync(txt,1);//异步非阻塞朗读
		voice.waitOne(); //等待朗读结束
	}		
  }
}

var js = /* var select = window.getSelection();
 var txt = select.toString(); aardio.speak(txt);
*/
//console.print(js);

var baseurl = "http://localhost:8888/";
//响应按钮事件
mainForm.button.oncommand = function(id,event){
	mainForm.button.disabled = true;
	var txt = mainForm.edit.text ;
	var str = string.trim(txt);
	if (string.startWith(str, "http://") or string.startWith(str, "https://")){
		wb.go(str);
	} elseif (string.startWith(str,"D:") or string.endWith(str,".htm")){
		if (io.exist(str)){
			wb.go(str);
		} else {
			mainForm.msgbox(str+" not found.");
		}
	} else {
		url = baseurl + "trans?txt=" + str;
		wb.go(url);
		win.delay(1000);
		//wb.doScript(js);
	}
	mainForm.button.disabled = false;
}

// prefix 前缀匹配
mainForm.button2.oncommand = function(id,event){
	mainForm.button2.disabled = true;
	var txt = mainForm.edit.text;
	var str = string.trim(txt);
	if (string.startWith(str, "http://") or string.startWith(str, "https://")){
		wb.go(str);
	} else {	
		//url = baseurl + "prefix?txt=" + str;
		//发送 GET 请求
		var data = http.get(baseurl++"prefix",{ txt=str });
		//console.dumpJson(data);
		if (data){
			mainForm.listbox.clear();		
			for( k,v in data){
				mainForm.listbox.add(v);
			}
			mainForm.listbox.selIndex = 1;
		} else {
			if (http.statusCode ){
				//服务端返回错误信息
				console.log( http.lastResponse(), "http错误代码:"++ http.statusCode )
			} else {
				//本地内部错误
				mainForm.msgbox("data is null");
			}
		}
	}
	mainForm.button2.disabled = false;
}

// 播放本地 .mp3
mainForm.button3.oncommand = function(id,event){
	mainForm.button3.disabled = true;
	var path = fsys.dlg.open("*.mp3|*.MP3");
	if (io.exist(path)){
		mainForm.edit.text = path;
		if (string.endWith(path, ".mp3")){
        	mp3 = fsys.media(path);
        	if (mp3) mp3.play();
		}
	}
	mainForm.button3.disabled = false;		
}

// TTS 读单词
mainForm.button4.oncommand = function(id,event){
	mainForm.button4.disabled = true;
	var str = mainForm.edit.text;
	if (string.startWith(str, "C:") or string.startWith(str, "D:")){
		if (mp3) mp3.stop();
	}
	wb.doScript(js);
	mainForm.button4.disabled = false;	
}

mainForm.listbox.oncommand = function(id,event){
	if( event == 0x1/*_LBN_SELCHANGE*/ ){
		str = mainForm.listbox.selText;
		url = baseurl + "trans?txt=" + str;
		wb.go(url);
	}
}

//响应回车键弹起的消息
mainForm.edit.wndproc = function(hwnd,message,wParam,lParam){
  if(message == 0x101/*_WM_KEYUP*/ && wParam == 0xD/*_VK_ENTER*/){
	var txt = mainForm.edit.text ;
	var str = string.trim(txt);
	if (string.startWith(str, "http://") or string.startWith(str,"https://")){
		wb.go(str);
	} elseif (string.startWith(str,"D:") or string.endWith(str,".htm")){
		if (io.exist(str)){
			wb.go(str);
		} else {
			mainForm.msgbox(str+" not found.");
		}
	} else {
		url = baseurl + "trans?txt=" + str;
		wb.go(url);
		//win.delay(1000);
		//wb.doScript(js);
	}
  }
  //无返回值则继续调用默认回调函数
}

mainForm.show();
return win.loopMessage();

对这个模仿程序的评价："有点像"跟"是一样"，很多时候有遥远的距离。这个比 tkwebview2 好用

web 服务程序参见：python：mdict + bottle = web 查询英汉词典

编写 index1.html 如下

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">   
    <title>查询英汉词典</title> 
    <script src="jquery-3.2.1.min.js"></script>
<style>
/* portrait 判断为竖屏 */
@media only screen and (orientation: portrait){
     #lab1 {display:none;}
} 
/* landscape 判断为横屏 */ 
@media only screen and (orientation: landscape){
     #lab1 {display: ;} 
}    
</style>
</head>
<body>
  <form name="form" id="form" action="trans" method="POST" target="iframe">
    <label id="lab1">请输入：</label>
    <input type="text" name="txt" id='txt' size="30" placeholder="请输入 a word">
    <input type="submit" name="eng_han" value="英译汉">
    <input type="button" name="btn1" id="btn1" value="前缀查询">
    <input type="button" name="btn2" id="btn2" value="TTS读音" onclick="tts2();">
  </form>
  <p></p>
<div style="float:left; width:100%;">
  <div id="result" style="float:left; width:80%; height:400; border:2px;">
    <iframe name="iframe" id="iframe" width="100%" height="400"> </iframe>
  </div>
  <div id="alist" style="float:right; width:20%; height:400; border:2px;">
  </div>
</div>
  
<script type="text/javascript">
    $(function(){
      $("#btn1").click(function(){
        $.getJSON("/prefix?txt="+$("#txt").val(), function(data){
          var items = [];
          $.each(data, function(i, item){
            if (i<=20){
              items[i] = '<a href="/trans?txt=' +item+ '" target="iframe">' +item+ "</a><br>";
            }
          });
          var a = items.join('\n');
          if (a) $('#alist').html(a);
        })
      })
    });

    // aardio TTS
    function tts() {
        var txt = document.getElementById('txt').value;
        if (txt.length >1) {
          (async ()=>{
              await aardio.speak(txt);
          })();
        }
    }

    // 屏幕双击取词，aardio TTS
    function tts2() {
        // 获取iframe里的选择内容
        var select = window.frames['iframe'].getSelection();
        var txt = select.toString();
        if (txt.length >1) { // alert(txt);
          var input = document.getElementById('txt');
          input.value = txt.trim();
          (async ()=>{
              await aardio.speak(txt);
          })();      
        } else {
          tts();
        }
    }

</script> 
</body>
</html>