[Webkit]Qt开发所需的基本知识

一、QT webkit简介

1.Qt

Qt（发音同 cute）是一个跨平台的C++应用程式开发框架，有时又被称为C++部件工具箱。Qt被用在KDE桌面环境、Opera、Google Earth、Skype、Adobe Photoshop Album和VirtualBox的开发中。它是挪威Qt Software 的产品，2008年6月17日被芬兰的诺基亚（Nokia）公司收购，以增强该公司在跨平台软件研发方面的实力。

 

2.Webkit

WebKit是Mac OS X v10.3及以上版本所包含的软件框架（对v10.2.7及以上版本也可通过软件更新获取）。同时，WebKit也是Mac OS X的Safari网页浏览器的基础。WebKit是一个开源项目，主要由KDE的KHTML修改而来并且包含了一些来自苹果公司的一些组件。

传统上，WebKit包含一个网页引擎WebCore和一个脚本引擎JavaScriptCore，它们分别对应的是KDE的KHTML和KJS。不过，随着JavaScript引擎的独立性越来越强，现在WebKit和WebCore已经基本上混用不分（例如Google Chrome和Maxthon 3采用V8引擎，却仍然宣称自己是WebKit内核）。

 

3.Qt webkit

简单的说，Qt webkit就是Qt对Apple公司webkit的支持而开发的库，主要包括以下几个类

QWebDatabase

Access to HTML 5 databases created with JavaScript

QWebFrame

Represents a frame in a web page

QWebHistory

Represents the history of a QWebPage

QWebHistoryInterface

Interface to implement link history

QWebHistoryItem

Represents one item in the history of a QWebPage

QWebHitTestResult

Information about the web page content after a hit test

QWebPage

Object to view and edit web documents

QWebPluginFactory

Creates plugins to be embedded into web pages

QWebSecurityOrigin

Defines a security boundary for web sites

QWebSettings

Object to store the settings used by QWebPage and QWebFrame

QWebView

Widget that is used to view and edit web documents

二、QWebView Class介绍

QWebView类是Qt webkit模块中最常用到的类之一。它用来创建一个可以view以及edit文档的widget。也就是说，我们可以通过QWebView来查看和编辑网页（编辑网页视具体情况实现）。同时，QWebView可以包含QWebPage和QWebFrame的对象，它们三者的关系可以表示为：

 

关系图

QWebPage和QWebFrame将会在后面介绍。

 

三、QWebPage Class介绍

QWebPage类和QWebView类一样，都用于查看和编辑网页，不同的是，从两者的包含关系上我们可以知道，QWebView可以用于打开多个网页，而里面具体的网页对象就是QWebPage。QWebPage通过mainframe（）方法可以得到More QWebView-like functions，如load(), setUrl() 和 setHtml()。

 

 

四、QWebFrame Class介绍

QWebFrame可以算是QWebPage的元对象了，每一个QWebPage至少有一个QWebFrame，它被称作QWebPage的mainframe，通过QWebPage:: mainframe()方法得到。换言之，QWebFrame依附QWebPage存在。通过调用QWebFrame的page()方法返回它所在的QWebPage对象。而zoomFactor()方法则实现了网页内容的缩放。

 

五、QWebDataBase Class介绍

QWebDataBase提供了对基于JavaScript创建的HTML 5数据库。新一代的HTML 5标准也提供对基于javaScript SQL数据库访问的支持。QWebDataBase就是这些数据库的C++接口。关于HTML 5的详情，可以参见HTML 5 Draft Standard.

 

 

六、QWebHistory Class介绍

顾名思义，QWebHistory用来表示QWebPage的历史记录。通过创建相应的Items实现前进、后退等操作。与之相关的类为QWebHistoryItem和QWebHistoryInterface.

 

 

七、QWebHistoryInterface Class介绍

QWebHistory用来表示QWebPage的历史记录，不过历史记录却是通过QWebHistoryInterface记录下来的。当调用addHistoryEntry(const QString & url)方法后，访问的网页地址就被记录到visited pages里了。

 

 

八、QWebHistoryItem Class介绍

QWebHistoryItem类用于创建QWebHistory的Items. 加上QWebHistoryInterface类，实现了浏览器的历史记录功能。

 

 

九、QWebHitTestResult class介绍

首先要明白HitTest的含义。HitTest通常被称为碰撞测试或相交测试，用于测试两个物体或目标(对象)间是否重叠和相交。可以用来判断网页内容是否用选中、是否能编辑、是否有超链接等等。

 

 

十、QWebPluginFactory Class介绍

QWebPluginFactory是QWebPage的插件工厂，用于创建嵌入web pages的插件。QWebPluginFactory使用的前提是在QWebSettings中Plugins被设定为enabled。

插件可以用于实现对多媒体类型（MIME）数据的应用。比如在网页中显示pdf文档或flash动画。不过，现阶段Qt WebKit还不支持对flash的应用，如果想要在Qt WebKit中使用flash，可以参考使用一些开源的flash库，比如gnash。想更进一步了解MIME和gnash，请点击MIME数据类型和gnash应用。

 

 

十一、QWebSecurityOrigin class介绍

QWebSecurityOrigin用于定义网站的安全边界（Security boundary），它包含了一个网站host name, scheme, 和port number，用于阻止非法权限对网站数据的访问。

 

 

十二、QWebSettings Class介绍

用于储存QWebPage和QWebFrame的设置。每一个QWebPage都有它的QWebSettings对象，用于对网页设置信息的存储。如果一个setting没有被配置，那么它将通过QWebSettings::globalSettings()寻找一个global settings.网页的属性通过枚举类型enum QWebSettings::WebAttribute定义.

 

一.首先，让我们展示一幅QWebView的网页效果图：

 

