QT使用miniblink内嵌html网页并调用其js方法

前言: qt虽然是有自己的QWebEngineView控件可以达成内嵌HTML代码显示的效果,但是其浏览器内核有点老了,且cpp和js通信还需QWebChannel(我觉得这个实在难写也难理解),故找到了一个非常好用且开源的浏览器控件miniblink(简称mb)

miniblink的下载和使用

详情可以看看这个帖子 qt中使用miniblink总结 中的新建包装类的上面的内容,关于那个node.dll,其实不需要刻意放在那个路径下,main函数引入的时候设置成绝对路径即可

wkeSetWkeDllPath(L"F:/Demo/QT Demo/WebTest/node.dll");
// 参数类型为const wchar_t*, 因此字符串前需加上一个L

miniblink内嵌HTML网页

/* webView在头文件里面声明了是一个wkeWebView类型wkeCreateWebWindow是创建一个带真实窗口的wkeWebView第一个参数wkeWindowType type:WKE_WINDOW_TYPE_POPUP:      普通窗口WKE_WINDOW_TYPE_TRANSPARENT:透明窗口。mb内部通过layer window实现WKE_WINDOW_TYPE_CONTROL:    嵌入在父窗口里的子窗口。此时parent需要被设置第二个参数是依附parent窗口的句柄, 在QT里面可以调用窗口的winID()方法获取
*/
webView = wkeCreateWebWindow(WKE_WINDOW_TYPE_CONTROL, (HWND)ui->mapWidget->winId(), 0, 0, 1200, 1000);
//显示窗口
wkeShowWindow(webView, TRUE);
//将一段HTML代码载入到webView窗口(此处我是使用的高德地图的JS API做展示)
QFile file("F:/Demo/QT Demo/WebTest/maphtml/map.html");
file.open(QIODevice::ReadOnly);
wkeLoadHTML(webView, file.read(file.bytesAvailable()));

QT通过miniblink的API调用内嵌的HTML里面的JS方法

我们需要用到mb里面的这个API

jsValue wkeRunJS(wkeWebView webView, const utf8* script)
/*运行一段js。返回js的值jsValue。jsValue是个封装了内部v8各种类型的类,
如果需要获取详细信息,有jsXXX相关接口可以调用。见下述。参数:略*/

此时我在HTML代码中写了一段这样的JS方法

function printInformation(information) {alert(information);
}

然后再QT中使用一个信号槽来到达JS显示lineEdit中文字的效果

connect(ui->callJSBtn, &QPushButton::clicked, this, [this]()
{if(!ui->lineEdit->text().isEmpty()){/*注意这里lineEdit的text()作为传入的字符串参数,一定要加上引号否则JS里面无法判断这是个什么类型,可能会将其当成一个undefined的变量名*/QString code = "printInformation(\"" + ui->lineEdit->text() + "\");";wkeRunJS(webView, code.toUtf8());}
});

效果图
在这里插入图片描述


本文来自互联网用户投稿,文章观点仅代表作者本人,不代表本站立场,不承担相关法律责任。如若转载,请注明出处。 如若内容造成侵权/违法违规/事实不符,请点击【内容举报】进行投诉反馈!

相关文章

立即
投稿

微信公众账号

微信扫一扫加关注

返回
顶部