QT_StepByStep（2）--滑动杆的实现

1、实现效果图：

2、代码清单：

#include <QtGui/QApplication>
#include <QtGui/QWidget>
#include <QtGui/QSpinBox>
#include <QtGui/QSlider>
#include <QtGui/QHBoxLayout>
int main(int argc, char *argv[])
{
  QApplication app(argc, argv);

  QWidget *window = new QWidget;
  window->setWindowTitle("Enter your age");

  QSpinBox *spinBox = new QSpinBox;
  QSlider *slider = new QSlider(Qt::Horizontal);
  spinBox->setRange(0, 130);
  slider->setRange(0, 130);
  QObject::connect(slider,SIGNAL(valueChanged(int)),spinBox,SLOT(setValue(int)));
  QObject::connect(spinBox,SIGNAL(valueChanged(int)),slider,SLOT(setValue(int)));

  spinBox->setValue(35);
  QHBoxLayout *layout = new QHBoxLayout;
  layout->addWidget(spinBox);
  layout->addWidget(slider);
  window->setLayout(layout);
  window->show();
return app.exec();
}

3、代码解析：

使用组件：

（1）QSpinBox

    QSpinBox 是一个有上下箭头的微调器。

（2） QSlider

    QSlider 是一个滑动杆。

（3）QWidget

    QWidget 一个新的顶级窗口。

    首先创建了一个 QWidget 的实例，调用 setWindowTitle 函数来设置窗口标题。然后创建了一个 QSpinBox 和 QSlider，分别设置了它们值的范围，使用的是 setRange 函数。然后进行信号槽的链接。这点后面再详细说明。然后是一个 QHBoxLayout，就是一个水平布局，按照从左到右的顺序进行添加，使用 addWidget 添加好组件后，调用 QWidget 的 setLayout 把 QWidget的 layout 设置为我们定义的这个 Layout。

    比如下面的 spinBox - >setValue(35)执行的时候，首先，spinBox 会将自己的值设为 35 ，这样，它的值与原来的不一样了(在没有 setValue 之前
的时候，默认值是 0)，于是它发出了 valueChanged 信号。slider 接收到这个信号，于是回调自己的 setValue 函数，将它的值也设置成 35，它也发出了 valueChanged 信号。当然，此时 spinBox 又收到了，不过它发现，if（spinbox==35） stop valuechanged。这个 35 和它本身的值是一样的，于是它就不发出信号，所以信号传递就停止了。

    总体来说，这是一个循环结构，这个值的改变是通过int参数传递的，通过QT的信号槽机制完成了一个数据绑定，使两个组件或者更多组件的状态能够同步变化。

Qt 一共有三种主要的 layout，分别是：

QHBoxLayout-   按照水平方向从左到右布局；
QVBoxLayout-  按照竖直方向从上到下布局；
QGridLayout-  在一个网格中进行布局，类似于 HTML 的 table。

layout 使用 addWidget 添加组件，使用 addLayout 可以添加子布局，因此，这就有了无穷无尽的组合方式。