在Web页中嵌入QT对象
根据最近读的QT高级编程，原来QT是可以在HTML中嵌入对象的，确实很厉害。于是自己动手写了一个Demo，中途出现了一点点问题，js执行有问题，看来要提交javascript了，我感觉python也应该适当提高提高了。下面要重点提一下我犯的错误。
<HTML>
<HEAD>
<META NAME="GENERATOR" Content="Microsoft Visual Studio 8.0">
<TITLE></TITLE>
</HEAD>
<BODY>
<!-- 添加界面元素 -->
<object type="application/x-qt-plugin" classid="QLabel" objectName="title" pos="0, 0" text="<strong><em><font size=32><center>计算矩阵</center></font></em></strong>">
Qt's Plugin Load Failed</object>
<object type="application/x-qt-plugin" classid="MatrixWidget" objectName="leftOper" <strong>id="leftMatrix"</strong> pos="0, 200" size="300, 300">Qt's Plugin Load Failed</object>
<object type="application/x-qt-plugin" classid="QLabel" objectName="plusSymbol" pos="310, 510" text="<strong><em><font size=32><center>+</center></font></em></strong>">
Qt's Plugin Load Failed</object>
<object type="application/x-qt-plugin" classid="MatrixWidget" objectName="rightOper" <strong>id="rightMatrix"</strong> pos="330, 520" size="300, 300">Qt's Plugin Load Failed</object>
<object type="application/x-qt-plugin" classid="QLabel" objectName="equalSymbol" pos="350, 530" text="<strong><em><font size=32><center>=</center></font></em></strong>">
Qt's Plugin Load Failed</object>
<object type="application/x-qt-plugin" classid="MatrixWidget" objectName="result" <strong>id="resultMatrix"</strong> pos="330, 520" size="300, 300">Qt's Plugin Load Failed</object>
<object type="application/x-qt-plugin" classid="QPushButton"<strong> id="btnCalc"</strong> pos="350, 550" size="50, 25" text="计算"></object>
<!-- 脚本执行部分 -->
<script>
function calcResult() {
//rowCount和columnCount是属性，不是slots不能以调用的形式来书写，不能带()
for (var i = 0; i < leftMatrix.rowCount; ++i) {
for (var j = 0; j < leftMatrix.columnCount; ++j) {
var value = Number(leftMatrix.getValueAt(i, j)) + Number(rightMatrix.getValueAt(i, j));
resultMatrix.setValueAt(i, j, value);
}
}
}
// var rowIndex = 0;
// var columnIndex = 1;
// var varvarlue = leftMatrix.getValueAt(rowIndex, columnIndex) + rightMatrix.getValueAt(rowIndex, columnIndex);
// btnCalc.text = "开始计算";
leftMatrix.setValueAt(0, 1, "1");
leftMatrix.setValueAt(0, 0, 500);
rightMatrix.setValueAt(0, 1, "5");
//resultMatrix.setValueAt(1, 1, Number(varvarlue));
calcResult();
// leftMatrix.itemChanged.connect(calcResult);
// rightMatrix.itemChanged.connect(calcResult);
btnCalc.clicked.connect(calcResult);
</script>
</BODY>
</HTML>
1.在html中增加对象的时候，要指明object的ID，ID是在javascript中使用的，特别想提醒的就是在嵌入QT对象的时候尽量保证你编写的属性名称和QT属性机制中的属性
对应起来这样在组装对象的时候就变得非常简单了，因为QT的属性机制是支持动态设置的，可以直接根据属性的名称来设置属性，所以这里就可以排上用上了，这个机制
其实跟QT的Script机制是一样一样的。
2.脚本中属性的调用和QT公开槽函数的调用是不一样的。属性调用的时候不需要加()，我写的脚本一直执行不成功就是因为在rowCount和columnCount后面增加了()而导致的。
3.JS与QT信号的连接，连接方式： JS中的id名称.信号名称.connect(JS的函数)
4.对于object的解析，可以扩展QWebPage，并重写
createPlugin( const QString &classid, const QUrl &url, const QStringList ¶mNames, const QStringList ¶mValues )接口。
可以看看我这部分代码，如下：
#include "webpage.h"
#include "matrixwidget.h"
#include <QtUiTools/QUiLoader>
WebPage::WebPage(QObject *parent)
: QWebPage(parent)
{
}
WebPage::~WebPage()
{
}
//根据classid来选择加载
QObject * WebPage::createPlugin( const QString &classid, const QUrl &url, const QStringList ¶mNames, const QStringList ¶mValues )
{
QWidget *widget = NULL;
QUiLoader uiLoader;
if (uiLoader.availableWidgets().indexOf(classid) != -1)
{
widget = uiLoader.createWidget(classid, view());
}
else if(classid == "MatrixWidget")
{
widget = new MatrixWidget(view());
}
if (widget)
{
//getPropertyValue(paramNames, "height");
//paramNames.indexOf("height");
//保证paramName和QT属性机制中的属性保持一致即可自动设置数据
for (int i=0; i<paramNames.size(); ++i)
{
widget->setProperty(paramNames[i].toLocal8Bit(), QVariant(paramValues[i]));
}
}
return widget;
}
QVariant WebPage::getPropertyValue( const QStringList ¶mNames, const QString& propertyName )
{
return QVariant();
}
全部代码可以在我的资源中下载：
http://download.csdn.net/download/davidsu33/8042983
郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。
