qt网格布局内的垂直和水平布局?

Posted

技术标签:

【中文标题】qt网格布局内的垂直和水平布局?【英文标题】:qt vertical and horizontal layouts inside gridlayout? 【发布时间】:2016-01-07 14:53:05 【问题描述】:

我是 Qt 应用程序开发的新手。我附上了两个屏幕截图,一个是所需的 ui,另一个是使用代码创建的。 我相信我的代码会解释事情,而不是我在这里打字并在这里混淆我所有的朋友。需要更改/更新什么?

    /*    HEADER FILE    */

    #ifndef WIDGET_H
    #define WIDGET_H

    #include <QWidget>

    namespace Ui 
    class Widget;
    

    class Widget : public QWidget
    
        Q_OBJECT

    public:
        explicit Widget(QWidget *parent = 0);
        ~Widget();

    private:
       // Ui::Widget *ui;
    ;

    #endif // WIDGET_H

    /*Implementation  Code */

    #include "widget.h"
    #include "ui_widget.h"
    #include<QGridLayout>
    #include<QVBoxLayout>
    #include<QHBoxLayout>

    Widget::Widget(QWidget *parent) :
        QWidget(parent)//,
        //ui(new Ui::Widget)
    
        this->setGeometry(50,50,850,650);
        QGridLayout *gridLayout= new QGridLayout(this);
        setLayout(gridLayout);
        QVBoxLayout *vLayout =  new QVBoxLayout(this);
        QHBoxLayout *hLayout =  new QHBoxLayout(this);
        //QWidget *tmp1 = new QWidget(this);
        //QWidget *tmp2 = new QWidget(this);
       // tmp1->setLayout(vLayout);
       // tmp2->setLayout(hLayout);

        gridLayout->addLayout(vLayout,0,3);
        gridLayout->addLayout(hLayout,3,0);
        //gridLayout->addWidget(tmp1,0,3,1,1);
        //gridLayout->addWidget(tmp2,3,0,1,1);

        QWidget *w =  new QWidget(this);

        QWidget *w1 =  new QWidget(this);
        QWidget *w2 =  new QWidget(this);
        QWidget *w3 =  new QWidget(this);

        QWidget *w11 =  new QWidget(this);
        QWidget *w22 =  new QWidget(this);
        QWidget *w33 =  new QWidget(this);


        QWidget *w4 =  new QWidget(this);
        QWidget *w5 =  new QWidget(this);

        w->setStyleSheet("background-color:rgb(0,0,0);");

        w1->setStyleSheet("background-color:rgb(255,0,0);");
        w2->setStyleSheet("background-color:rgb(255,0,255);");
        w3->setStyleSheet("background-color:rgb(0,255,0);");

        w11->setStyleSheet("background-color:rgb(255,0,0);");
        w22->setStyleSheet("background-color:rgb(255,0,255);");
        w33->setStyleSheet("background-color:rgb(0,255,0);");

        w4->setStyleSheet("background-color:rgb(0,0,255);");
        w5->setStyleSheet("background-color:rgb(255,255,0);");

        vLayout->addWidget(w1);
        vLayout->addWidget(w2);
        vLayout->addWidget(w3);

        vLayout->addWidget(w11);
        vLayout->addWidget(w22);
        vLayout->addWidget(w33);

        hLayout->addWidget(w4);
        hLayout->addWidget(w5);

        gridLayout->addWidget(w,0,0,2,2);
        show();
    

    Widget::~Widget()
    
        //delete ui;
    

【问题讨论】:

【参考方案1】:

代码看起来还不错。在我看来,您只需要调整 addWidget/addLayout 调用的参数即可。想想你的网格布局应该是什么样子,然后相应地选择参数。

我会这样尝试:

// Desired grid layout is of size 2x2:
// .................
// . row0  . row0  .
// . col0  . col1  .
// .................
// . row1  . row1  .
// . col0  . col1  .
// .................

// Big widget at row 0, column 0
gridLayout->addWidget (w, 0, 0);

// "Horizontal group" at row 1, column 0
gridLayout->addLayout (hLayout, 1, 0);

// "Vertical group" at rows 0+1 (i.e. rowspan 2), column 1
gridLayout->addLayout (vLayout, 0, 1, 2, 1);

这样效果更好吗(我自己还没有尝试过)?

【讨论】:

以上是关于qt网格布局内的垂直和水平布局?的主要内容,如果未能解决你的问题,请参考以下文章

Qt-布局管理器

CSS 网格布局 - 仅针对部分内容的水平和垂直滚动

Qt之手动布局

QT quick基础QML学习2

9-12布局进阶 网格卡片功能实现和布局技巧2

使用属性窗口在 QT 网格布局中设置小部件的行和列