Open Web Page in QWebView

[toc align_right="yes" depth="3"]

English Български

Open Web Page in QWebView

The following tutorial shows how to load a web page using "QUrl":http://doc.qt.nokia.com/latest/qurl.html in "QWebView":http://doc.qt.nokia.com/latest/qwebview.html . QWebView is a widget provided by "WebKit in Qt":http://doc.qt.nokia.com/latest/qtwebkit.html that is used to view and edit web documents.

• Specify that you want to link against the QtWebkit module by adding this line to your qmake .pro file:

QT ''= webkit

• Include required headers

#include <QWebView>
#include <QUrl>

• Create instance of QWebView

m_pWebView = new QWebView(this);
//set position and size
m_pWebView->setGeometry(0,0,200,200);

Additionally QWebView style can be customized using setStyleSheet().

• Load a web page

m_pWebView->load(QUrl("http://www.example.com"));

h2. Example

This example has been built with Qt SDK 1.1 and tested on Symbian^3 devices.

h3. mainwindow.h

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QtGui/QMainWindow>
#include <QWebView>
#include <QUrl>

namespace Ui {
 class MainWindow;
}

class MainWindow : public QMainWindow
{
 Q_OBJECT
public:

 explicit MainWindow(QWidget '''parent = 0);
 virtual ~MainWindow();

private:

 QWebView''' m_pWebView;
};

#endif // MAINWINDOW_H

h3. mainwindow.cpp

#include "mainwindow.h"

#include <QtCore/QCoreApplication>

MainWindow::MainWindow(QWidget *parent)
 : QMainWindow(parent)
{
 m_pWebView = new QWebView(this);
 //set position and size
 m_pWebView->setGeometry(0,0,200,200);
 m_pWebView->load(QUrl("http://www.example.com"));
}

MainWindow::~MainWindow()
{

}

h3. main.cpp

#include "mainwindow.h"

#include <QtGui/QApplication>

int main(int argc, char '''argv[])
{
 QApplication app(argc, argv);

 MainWindow mainWindow;
 mainWindow.showMaximized();
 return app.exec();
}

h2. Troubleshooting

QWebView: No such file or directory

Make sure you have added webkit to the .pro file of the project.

QT''= webkit

See also

"Embed YouTube Video in QWebView":http://developer.qt.nokia.com/wiki/Embed_YouTube_Video_in_QWebView