Qt_3——MyWebWidgetB

今天记录的是我的第三个Qt程序MyWebWidgetB，那么大家一看程序名就可以猜测到这是我继上个程序MyWebWidget的扩展程序了，在这个程序中，大家将学到新的东西。好了，让我们开始吧：）

      用Qt Creator新建一个Qt C++ Project→Mobile Qt Application，命名为MyWebWidgetB。

      首先新增一个main.h文件，代码如下：

#ifndef MAIN_H

#define MAIN_H

#include <QtWebKit>

#include <QLineEdit>

#include <QVBoxLayout>

class MyWebWidget:public QWidget

{

  Q_OBJECT

public:

  MyWebWidget(QWidget *parent = 0);

  //~MyWebWidget();

private slots: void openUrl();

  void onLoadFinished(bool finished);

private:

  QWebView* m_view;

  QLineEdit* m_lineEdit;

  QVBoxLayout* m_layout;

};

#endif // MAIN_H

      再将main.cpp文件代码改为如下：

#include <QtGui/QApplication>
#include <QtWebKit/QWebView>
#include <main.h>
int main(int argc, char *argv[])
{
  QApplication a(argc, argv);
  MyWebWidget w;
#if defined(Q_WS_S60)
  w.showMaximized();
#else
  w.show();
#endif

  return a.exec();
}
MyWebWidget::MyWebWidget(QWidget *parent)
  : QWidget(parent)
{
  m_lineEdit = new QLineEdit(this);
  m_lineEdit->setStyleSheet("background-color:white; padding: 6px;color:blue");
  m_lineEdit->setPlaceholderText("Enter url ...");
  m_view = new QWebView(this);
  m_view->load(QUrl("http://www.cisco.com"));
  m_layout = new QVBoxLayout;
  m_layout->addWidget(m_lineEdit);
  m_layout->addWidget(m_view);
  m_layout->insertSpacing(1,10);
  setLayout(m_layout);
  connect(m_lineEdit,SIGNAL(editingFinished()),SLOT(openUrl()));
  connect(m_view,SIGNAL(loadFinished(bool)),SLOT(onLoadFinished(bool)));
}
void MyWebWidget::openUrl()
{
 QString url(m_lineEdit->text());
 if(!url.contains("http://",Qt::CaseInsensitive))
  url.prepend("http://");
 m_view->load(QUrl(url));
}
void MyWebWidget::onLoadFinished(bool finished)
{
  if(finished){
  m_lineEdit->clear();
  m_lineEdit->setPlaceholderText(tr("Enter url ..."));
  }
}
 

      当然咯，还是要跟上个程序一样，在.pro文件中的QT       += core gui后面加上webkit。

      最后运行程序便得到如下图：

当然咯，我们也可以在程序的顶端地址输入栏里面输入任何想要访问的网址，然后按回车就会转到网址指向的网页了。

接下来分析一下代码，你也许已经注意到了，我们向我们的类声明中添加了一个宏，即Q_OBJECT。这么做的第一个理由是，没有它我们就无法使用这里要用到的信号和槽，当然并不是使用所有的信号和槽都需要它，准确说是如果一个类中需要定义信号或槽Q_OBJECT，就需要；还有许多其它理由，如果你想了解更多，也许你可以参阅Qt Meta-Object 系统。也可以浏览一下我下一篇博文Qt_4——SignalSlot，它对信号和槽做了一个简单生动的描述~_^

我们能直接使用CSS句法来设定我们的行编辑LineEdit的样式。在我们的范例中我们将背景设成“白色”，而将文本设为“蓝色”。“样式”是Qt中的一大课题，如果你想了解更多有关样式的知识，QStyle类在线文档是你的首选。

      在我们的范例中，行编辑widget – 它让用户能输入一个URL –当用户结束URL编辑时需要向MyWebWidget发出提示。为实现这一点，我们使用函数QObject::connect将MyWebWidget中的一个槽（名为openUrl()）连接到QLineEdit中的名为editingFinished()的一个信号。每当行编辑widget发出这个信号时，MyWebWidget就会返回openURL()函数。类似地，我们也将MyWebWidget::onLoadFinished连接到由QWebView发出的loadFinished信号。 有关信号与槽方面的更多信息，请参阅Qt在线文档。

而main.cpp中构造函数下面的2个函数就是槽的实现。这两个槽都很直观：openUrl()槽抓取行编辑widget中输入的URL，然后在web视图widget中将其作为一个网页打开。onLoadFinished槽则当所要求的网页被加载完毕后清除URL地址条中的文本。