What can QT WebKit do?

What can QT WebKit do?

Look at my other nest. There may be unexpected surprises. ^_^ www.devres.info From: http://software.intel.com/zh-cn/blogs/2010/06/08/qt-webkit-qt-webkit/ Author: the proposition of Dawei Cheng Dawei (Intel) is not very well answered, because the QT library is constantly updated, and the WebKit project in KDE is also released with a new version of release. As far as I know, I would like to share with you whether it is available or not. Let's take a look at what qtwebkit can do. (joewan Note: I like to know the history of what I do first.) WebKit is an open-source browser engine, the corresponding engines include gecko (the typographical engine used by Mozilla Firefox) and Trident (also known as mshtml, the typographical engine used by IE ). WebKit is also the name of the Apple Mac OS x System engine Framework version. It is mainly used in Safari, dashboard, mail, and other Mac OS X programs. The WebCore typographical engine and jscore engine contained in WebKit come from KDE's khtml and KJS. After Apple compared gecko and khtml, it still chose the latter, it has a clear source code structure and extremely fast rendering speed. This section is taken from encyclopedia. Currently, the WebKit project is developed by http://webkit.org/organization. View the website for details! Let's take a look at the WebKit architecture: qtwebkit is the platform from WebKit porting to QT. Let's take a look at the architecture of QT WebKit. The two figures show the differences between QT WebKit and WebKit: 1. text handling, painting, and networking use the QT kernel 2. Which of the following advantages can QT integration WebKit bring when it is easier to use QT APIs: 1. quickly create an application that contains real-time network content and services 2. Integrate network and local content in an application 3. Run developed web applications on different platforms. Let's take a look at the architecture of web-developed applications and how to develop them. In the following three layers, C ++ code is used for development. At the application layer, QT can support the most commonly used Webpage Design sanjianke (HTML, CSS, JavaScript) for development, this will make it possible for a large number of Web developers to develop QT applications. OK. This is the first article. The following sections describe how to use the web design sanjianke to develop QT applications. From: http://software.intel.com/zh-cn/blogs/2010/06/08/qt-webkitamp/ Author: Dawei Cheng Dawei (Intel) in the second article we implement a very simple example. Use QT WebKit to display webpages. Note: There are many demos online, including Nokia QT doc and example official documents. However, some parts are incomplete, and the webpage is not even displayed during compilation and running. This is because some bloggers did not actually compile the page. Since this demo is very simple, all source code is pasted. 1. create main. CPP # include <qtgui> # include <qtwebkit> int main (INT argc, char * argv []) {qapplication A (argc, argv); // set the Network Proxy: use the system proxy qnetworkproxyfactory: setusesystemconfiguration (true); // display the web page qwebview; view. load (qurl ("http://qt.nokia.com"); view. show (); Return a.exe C ();} 2. create a web. pro file display page only need to partition the source code lines, but in. in the pro file, you need to make the following changes // This requires not only the WebKit module, but also the network module. Because WebKit depends on network QT + = WebKit/networkheaders = sources = Main. cppresources = 3. compile and run $ qmake-Project | $ qmake | $ make | $. /Web running result: to increase the response time, we can increase the cache system. Qinitopservices: The cachelocation enumeration function in storagelocation can be used to specify the storage location in cross-platform scenarios. You can implement and use a custom cache system by yourself using the qw.actnetworkcache interface. The following four lines of code increase the local cache to improve the response time: qnetworkdiskcache * diskcache = new qnetworkdiskcache (this); qstring location = qw.topservices: storagelocation (qw.topservices: cachelocation ); diskcache-> setcachedirectory (location); networkaccessmanager-> setcache (diskcache); some websites provide not only content, but also a variety of services. The content of the network service ranges from the currency exchange rate information to the external network connection of enterprise applications. With QT WebKit integration, you can use these network services in applications. For example, the Twitter authentication request code: qnetworkrequest request ("http://twitter.com"); req. setrawheader ("Authorization", basicbase64); qnetworkreply * reply = Manager-> get (request); describes how to display webpages and use network services in QT WebKit. The third article will introduce how to use the Web Extension function in QT WebKit, that is, design the application using the HTML, CSS, and JS tools. From: http://software.intel.com/zh-cn/blogs/2010/06/09/qt-webkitweb/ Author: Dawei Cheng Dawei (Intel) This article describes how to use web development tools in QT WebKit to develop local applications that contain web content. Note: this series of articles focuses on the development process. For details about how WebKit explains html dom tree and rendering HTML and JavaScript, see http://webkit.org /. Before sharing the development process, let's take a look at the web application architecture: 1. development Environment: (1) based on qtwebkit browser engine (2) developed with HTML, CSS and JavaScript (3) used by QT Creator for windowsother ides, such as Visual Studio or eclipse, as well.2. create a project: (1) Start the QT creator IDE. (2) Select File> New file or project...> projects> qt4 GUI application. (3) give the project a name and set its location. (4) Check the qtwebkit module and click Next, And then click finish.3. modify the code: the source code of the Project is displayed in the edit column on the left of the Creator. Open the header file widgetwindow. h. Make the following changes: # ifndef widgetwindow_h # define widgetwindow_h # include <qtcore/qpointer> # include <qtgui/qmainwindow> class qwebview; Class widgetwindow: Public qmainwindow {q_objectpublic: widgetwindow (qwidget * parent = 0 );~ Widgetwindow (); Private: void setupui (); // declare the function qwebview * createwebview () used to display web applications; private: qpointer <qwebview> webview ;}; # endif // widgetwindow_h4. display the HTML, CSS, and JavaScript files required to create a web application in the QT project, and assume they are in the HTML/, style/, and script/folders respectively. The folder view is as follows: if you want to learn more about web development, click here to enter: http://zh.html.net/tutorials/html/html/ (HTML files) style/(CSS files) script/(JavaScript files) Create the resource file. In QT, the link to the web content file is implemented through the qrc file. The content of the qrc file helloqtwebkit. qrc is as follows: <? XML version = "1.0" encoding = "UTF-8"?> <RCC version = "1.0"> <qresource> <! -- HTML files --> <File> html/index.html </File> <! -- CSS files --> <File> style/general.css </File> <! -- JavaScript files --> <File> script/basic. js </File> </RCC> open the HTML file and paste the code of the HTML file as follows: This is a very simple hellodemo. <Head> <meta http-equiv = "Content-Type" content = "text/html; charset = UTF-8"/> <LINK rel = "stylesheet" href = "qrc: /style/general.css "type =" text/CSS "/> <SCRIPT type =" text/JavaScript "src =" qrc:/script/basic. JS "charset =" UTF-8 "> </SCRIPT> <title> Hello QT WebKit </title> Next we will learn how to interact QT local objects with JavaScript. This is very useful for web development. In the previous article, we learned how to create a local application with Web Content in WebKit. In this article, we will implement the interaction between JavaScript and the local qobject. Before reading this article, you need to have a simple understanding of QT's signal and slot mechanism and JavaScript. Qt local object and JavaScript interaction are divided into three steps: (1) expose the local qobject to WebKit and JavaScript (2) connect the signal of the local qobject with the Javascript slot (3) use JavaScript to call the slot of the local qobject. Combine steps 1 and 2 to realize the signal of the local qobject and the slot connection of JavaScript. Combine steps 2 and 3 to implement the following slot for calling the local qobject through JavaScript. let's take a look at how steps 1st, 2, and 3 are implemented. 1. Expose the local qobject to WebKit. The procedure is as follows. (1) Create a New qobject named simpleqobject, which contains signals and slots. The header file is as follows: # include <qtcore/qobject> # include <qtcore/qmap> # include <qtcore/qstring> # include <qtcore/qvariant> class sampleqobject: Public qobject {q_objectpublic: sampleqobject (qobject * parent = 0); signals: void signal (qmap <qstring, qvariant> Object); Public slots: // qobject slot, used to return the string qmap <qstring, qvariant> slotthatreturns (const qmap <qstring, qvariant> & object); void slotthatemitssignal (); // qobject slot for transmitting messages PRIVATE: int m_signalemited; qmap <qstring, qvariant> m_returnobject; qmap <qstring, qvariant> m_emitsignal ;}; (2) create an implementation function. Mainwindow. h and mainwindow. cpp. The mainwindow. H code is as follows # include <qmainwindow> # include "sampleqobject. H" class mainwindow: Public qmainwindow {q_objectpublic: mainwindow (qwidget * parent = 0 );~ Mainwindow (); Private slots: void addjavascriptobject (); protected: void changeevent (qevent * E); Private: Ui: mainwindow * UI; sampleqobject * m_sampleqobject;}; (3) mainwindow. CPP key code: // when a Web page is loaded or refreshed, The qobject exposed to WebKit and WebKit JavaScript are connected to connect (ui-> webview-> page () -> mainframe (), signal (javascriptwindowobjectcleared (), this, slot (addjavascriptobject (); void mainwindow: addjavascriptobject () {// addjavascriptob Implementation of the ject function: connect simpleqobject and WebKit JavaScript to this-> UI-> webview-> page ()-> mainframe ()-> addtojavascriptwindowobject ("sampleqobject", this-> m_sampleqobject);} 2. connect the local qobject signal to the Javascript slot: (1) how to transmit the qobject signal. Signals: void signal (qmap <qstring, qvariant> Object); Public slots: void slotthatemitssignal (); void sampleqobject: Random () {qdebug () <"sampleqobject :: slotthatemitssignal "; this-> m_signalemited ++; this-> m_emitsignal.clear (); this-> m_emitsignal [" signalsemited "] = qvariant (this-> m_signalemited ); this-> m_emitsignal ["sender"] = qvariant ("sampleqobject: slotthatemitssignal"); qdebug () <"sampleqo Bject: slotthatemitssignal "<this-> m_emitsignal; emit signal (this-> m_emitsignal);} (2) JavaScript slot implementation $ (document ). ready (function () {try {sampleqobject. signal. connect (slot); sampleqobject. slotthatemitssignal () ;}catch (e) {alert (e) ;}}); function slot (object) {var objectstring = object. sender + "has emited signal" + object. signalsemited + "times. "; alert (objectstring);} (3) run the app. When you click Refresh, a new dialog box is displayed: 3. use JavaScript to call the slot of the local qobject (1) JavaScript to transmit try {var object = {intvalue: 1}; var returnedobject = sampleqobject. slotthatreturns (object); alert (returnedobject. stringvalue) ;}( 2) qobject slot function qmap <qstring, qvariant> sampleqobject: slotthatreturns (const qmap <qstring, qvariant> & object) {qdebug () <"sampleqobject:: slotthatreturns "; this-> m_returnobject.clear (); this-> m_returnobject.unite (object); qstring addedbonus = qstring: Number (object [" intvalue "]. toint (), 10 ). append ("added bonus. "); this-> m_returnobject [" stringvalue "] = qvariant (addedbonus); qdebug () <" sampleqobject: slotthatreturns "<this-> m_returnobject; return this-> m_returnobject; // return m_returnobject containing the string 1 added bonus} (3) run the app this example code: http://software.intel.com/file/28111 http://software.intel.com/file/28112 note: part of the Code in this example comes from wiki.forum.nokia.com. Next we will explore how to porting the Web runtime widget in s60 to the WebKit in QT. Today's WRT widgets can only depend on s60 OS. If