Qt布局管理之QSplitter和QuadSplit…

一、QSplitter和QuadSplitter简介

Qt的布局管理器除了QLayout及其子类外，还可以使用QSplitter。与QLayout不同的是：1）QSplitter是一个带切分条（splitterhandle）的布局管理器，可以通过setHandleWidth()函数来设置切分条的宽带；2）QSplitter在创建的时候需要指定“orientation”或者在后续通过setOrientation()函数来指定，子窗件按加载顺序进行指定方向排列；3）QSplitter一次只能水平或者垂直分割（相当于QHLayout或QVLayout），不能像QGridLayout一样进行网格分割。

QuadSplitter是qt-apps中的一个应用，它能够实现四方格分割。下载地址： QuadSplitter  和应用参考： Qt之四方分割器。它装载子窗件时，需要指定方格的行列号，使用方法类似于QGridLayout。参考代码如下（新建mainwindow工程，在构造函数中添加如下代码）：

QuadSplitter *pSplitter = new QuadSplitter(this);

    QStringList strList;
    strList << "#990099" << "#99FFFF" << "#CC0099" << "#CCFF99";
    for (int i = 0; i < strList.count(); ++i)
    {
        QWidget *pWidget = new QWidget(this);
        pWidget->setStyleSheet(QString("background:%1").arg(strList.at(i)));
        pSplitter->addWidget(pWidget, i/2, i%2);
    }

    setCentralWidget(pSplitter);

效果图（有木有微软的感觉？）

二、QSplitter实现一个任意行列的界面分割

1，QSplitter实现四方格分割

步骤：首先添加一个两个QSplitter，指定为水平方向分割，并分别装载子窗件；在新建一个QSplitter，指定为垂直方向分割，然后将之前的两个QSplitter装置进来即可。也可以用水平方向分割器包裹两个垂直方向分割器。

特点：各子分割器的分割拖动条（splitter handlebar）可以单独拖动。

2，QSplitter实现任意行列分割

原理：

1）使用QSplitter嵌套；

2）一个QSplitter可以装载多个子窗件；

3）可以隐藏或显示子窗件，实现运行时布局变更；

4）可以删除和插入子窗件，实现运行时布局变更，这个支持不同类型的QWidget子类对象（另，删除的时候，会自动解除QObject对象的父子关联关系）；

3，QSplitter嵌套布局管理实现放大到全屏及还原

原理：子窗件接收鼠标事件，发送信号给最子窗件管理类，子窗件管理类在槽函数中将其他子窗件隐藏。QSplitter会自动管理其名下子窗件的缩放，如果某个子窗件隐藏了，其他子窗件会相应放大并占据多出来的空间。还原的时候，只需要将被隐藏的子窗件重新显示出来即可。

三、QuadSplitter源码分析和应用扩展

1，源码分析

QuadSplitter类的设计使用了pimplidiom（pointer to implementation模式），QuadSplitter包含了一个类 QuadSplitterPrivate 的指针成员，QuadSplitter的全部接口都是间接通过 QuadSplitterPrivate 来实现的。而类 QuadSplitterPrivate 中有包含了两个 AdvSplitter 指针成员： _horizontalSplitter 和 _verticalSplitter ，分别表示两个方向上的分割器，具体的分割器拖动条的一些事件就是在其中实现的。

另外，参考 宏Q_D和Q_Q的意义这篇博客，也可以了解这种设计的用意。

2，应用扩展

QuadSplitter是一个四方分割器，如果只加载了一个子窗件，它不会像QSplitter一样自动填充空白区域，而是保持四方分割的状态，其他地方留空白。同样的，在运行时隐藏某个子窗件，对应区域也会留空白。这样，它就没法实现运行时某个子窗件放大到全屏的功能。

经过研究源码，我们只需要添加如下接口，即可实现这个功能。

1）在 QuadSplitterPrivate 中，已有接口 qreal realPercent( Qt:: Orientation orientation) const;  可以获取垂直或水平方向上的分割比例。我们只需添加一个设置垂直或水平方向上的分割比例的函数，并将这个接口暴露到QuadSplitter上来即可。代码如下：

void QuadSplitter::setPercent(qreal value, Qt::Orientation orientation)
    {
        Q_D(QuadSplitter);
        d->setPercent(value, orientation);
    }

void QuadSplitterPrivate::setPercent(qreal val, Qt::Orientation orientation)
{
   if (orientation == Qt::Horizontal)
   {
       _horizontalSplitter->setPercent(val);
   }
   else
   {
       _verticalSplitter->setPercent(val);
   }
   arrange();
}

2）应用

   

 connect(m_pShowWidgets[i/2][i%2], SIGNAL(FullScreenToggle(QWidget*,bool)), this, SLOT(OnToggleSize(QWidget*,bool)));

// QuadSplitter

void MainWindow::OnToggleSize(QWidget *pWidget, bool bFullScreen)

{

 if (!bFullScreen)

 {

 ui->frameDisplay->setMinimumWidgetSize(30);

 ui->frameDisplay->setPercent(0.5, Qt::Horizontal);

 ui->frameDisplay->setPercent(0.5, Qt::Vertical);

 return;

 }

 for (int i = 0; i <</SPAN> s_iWidgetsNumber; ++i)

 {

 if (pWidget == (m_pShowWidgets[i/2][i%2]))

 {

 ui->frameDisplay->setMinimumWidgetSize(0);

 ui->frameDisplay->setPercent((1- i%2), Qt::Horizontal);

 ui->frameDisplay->setPercent((1- i/2), Qt::Vertical);

 break;

 }

 }

}

 

四、其他

可以QSplitter和QuadSplitter都可以嵌套和相互组合使用，实现一些复杂的功能。