首页 > 代码库 > 在Web页中嵌入QT对象

在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 = http://www.mamicode.com/Number(leftMatrix.getValueAt(i, j)) + Number(rightMatrix.getValueAt(i, j));>

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 &paramNames, const QStringList &paramValues )接口。

可以看看我这部分代码,如下:


#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


在Web页中嵌入QT对象