Пример "Fancy Browser"Файлы:
Пример "Fancy Browser" показывает, как использовать jQuery с QtWebKit для создания веб-браузера со специальными эффектами и управлением содержимым. Приложение применяет QWebFrame::evaluateJavaScript для выполнения JavaScript-кода jQuery. QMainWindow с QWebView в качестве центрального образует браузер. Определение класса MainWindowКласс MainWindow унаследован от QMainWindow. Реализует несколько слотов для выполнения действий в приложении и веб-содержимом. class MainWindow : public QMainWindow { Q_OBJECT public: MainWindow(const QUrl& url); protected slots: void adjustLocation(); void changeLocation(); void adjustTitle(); void setProgress(int p); void finishLoading(bool); void viewSource(); void slotSourceDownloaded(); void highlightAllLinks(); void rotateImages(bool invert); void removeGifImages(); void removeInlineFrames(); void removeObjectElements(); void removeEmbeddedElements(); private: QString jQuery; QWebView *view; QLineEdit *locationEdit; QAction *rotateAction; int progress; Также объявляется QString, который содержит jQuery, QWebView, который отображает веб-содержимое, и QLineEdit, который действует как панель адреса. Реализация класса MainWindowНачинаем реализовывать конструкцию. MainWindow::MainWindow(const QUrl& url) { progress = 0; QFile file; file.setFileName(":/jquery.min.js"); file.open(QIODevice::ReadOnly); jQuery = file.readAll(); file.close(); В первой части конструктора устанавливается значение progress равной 0. Это значение будет использовано позже в коде для визуализации загрузки веб-страницы. Далее, используя QFile и читая содержимое файла, загружается библиотека jQuery. Библиотека jQuery - библиотека JavaScript, которая предоставляет различные функции для манипулирования HTML. view = new QWebView(this); view->load(url); connect(view, SIGNAL(loadFinished(bool)), SLOT(adjustLocation())); connect(view, SIGNAL(titleChanged(QString)), SLOT(adjustTitle())); connect(view, SIGNAL(loadProgress(int)), SLOT(setProgress(int))); connect(view, SIGNAL(loadFinished(bool)), SLOT(finishLoading(bool))); locationEdit = new QLineEdit(this); locationEdit->setSizePolicy(QSizePolicy::Expanding, locationEdit->sizePolicy().verticalPolicy()); connect(locationEdit, SIGNAL(returnPressed()), SLOT(changeLocation())); QToolBar *toolBar = addToolBar(tr("Navigation")); toolBar->addAction(view->pageAction(QWebPage::Back)); toolBar->addAction(view->pageAction(QWebPage::Forward)); toolBar->addAction(view->pageAction(QWebPage::Reload)); toolBar->addAction(view->pageAction(QWebPage::Stop)); toolBar->addWidget(locationEdit); Во второй части создаётся QWebView, а слоты соединяются с сигналами представлений. Кроме того, мы создаём QLineEdit в качестве панели адреса. Затем устанавливаем горизонтальную QSizePolicy для заполнения всей доступной области браузера. Добавляем QLineEdit в QToolbar вместе с действиями навигации из QWebView::pageAction. QMenu *effectMenu = menuBar()->addMenu(tr("&Effect")); effectMenu->addAction("Highlight all links", this, SLOT(highlightAllLinks())); rotateAction = new QAction(this); rotateAction->setIcon(style()->standardIcon(QStyle::SP_FileDialogDetailedView)); rotateAction->setCheckable(true); rotateAction->setText(tr("Turn images upside down")); connect(rotateAction, SIGNAL(toggled(bool)), this, SLOT(rotateImages(bool))); effectMenu->addAction(rotateAction); QMenu *toolsMenu = menuBar()->addMenu(tr("&Tools")); toolsMenu->addAction(tr("Remove GIF images"), this, SLOT(removeGifImages())); toolsMenu->addAction(tr("Remove all inline frames"), this, SLOT(removeInlineFrames())); toolsMenu->addAction(tr("Remove all object elements"), this, SLOT(removeObjectElements())); toolsMenu->addAction(tr("Remove all embedded elements"), this, SLOT(removeEmbeddedElements())); setCentralWidget(view); setUnifiedTitleAndToolBarOnMac(true); } В третьей и последней части конструктора реализуем два меню QMenu и устанавливаем для них набор действий. Последняя строка устанавливает QWebView в качестве центрального виджета в QMainWindow. void MainWindow::adjustLocation() { locationEdit->setText(view->url().toString()); } void MainWindow::changeLocation() { QUrl url = QUrl(locationEdit->text()); view->load(url); view->setFocus(); } После загрузки страницы adjustLocation() обновляет панель адреса; adjustLocation() переключается сигналом loadFinished() в значение QWebView. В changeLocation() создаём объект QUrl, а затем его для загрузки страницы в QWebView. Когда завершается загрузка новой веб-страницы, adjustLocation() будет запущен ещё раз для обновления панели адреса. void MainWindow::adjustTitle() { if (progress <= 0 || progress >= 100) setWindowTitle(view->title()); else setWindowTitle(QString("%1 (%2%)").arg(view->title()).arg(progress)); } void MainWindow::setProgress(int p) { progress = p; adjustTitle(); } adjustTitle() устанавливает заголовок окна b отображает прогресс загрузки. Этот слот переключается сигналом titleChanged() в QWebView. void MainWindow::finishLoading(bool) { progress = 100; adjustTitle(); view->page()->mainFrame()->evaluateJavaScript(jQuery); rotateImages(rotateAction->isChecked()); } После загрузки веб-страницы finishLoading() переключается сигналом loadFinished() в QWebView. Затем finishLoading() обновляет прогресс в панели заголовка и вызывает evaluateJavaScript() для выполнения библиотеки jQuery. Этим выполняется JavaScript в текущей веб-странице. Это означает, что JavaScript можно просматривать как часть содержимого, загруженного в QWebView, и который поэтому нужно загружать каждый раз при загрузке страницы. После загрузки библиотеки jQuery можно начать выполнять в браузере разные функции jQuery. Затем явно вызывается функция rotateImages(), чтобы убедиться в том, что изображения только что загруженной страницы имеет отношение к состоянию действия переключения. void MainWindow::highlightAllLinks() { QString code = "$('a').each( function () { $(this).css('background-color', 'yellow') } )"; view->page()->mainFrame()->evaluateJavaScript(code); } Первая функция на основе jQuery, highlightAllLinks(), спроектирована для подсветки всех ссылок на текущей веб-странице. Код JavaScript ищет веб-элементы с именем a, который является тегом для гиперссылки. Для каждого такого элемента цвет фона устанавливается в жёлтый используя CSS. void MainWindow::rotateImages(bool invert) { QString code; if (invert) code = "$('img').each( function () { $(this).css('-webkit-transition', '-webkit-transform 2s'); $(this).css('-webkit-transform', 'rotate(180deg)') } )"; else code = "$('img').each( function () { $(this).css('-webkit-transition', '-webkit-transform 2s'); $(this).css('-webkit-transform', 'rotate(0deg)') } )"; view->page()->mainFrame()->evaluateJavaScript(code); } Функция rotateImages() вращает изображения на текущей веб-странице. Webkit поддерживает преобразования CSS, а этот JavaScript код ищет все элементы img и вращает изображения на 180 градусов по часовой стрелке, а затем против. void MainWindow::removeGifImages() { QString code = "$('[src*=gif]').remove()"; view->page()->mainFrame()->evaluateJavaScript(code); } void MainWindow::removeInlineFrames() { QString code = "$('iframe').remove()"; view->page()->mainFrame()->evaluateJavaScript(code); } void MainWindow::removeObjectElements() { QString code = "$('object').remove()"; view->page()->mainFrame()->evaluateJavaScript(code); } void MainWindow::removeEmbeddedElements() { QString code = "$('embed').remove()"; view->page()->mainFrame()->evaluateJavaScript(code); } Остальные четыре метода удаляют различные элементы из текущей веб-страницы. removeGifImages() removes all GIF images on the page by looking up the src attribute of all the elements on the web page. Любой элемент с файлом gif в качестве источника удаляется. removeInlineFrames() удаляет все iframe или встроенные (inline) элементы. removeObjectElements() удаляет все элементы object, а removeEmbeddedElements() удаляет любые элементы, например, встроенные в страницу с использованием тега embed подключаемые модули. |
Попытка перевода Qt документации. Если есть желание присоединиться, или если есть замечания или пожелания, то заходите на форум: Перевод Qt документации на русский язык... Люди внесшие вклад в перевод: Команда переводчиков |