<div id="readability-page-1" class="page"><div>
QVBoxLayout QHBoxLayout QT5 예제입니다.&nbsp;



아래 사이트의 QT 강좌를 공부하며 정리 차원에서 작성하는 포스트입니다.&nbsp;



<a href="https://zetcode.com/gui/qt5">https://zetcode.com/gui/qt5</a>



2021. 08. 19 – 최초작성







터미널에서 빌드 및 실행을 진행합니다. 편집기는 익숙한 것을 사용하세요.&nbsp;



1. 프로젝트 파일들을 저장할 디렉토리를 생성하고 이동합니다.



<pre><code>webnautes@webnautes-laptop:~$ mkdir QVBoxLayout_Example

webnautes@webnautes-laptop:~$ cd QVBoxLayout_Example</code></pre>







2. layout.cpp 파일을 생성하여 다음 코드를 복사하여 붙여넣기합니다.



<pre><code>#include &lt;QWidget&gt;
#include &lt;QApplication&gt;
#include &lt;QVBoxLayout&gt;
#include &lt;QPushButton&gt;

class MainWindow: public QWidget {

 public:
 MainWindow(QWidget *parent = nullptr);
};

MainWindow::MainWindow(QWidget *parent)
 : QWidget(parent) {

 auto *vbox = new QVBoxLayout(this);
 vbox-&gt;setSpacing(1);

 auto *settings = new QPushButton("Settings", this);
 settings-&gt;setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);

 auto *accounts = new QPushButton("Accounts", this);
 accounts-&gt;setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);

 auto *loans = new QPushButton("Loans", this);
 loans-&gt;setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);

 auto *cash = new QPushButton("Cash", this);
 cash-&gt;setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);

 auto *debts = new QPushButton("Debts", this);
 debts-&gt;setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);

 vbox-&gt;addWidget(settings);
 vbox-&gt;addWidget(accounts);
 vbox-&gt;addWidget(loans);
 vbox-&gt;addWidget(cash);
 vbox-&gt;addWidget(debts);

 setLayout(vbox);
}

int main(int argc, char *argv[]) {

 QApplication app(argc, argv);

 MainWindow window;

 window.resize(240, 230);
 window.setWindowTitle("VerticalBox");
 window.show();

 return app.exec();
}</code></pre>







auto *vbox = new QVBoxLayout(this);



&nbsp;&nbsp;vbox-&gt;setSpacing(1);



QVBoxLayout을 만들고 자식 위젯간의 사이 간격을&nbsp; 1px로 설정합니다.







&nbsp;&nbsp;auto *settings = new QPushButton(“Settings”, this);



&nbsp;&nbsp;settings-&gt;setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);



버튼을 생성하고 레이아웃 매니저(여기에선 QVBoxLayout) 의 크기가 변할때 수평/수직 양방향으로 크기가 변하도록 설정합니다.&nbsp;







vbox-&gt;addWidget(settings);



vbox-&gt;addWidget(accounts);



…



레이아웃 매니저(여기에선 QVBoxLayout)의 addWidget 메소드를 사용하여 위젯을 추가합니다.&nbsp;



QVBoxLayout의 경우에는 추가한 순서대로 자식 위젯을 수직방향으로 차례대로 배치합니다.&nbsp;







setLayout(vbox);



QVBoxLayout 객체를 윈도우의 메인 레이아웃으로 설정합니다.&nbsp;







3. qmake -project 명령을 사용하면 qt 프로젝트 파일을 생성해줍니다.



프로젝트를 구성하는 파일의 정보를 가지고 확장자가 pro인 파일이 자동으로 생성합니다.&nbsp;



<pre><code>webnautes@webnautes-laptop:~/QVBoxLayout_Example$ qmake -project</code></pre>







4. 확장자가 pro인&nbsp; qt 프로젝트 파일이 생성될 때, qt 코드에서 사용중인 qt 모듈 이름이 자동으로 추가되지 않습니다.&nbsp;&nbsp;



일단 진행해보고 컴파일 에러가 나면 qt 프로젝트 파일을 열어서 사용중인 qt 모듈 이름을 추가해줘야 합니다.



다음 한줄을 추가합니다.



<pre><code>QT += widgets</code></pre>







5. qmake 명령으로 Makefile을 생성합니다.



<pre><code>webnautes@webnautes-laptop:~/QVBoxLayout_Example$ qmake</code></pre>







6. make 명령은&nbsp; Makefile에 기술된대로 컴파일 및 링크를 실행합니다.



중간 결과물인&nbsp; 확장자 .o인 오브젝트 파일과 프로젝트 디렉토리와 동일한 이름을 갖는 실행파일이 생성됩니다.



<pre><code>webnautes@webnautes-laptop:~/QVBoxLayout_Example$ make</code></pre>







이제 실행시켜 보면 푸쉬버튼이 추가된 윈도우가 보입니다. 윈도우의 크기를 조정하면 푸쉬버튼의 크기도 같이 변하게 됩니다.



<pre><code>webnautes@webnautes-laptop:~/QVBoxLayout_Example$ ./QVBoxLayout_Example </code></pre>



