Qt：改变控件位置关系QVBoxLayout

骑猪看日落 2022-10-24 11:46 221阅读 0赞

1、如果要改变位置关系，方法1是直接setGeometry，还有一种方法是添加布局控件。

如果不设置两者位置关系，控件都会直接从坐标0, 0开始放置：

![95fb21931ef890573686175ea56c2f17a78.jpg][]

2、添加垂直布局

#include <QApplication>
    #include <QWidget>
    #include <QPushButton>
    #include <QLineEdit>
    #include <QVBoxLayout>
    int main(int argc, char *argv[])
    {
        QApplication app(argc, argv);
    
        QWidget w;
    
        QPushButton button;   /*按钮是窗口*/
        button.setText("Button");
        button.setParent(&w);   //窗口对象的父子关系:设置父窗口是button
       // button.setGeometry(30, 30, 100, 30);   //坐标原点在窗口的左上角[不包括工具栏]
    
        QLineEdit edit;
        edit.setParent(&w);
    
        QVBoxLayout vLayout;
        vLayout.addWidget(&button);
        vLayout.addWidget(&edit);
        w.setLayout(&vLayout);
        
        w.setWindowTitle("Hello world");
        w.show();
        return app.exec();
    }

![7415bbad1befd075682aecc6560fc1ba204.jpg][]

3、添加水平布局

#include <QApplication>
    #include <QWidget>
    #include <QPushButton>
    #include <QLineEdit>
    #include <QHBoxLayout>
    int main(int argc, char *argv[])
    {
        QApplication app(argc, argv);
    
        QWidget w;
    
        QPushButton button;   /*按钮是窗口*/
        button.setText("Button");
        button.setParent(&w);   //窗口对象的父子关系:设置父窗口是button
       // button.setGeometry(30, 30, 100, 30);   //坐标原点在窗口的左上角[不包括工具栏]
    
        QLineEdit edit;
        edit.setParent(&w);
    
        QHBoxLayout vLayout;
        vLayout.addWidget(&button);
        vLayout.addWidget(&edit);
        w.setLayout(&vLayout);
    
        w.setWindowTitle("Hello world");
        w.show();
        return app.exec();
    }

![2d7c65737c4ff35f5cff979c672965f1.png][]

关系：窗口里面放置layout----> layout放置控件button和edit----> 这个两个控件会自动根据layout的规则而布局

4、添加弹簧

#include <QApplication>
    #include <QWidget>
    #include <QPushButton>
    #include <QLineEdit>
    #include <QHBoxLayout>
    int main(int argc, char *argv[])
    {
        QApplication app(argc, argv);
    
        QWidget w;
    
        QPushButton button;   /*按钮是窗口*/
        button.setText("Button");
        button.setParent(&w);   //窗口对象的父子关系:设置父窗口是button
       // button.setGeometry(30, 30, 100, 30);   //坐标原点在窗口的左上角[不包括工具栏]
    
        QLineEdit edit;
        edit.setParent(&w);
    
        QHBoxLayout vLayout;
       // vLayout.addStretch(1);  //添加弹簧
        vLayout.addWidget(&button);
        vLayout.addWidget(&edit);
        vLayout.addStretch(1);
        w.setLayout(&vLayout);
    
        w.setWindowTitle("Hello world");
        w.show();
        return app.exec();
    }

![fbd22ac1ae3ffebff452ed102905233b55c.jpg][]

#include <QApplication>
    #include <QWidget>
    #include <QPushButton>
    #include <QLineEdit>
    #include <QHBoxLayout>
    int main(int argc, char *argv[])
    {
        QApplication app(argc, argv);
    
        QWidget w;
    
        QPushButton button;   /*按钮是窗口*/
        button.setText("Button");
        button.setParent(&w);   //窗口对象的父子关系:设置父窗口是button
       // button.setGeometry(30, 30, 100, 30);   //坐标原点在窗口的左上角[不包括工具栏]
    
        QLineEdit edit;
        edit.setParent(&w);
    
        QHBoxLayout vLayout;
        vLayout.addStretch(1);  //添加弹簧
        vLayout.addWidget(&button, 1);
        vLayout.addWidget(&edit, 1);
        vLayout.addStretch(1);   //设置弹簧的比重：4分天下
        w.setLayout(&vLayout);
    
        w.setWindowTitle("Hello world");
        w.show();
        return app.exec();
    }