想要实现上面的效果很简单，你只需要完成三个步骤

1.建立一个QWebView对象,QWebView *view = new QWebView(parent);其中parent为父类.如果想要QWebView为top window，可以设置parent = 0
2.调用load或setUrl方法设置要显示的网页.注意网页的格式以http://开头
3.调用show方法显示QWebView
 
完整的代码为：
QWebView *view = new QWebView(parent);        //步骤1
view->load(QUrl("http://qtsoftware.com/"));   //步骤2
view->show();  //步骤3
 

 

二.QWebView除了用load方法设定网页路径外，也可以使用setHtml方法加载html格式的网页，这里我们以加载google地图插件为例.最后的效果图为：

 

 

1.第一步，我们通过google地图获取插件的代码。进入google地图页面，点击链接，获取代码
 

 
2.获取到得代码为：
<iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0"
src="http://ditu.google.cn/maps?hl=zh-CN&amp;q=%E5%9C%B0%E5%9B%BE&amp;ie=UTF8&amp;
brcurrent=3,0x31508e64e5c642c1:0x951daa7c349f366f,0%3B5,0,0&amp;ll=38.005263,115.357367&amp;
spn=15.390188,22.535491&amp;output=embed"></iframe>
<br /><small><a href="http://ditu.google.cn/maps?hl=zh-CN&amp;q=%E5%9C%B0%E5%9B%BE&amp;
ie=UTF8&amp;brcurrent=3,0x31508e64e5c642c1:0x951daa7c349f366f,0%3B5,0,0&amp;
ll=38.005263,115.357367&amp;spn=15.390188,22.535491&amp;source=embed" style="color:#0000FF;text-align:left">查看大图</a>
</small>
我们可以删去br、small和a标记，最后在代码前后添加<html></html>标记
将文件保存为*.html（注：删除的部分为屏蔽google地图的右键效果，可以保留）
 
3.调用QWebView的setHtml方法设定上述文件的路径，然后用show方法显示google地图
 
================================================================================================

关于QWebView的信号与槽，下面列出：

Public Slots

  • void back ()
  • void forward ()
  • void print ( QPrinter * printer ) const
  • void reload ()
  • void stop ()
  • 19 public slots inherited from QWidget
  • 1 public slot inherited from QObject
  • void iconChanged ()
  • void linkClicked ( const QUrl & url )
  • void loadFinished ( bool ok )
  • void loadProgress ( int progress )
  • void loadStarted ()
  • void selectionChanged ()
  • void statusBarMessage ( const QString & text )
  • void titleChanged ( const QString & title )
  • void urlChanged ( const QUrl & url )
  • 1 signal inherited from QWidget
  • 1 signal inherited from QObject

Signals

1.loadStarted、loadFinished和loadProgress信号介绍

loadStarted信号当有新的web page请求时发出。而我们关注更多的是loadProgress信号。loadProgress信号在load web page的一个元素成功时发出。这里的元素指代image、text、script对象。loadProgress的value表明了网页load的进度，范围从0-100。我们可以看出，QWebView封装了获得load进度值的计算方法。我们可以连接信号，对进度条赋值
connect(webView, SIGNAL(loadProgress(int)), SLOT(setProgress(int)));
其中setProgress方法需要自己定义。
loadFinished信号在web page load完成后发送。

 

 

2.iconChanged、selectionChanged、titleChanged和urlChanged信号介绍

当web page显示网页的icon、selected text、title或url改变时发送

 

3.back、forward、reload、print、stop槽介绍

back、forward对应QWebPage的后退与前进操作，相当于webView->page()->triggerPageAction(QWebPage::Back);和
webView->page()->triggerPageAction(QWebPage::Forward);
其中QWebView通过调用page方法返回current page. QWebPage::Back和QWebPage::Forward在QWebPage::WebAction中定义
 
Reload与stop槽为重载与停止load web page
 
Print槽用于将main frame通过QPrinter paints出来。这里可以更进一步了解QWebView、QWebPage与QWebFrame三者的层次结构

 

 

4.linkClicked与statusBarMessage信号

首先，linkClicked信号能够发送的前提是对应的QWebPage::linkDelegationPolicy被设定为允许链接
而statusBarMessage信号发生在status text改变时
 
 
========================================
 

本篇为QWebView应用的扩展，除了之前的QWebView相关知识，还涉及到QPainter及QPaintEvent的应用。本篇实现的效果为google map的夜视(night-mode)功能，如下图

 

夜间模式

 

实现night-mode的原理涉及到反色等知识，不过编写起来却十分简单。你可以尝试打开“画图”等图片编辑工具，然后选中反色，得到的效果即我们现在要完成的。

在QWebView的反色处理上，我们通过重写paintEvent函数实现：

1.首先调用QWebView的paintEvent方法将我们需要显示的图片(内容)paint好

2.QPaint提供了反色的接口setCompositionMode。它是一系列图像构成的接口，我们选择QPainter::CompositionMode_Difference实现整个画面的反色效果

3.设置好反色效果后，调用fillRect方法填充所需变化的区域。

完整的代码为(paintEvent，省略其他变量定义)

 

void webViewClass::paintEvent(QPaintEvent *event)

{

QWebView::paintEvent(event);

if(isNightMode)

{

QPainter p(this);

//p.setBackgroundMode(Qt::OpaqueMode);

p.setCompositionMode(QPainter::CompositionMode_Difference);

p.fillRect(event->rect(), Qt::white);

}

}

其中在fillRect中，因为CompositionMode_Difference模式指的是一种异或(xor)运算，因为white的颜色是全1，所以和原有图像的运算结果刚好是按位取反的功能，做到了反色效果。

posted @ 2014-06-06 09:59  It's_Lee  阅读(765)  评论(0)  编辑  收藏  举报