<figure><img data-lazy-fallback="1" data-attachment-id="5521" data-permalink="https://webnautes.blog/5516/image-104-2/" data-orig-file="https://i0.wp.com/webnautes.blog/wp-content/uploads/2023/08/image-104.png?fit=506%2C568&amp;ssl=1" data-orig-size="506,568" data-comments-opened="1" data-image-meta="{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}" data-image-title="image-104" data-image-description="" data-image-caption="" data-medium-file="https://i0.wp.com/webnautes.blog/wp-content/uploads/2023/08/image-104.png?fit=267%2C300&amp;ssl=1" data-large-file="https://i0.wp.com/webnautes.blog/wp-content/uploads/2023/08/image-104.png?fit=506%2C568&amp;ssl=1" decoding="async" src="https://i0.wp.com/webnautes.blog/wp-content/uploads/2023/08/image-104.png?w=500&amp;ssl=1" alt="" sizes="(max-width: 506px) 100vw, 506px" data-recalc-dims="1" data-old-src="https://i0.wp.com/webnautes.blog/wp-content/uploads/2023/08/image-104.png?w=500&amp;is-pending-load=1#038;ssl=1" data-lazy-srcset="https://i0.wp.com/webnautes.blog/wp-content/uploads/2023/08/image-104.png?w=506&amp;ssl=1 506w, https://i0.wp.com/webnautes.blog/wp-content/uploads/2023/08/image-104.png?resize=267%2C300&amp;ssl=1 267w"></figure>







QHBoxLayout의 경우에는 자식 위젯을 수평방향으로 추가한 순서대로 배치합니다.&nbsp;



차이가&nbsp; 없기 때문에 설명 없이 예제 코드만 추가해둡니다.



<figure><img data-lazy-fallback="1" data-attachment-id="5522" data-permalink="https://webnautes.blog/5516/image-105-2/" data-orig-file="https://i0.wp.com/webnautes.blog/wp-content/uploads/2023/08/image-105.png?fit=878%2C566&amp;ssl=1" data-orig-size="878,566" data-comments-opened="1" data-image-meta="{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}" data-image-title="image-105" data-image-description="" data-image-caption="" data-medium-file="https://i0.wp.com/webnautes.blog/wp-content/uploads/2023/08/image-105.png?fit=300%2C193&amp;ssl=1" data-large-file="https://i0.wp.com/webnautes.blog/wp-content/uploads/2023/08/image-105.png?fit=878%2C566&amp;ssl=1" decoding="async" src="https://i0.wp.com/webnautes.blog/wp-content/uploads/2023/08/image-105.png?w=600&amp;ssl=1" alt="" sizes="(max-width: 878px) 100vw, 878px" data-recalc-dims="1" data-old-src="https://i0.wp.com/webnautes.blog/wp-content/uploads/2023/08/image-105.png?w=600&amp;is-pending-load=1#038;ssl=1" data-lazy-srcset="https://i0.wp.com/webnautes.blog/wp-content/uploads/2023/08/image-105.png?w=878&amp;ssl=1 878w, https://i0.wp.com/webnautes.blog/wp-content/uploads/2023/08/image-105.png?resize=300%2C193&amp;ssl=1 300w, https://i0.wp.com/webnautes.blog/wp-content/uploads/2023/08/image-105.png?resize=768%2C495&amp;ssl=1 768w"></figure>



<pre><code>#include &lt;QWidget&gt;
#include &lt;QApplication&gt;
#include &lt;QHBoxLayout&gt;
#include &lt;QPushButton&gt;

class MainWindow: public QWidget {

 public:
 MainWindow(QWidget *parent = nullptr);
};

MainWindow::MainWindow(QWidget *parent)
 : QWidget(parent) {

 auto *hbox = new QHBoxLayout(this);
 hbox-&gt;setSpacing(1);

 auto *settings = new QPushButton("Settings", this);
 settings-&gt;setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);

 auto *accounts = new QPushButton("Accounts", this);
 accounts-&gt;setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);

 auto *loans = new QPushButton("Loans", this);
 loans-&gt;setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);

 auto *cash = new QPushButton("Cash", this);
 cash-&gt;setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);

 auto *debts = new QPushButton("Debts", this);
 debts-&gt;setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);

 hbox-&gt;addWidget(settings);
 hbox-&gt;addWidget(accounts);
 hbox-&gt;addWidget(loans);
 hbox-&gt;addWidget(cash);
 hbox-&gt;addWidget(debts);

 setLayout(hbox);
}

int main(int argc, char *argv[]) {

 QApplication app(argc, argv);

 MainWindow window;

 window.resize(240, 230);
 window.setWindowTitle("VerticalBox");
 window.show();

 return app.exec();
}</code></pre>





</div></div>

멈춤보단 천천히라도

webnautes

QVBoxLayout QHBoxLayout QT5 예제입니다.  아래 사이트의 QT 강좌를 공부하며 정리 차원에서 작성하는 포스트입니다.  https://zetcode.com/gui/qt5 2021. 08. 19 – 최초작성 터미널에서 빌드 및 실행을 진행합니다. 편집기는 익숙한 것을 사용하세요.  1. 프로젝트 파일들을 저장할 디렉토리를 생성하고 이동합니다. 2. layout.cpp 파일을 생성하여 다음 코드를 복사하여 붙여넣기합니다. auto *vbox = new QVBoxLayout(this);   vbox->setSpacing(1); QVBoxLayout을 만들고 자식 위젯간의 사이 간격을 … 더 보기 »QT 강좌 07 –  QVBoxLayout, QHBoxLayout
The post QT 강좌 07 –  QVBoxLayout, QHBoxLayout first appeared on 멈춤보단 천천히라도.

QT 강좌 07 – QVBoxLayout, QHBoxLayout

댓글