![e8c0b6f55d23829de2bbb5f84168db3a383.jpg][]

5、控件之间间隔

#include <QApplication>
    #include <QWidget>
    #include <QPushButton>
    #include <QLineEdit>
    #include <QHBoxLayout>
    int main(int argc, char *argv[])
    {
        QApplication app(argc, argv);
    
        QWidget w;
    
        QPushButton button;   /*按钮是窗口*/
        button.setText("Button");
    
        QLineEdit edit;
    
        QHBoxLayout vLayout;   //有了Layout之后，其父子关系就不需要了，因为会自动构造控件的父子关系
        vLayout.addStretch(1);  //添加弹簧
        vLayout.addWidget(&button, 1);   //添加控件窗口到LayOut布局上
        vLayout.addSpacing(50);   //在两个控件窗口之间添加50个像素作为间隔两个控件
        vLayout.addWidget(&edit, 1);
        vLayout.addStretch(1);   //设置弹簧的比重：4分天下
        w.setLayout(&vLayout);
    
        w.setWindowTitle("Hello world");
        w.show();
        return app.exec();
    }

![6095f07390393ca85b55ea26c5175b438d3.jpg][]

6、网格布局

#include <QApplication>
    #include <QWidget>
    #include <QPushButton>
    #include <QLineEdit>
    #include <QHBoxLayout>
    #include <QGridLayout>
    int main(int argc, char *argv[])
    {
        QApplication app(argc, argv);
    
        QWidget w;
    
        QPushButton button;   /*按钮是窗口*/
        button.setText("0, 0");
    
        QLineEdit edit;
        
        QGridLayout gLayout;
        
        gLayout.setColumnStretch(0, 1); //在第0行放置1根弹簧
        gLayout.setRowStretch(3, 1);    //在第0列放置1根弹簧
        gLayout.addWidget(&button, 0, 1);
        gLayout.addWidget(&edit, 0, 2);
        gLayout.addWidget(new QPushButton("1, 0"), 1, 1);
        gLayout.addWidget(new QPushButton("1, 1"), 1, 2);
        gLayout.addWidget(new QPushButton("3, 1"), 2, 1, 1, 2);
        w.setLayout(&gLayout);
        w.setWindowTitle("Hello world");
        w.show();
        return app.exec();
    }

![86e0aa0f3afb93ee13b7ccc2ea008ab50db.jpg][]

\---

[95fb21931ef890573686175ea56c2f17a78.jpg]: /images/20221024/1b5497abf1654ac48949e27d9a4736e0.png
[7415bbad1befd075682aecc6560fc1ba204.jpg]: /images/20221024/2cafc50d3d4b403185e1c6f8994a3653.png
[2d7c65737c4ff35f5cff979c672965f1.png]: /images/20221024/fca3c48c4dd14a189896f24b1edeb905.png
[fbd22ac1ae3ffebff452ed102905233b55c.jpg]: /images/20221024/7c6bc679330d4882855d97b54edae85e.png
[e8c0b6f55d23829de2bbb5f84168db3a383.jpg]: /images/20221024/9fe0117de4ae40aaa719b97316654d57.png
[6095f07390393ca85b55ea26c5175b438d3.jpg]: /images/20221024/14efebdf8b524fa5921a9377324bd320.png
[86e0aa0f3afb93ee13b7ccc2ea008ab50db.jpg]: /images/20221024/c262f9f5d0314e209bd78eecda0c2379.png