見出し画像

Windowのサイズ変更とレイアウト

今回はWindowのサイズ変更をしても、レイアウトが崩れないようにするための内容

Qt Designer

いつも通りのQt Designer
まず、MainWindowではデフォルトで"centralwidget"というQWidgetが存在する
ところが、このWidgetはデフォルトで"Break Layout"の設定になっているため、ウィンドウサイズを変更しても、UIのサイズが変わらないので見た目がよくない
そこで、まず、MainWindowを選択して右クリックででるメニューから、一番下の"Lay out""Break Layout"以外を設定する
今回は"Lay Out in a Grid"にしている(用途で使うものを指定すればいい)

centralwidgetの設定変更

その後、図のようなUIを作成
今回はレイアウトの勉強なので、レイアウトを階層構造にしている

Layoutを用いたUI作成

コード

前回までのコードに以下を追加

        # Layout
        widget = self.ui.centralWidget()
        v_layout = self.ui.findChild(QVBoxLayout, 'verticalLayout')
        h_layout = self.ui.findChild(QHBoxLayout, 'horizontalLayout')
        lbl = self.ui.findChild(QLabel, 'label')
        btn = self.ui.findChild(QPushButton, 'pushButton')
        btn.clicked.connect(self.makeTeapot)
        h_layout.addWidget(lbl)
        h_layout.addWidget(btn)
        v_layout.addLayout(h_layout)
        widget.setLayout(v_layout)
        self.setCentralWidget(widget)

説明

まず、読み込んだUIから"centralwidget"を取得する
次に、配置した"verticalLayout""horizontalLayout"を取得
そして、"label""pushButton"を取得している

レイアウトの階層としては、以下の様になっている

・centralwidget
     ・verticalLayout
          ・horizontalLayout
               ・label
               ・pushButton

各UIを取得したら、クラスのUIに登録していく
まず、"horizontalLayout"にaddWidgetで"label""pushButton"を追加
次に、"verticalLayout"にaddLayoutで"horizontalLayout"を追加
次に、"centralwidget"にsetLayoutで"verticalLayout"を追加
最後に、setCentralWidgetでMainWindowに"centralwidget"を設定
これでOK

実行すると図のようなウィンドウが表示される

通常サイズ

左したをドラッグしてウィンドウサイズを小さくすると・・

最小サイズ

こんな感じにUIのサイズも変更される

この記事が気に入ったらサポートをしてみませんか?