わたすけのへや
BlogProfileAbout this site
記事一覧ページへ移動

Qt Creatorの基礎の基礎 ーボタンを押すと終了するだけのソフトを作ろう

C/C++プログラミング
2024-10-15
2020-06-06

こんにちは、Qt 完全に理解したわたすけです。

今回は、Qt を最も手っ取り早く扱うことのできるであろう「Qt Creator」を使って、「ボタンを押したら終了する」プログラムを作ってみましょう。

環境

自分が実行した環境ですが、多分 Qt Creator が動けば多少 UI が違うくらいでこの記事通りにできると思います。

  • Arch Linux（KDE）
  • Qt Creator 4.12.2
  • C++、qmake

Qt Creator のインストールはすでにされているものとして進めます（インストール方法は解説しません　 yay -S qt-creator とかでいけるはず）

プロジェクト作成

まずはプロジェクトを作成しましょう。すべての始まりです。

プロジェクトの種類を決める

Qt Creator を開き、左上の「File→New File or Project」を選択します。

プロジェクト作成画面

このようなウィンドウが出てきます。「Application (Qt) →Qt Widgets Application」を選択し、次へ進みます。

場所を決める

プロジェクトの名前と場所を設定する画面

プロジェクト名と、保存する場所を決めます。「OnlyButtonToExit」となっていますが、好きにして OK です（たぶん）

ビルドシステム

デフォルトで「qmake」になってると思うのでそのまま次へ

クラスの情報

クラス情報

このような画面が出てきます。そのまんまで大丈夫だとは思いますが、「Generate form」にチェックが入ってるか確認しましょう。

ここからあとは Next ボタン押すだけで大丈夫です。これが終わったら、ひとまずプロジェクトの作成は完了です。

UI 部分の設計

UI を作ります。ボタンやらなんやらを GUI で好きに配置できます。Qt Creator は素晴らしいですね。

作成したプロジェクトが開かれていると思うので、左のファイル一覧のようなところから「Forms→mainWindow.ui」をダブルクリックしましょう。

ファイル一覧にある "mainwindow.ui" の様子

ここをダブルクリックすると、画面が切り替わります。

Qt CreatorのUI編集画面

これが、UI を設計するための画面です。直感的にボタンや文字列を配置することができるのでけっこう楽です。左の欄に、ボタンやテキストボックス等のパーツが並んでいます。

文字列（ラベル）を表示してみる

とりあえずお試しとして、文字を表示してみましょう。

左のメニューから "Label" を選ぶ

「Display Widgets→Label」 を頑張って探し出し、ドラッグアンドドロップで画像の黄色い枠の中に引っ張って離してみましょう。

（ちなみに、黄色い枠はそのままウィンドウの大きさになるので、大きすぎると思ったら右下の青い点を引っ張って調整することができます）

"TextLabel" と書かれたラベルが配置されている様子

「TextLabel」と書かれたところをダブルクリックすると文字列が編集できます。文章が長いと入り切らないので、青い点を引っ張って領域を広げてください。

"Qt完全に理解した" と書かれたラベルが配置されている様子

このような具合で楽にパーツを配置し、UI を設計できるのが Qt Creator の強みです。気になるものを片っ端から並べてみたりするのも良いかもしれません。

ボタンを作る

それでは、本題のボタンを作っていきましょう。

ボタンを配置してみる

まずはまた左の欄から、「Buttons→Push Button」 をドラッグアンドドロップで配置します。

左のメニューから "Push Button" を選んで配置した様子

ここでも、一応ボタンをダブルクリックするとボタンの文字が変更できます。

「ボタンを押したら終了する」機能を作る

それでは、肝心の「ボタンをクリックすると終了」する部分を実装していきましょう。

配置したボタンを右クリックします。

ボタンを右クリックした時に出てくるメニュー

メニューが出てくるので、「Go to slot...」をクリックします。

シグナル一覧から "clicked()" を選んでいる様子

ここで、**「〇〇の状態になったときの処理を追加する」**ことができます。今回は「クリックされた状態」の処理を追加したいため、clicked()を選択して OK を押します。

C++のコード（MainWindow::on_pushButton_clicked関数）

すると、このような画面に飛びます。この｛｝で囲まれた内部に「終了する」命令を書いてやれば良いわけです。

今回は C++を使っているので、終了にはこの文を用います。

exit(0);

MainWindow::on_pushButton_clicked関数でexit関数を呼ぶようにした様子

これで、処理の追加は終了です。やる内容がシンプルなだけあって簡単ですね（？）

実行、結果の確認

これができたら、早速実行してみましょう。

ビルドして実行のショートカットは Ctrl+R です。

実行結果

ボタンを押したらプログラムが終了するようになっていたら完了です！お疲れ様でした。

まとめ

ボタンを押されたときの動作を作るには

  1. Qt Creator 上で拡張子.ui のファイルをダブルクリックして UI 編集画面に移る
  2. 「Buttons→Push Button」を設置し、右クリック →「Go to slot...」→clicked()→OK
  3. ｛｝内に処理を書く

以上です。Qt Creator を使えば驚くほど楽に GUI ソフトウェアを開発できるため、ぜひ挑戦してみてください！

Comments

Powered by Giscus