【C++】Qt QTimeEditで時刻入力ウィジェットを柔軟に設定する方法

2025-04-29更新日: 2025-04-29

C++とQtを使って、GUI上で時間を操作できる部品としてQTimeEditが利用できます。

setTimeで初期時刻をセットし、setDisplayFormatで24時間表示などのフォーマットを指定するため、ユーザーにとってわかりやすい時刻入力が実現できます。

さらに、setMinimumTimeとsetMaximumTimeで選択可能な時間範囲を制限でき、用途に沿った設定が可能な便利なウィジェットです。

目次から探す

QTimeEditの初期設定

インスタンス生成と初期時刻の設定

QtのQTimeEditは、使いやすい時刻入力ウィジェットとして知られているです。

簡単にインスタンスを作成でき、QTime::currentTime()を利用して直近の時刻を初期値に設定することができるです。

以下のサンプルコードは、QTimeEditウィジェットをウィンドウに追加し、現在の時刻を反映させた例です。

#include <QApplication>
#include <QTimeEdit>
#include <QTime>
#include <QWidget>
#include <QVBoxLayout>
int main(int argc, char *argv[])
{
    QApplication app(argc, argv);
    // ウィジェット全体をまとめるウィジェットを作成
    QWidget window;
    window.setWindowTitle("QTimeEdit 初期設定サンプル");
    // レイアウトを設定
    QVBoxLayout layout(&window);
    // QTimeEditウィジェットのインスタンスを生成
    QTimeEdit *timeEdit = new QTimeEdit(&window);
    // 現在の時刻を取得し初期値に設定
    timeEdit->setTime(QTime::currentTime());
    // レイアウトにウィジェットを追加
    layout.addWidget(timeEdit);
    // ウィジェットを表示
    window.show();
    return app.exec();
}

(ウィンドウに初期時刻が表示されたQTimeEditウィジェットが現れる)

コード内では、QApplicationとQWidgetを利用し、シンプルなGUIアプリケーションの形にしているです。

インスタンス生成後、直ちにsetTime()メソッドを使用して現在時刻を設定する点に注目してください。

デフォルト動作の確認

QTimeEditの初期設定では、時刻のフォーマットはシステム依存のデフォルト形式が適用されるです。

ウィジェットの初期動作としては、以下の点が挙げられるです。

キー入力による時刻編集が可能
画面上のスピンボタンで値の増減ができる
ユーザーがカーソルで個々の値を選択することができる

これらの動作を利用することで、特に複雑な設定を行わなくても時刻入力機能を実装できるため、手軽に利用開始できるメリットがです。

ウィジェットの初期動作は、Qtのデフォルト動作に沿って機能するので、非常に直感的に利用できる仕組みになっているです。

時刻表示フォーマットの変更

利用可能なフォーマットオプション

QTimeEditの表示形式は、setDisplayFormat()メソッドを使用して自由に変更が可能です。

フォーマット文字列により、時刻の各要素(時間、分、秒)の表示形式が制御されるです。

以下のリストは、よく使われるフォーマット指定子をご紹介するです。

HH : 24時間制の時間(例: 00～23)
hh : 12時間制の時間(例: 01～12)
mm : 分(00～59)
ss : 秒(00～59)
AP または ap : 12時間制で午前/午後の表示

また、例えば表示形式を「時:分:秒」と区切り文字を付ける場合、"HH:mm:ss"というフォーマット文字列を渡せば、シンプルな24時間制表示が実現できるです。

下記のコードサンプルはこれらの設定方法を示しているです。

#include <QApplication>
#include <QTimeEdit>
#include <QTime>
#include <QWidget>
#include <QVBoxLayout>
int main(int argc, char *argv[])
{
    QApplication app(argc, argv);
    QWidget window;
    window.setWindowTitle("QTimeEdit フォーマット変更サンプル");
    QVBoxLayout layout(&window);
    QTimeEdit *timeEdit = new QTimeEdit(&window);
    // 表示形式を24時間制の「時間:分:秒」に設定
    timeEdit->setDisplayFormat("HH:mm:ss");
    layout.addWidget(timeEdit);
    window.show();
    return app.exec();
}

(ウィンドウ上に24時間制で「時間:分:秒」の形式で表示されるQTimeEditウィジェット)

このサンプルでは、表示形式の文字列がどのように機能するかを確認できるです。

フォーマット文字列内に付ける区切り文字なども自由に変更ができるので、プロジェクトの要件に合わせたカスタマイズが可能です。

24時間制と12時間制の設定

時刻表示において、24時間制と12時間制の選択は重要なポイントになるです。

QTimeEditでは以下のように設定することで、どちらの形式にも対応が可能です。

24時間制の場合：フォーマット文字列に"HH:mm:ss"または必要に応じたバリエーションを指定するです
12時間制の場合：フォーマット文字列に"hh:mm:ss AP"と指定することで、午前・午後の表示を付け加えることができるです

下記は12時間制を採用したサンプルコードです。

#include <QApplication>
#include <QTimeEdit>
#include <QTime>
#include <QWidget>
#include <QVBoxLayout>
int main(int argc, char *argv[])
{
    QApplication app(argc, argv);
    QWidget window;
    window.setWindowTitle("12時間制 QTimeEdit サンプル");
    QVBoxLayout layout(&window);
    QTimeEdit *timeEdit = new QTimeEdit(&window);
    // 12時間制の時刻表示に設定。APで午前/午後を表示
    timeEdit->setDisplayFormat("hh:mm:ss AP");
    layout.addWidget(timeEdit);
    window.show();
    return app.exec();
}

(ウィンドウ上に「hh:mm:ss AM/PM」形式で表示されるQTimeEditウィジェット)

このようにフォーマット文字列を変更するだけで、ユーザーが慣れ親しんだ形式で時刻を入力できるようになるため、柔軟な対応が可能な点が魅力です。

入力範囲の制限

最小時刻・最大時刻の設定方法

QTimeEditは、ユーザーが選択可能な時刻の範囲を簡単に設定できる点が嬉しいです。

setMinimumTime()およびsetMaximumTime()メソッドを利用することで、例えば業務時間などの制限を容易に実現できるです。

下記のコードは、午前9時から午後6時までの入力範囲に制限する例です。

#include <QApplication>
#include <QTimeEdit>
#include <QTime>
#include <QWidget>
#include <QVBoxLayout>
int main(int argc, char *argv[])
{
    QApplication app(argc, argv);
    QWidget window;
    window.setWindowTitle("範囲制限サンプル");
    QVBoxLayout layout(&window);
    QTimeEdit *timeEdit = new QTimeEdit(&window);
    // 初期時刻を設定
    timeEdit->setTime(QTime(12, 0, 0));
    // 最小時刻を午前9時に設定
    timeEdit->setMinimumTime(QTime(9, 0, 0));
    // 最大時刻を午後6時に設定
    timeEdit->setMaximumTime(QTime(18, 0, 0));
    layout.addWidget(timeEdit);
    window.show();
    return app.exec();
}

(ウィンドウ上のQTimeEditウィジェットで、時刻選択が9:00から18:00までに制限される)

設定済みの最小・最大時刻の範囲内でのみ時刻がデータとして採用されるので、予定された範囲外の値が選ばれるリスクが低減されるです。

これにより、アプリケーションの入力バリデーションがシンプルになるとともに、ユーザーの操作ミスを防止できるです。

ユーザー入力のバリデーション

ユーザーが時刻を入力する際、ウィジェット自体に備わるバリデーション機能が利用できるです。

しかし、カスタムチェックを行いたい場合は、ウィジェットのシグナルを利用して入力値を受け取り、手動でバリデーション処理を追加することも可能な仕組みになっているです。

具体的には、ユーザーが時刻を変更した際にシグナルが発生し、そのシグナルをキャッチして入力値が想定範囲内か検証できるです。

たとえば、変更された時刻と設定している最小・最大値を比較するなどの処理が考えられるです。

以下は、時刻変更時にコンソールへログ出力を行う簡単な例です。

#include <QApplication>
#include <QTimeEdit>
#include <QTime>
#include <QWidget>
#include <QVBoxLayout>
#include <QObject>
#include <QDebug>
// 時刻変更時の処理を定義する関数
void onTimeChanged(const QTime &time)
{
    // 入力された時刻を簡単にチェックする
    qDebug() << "新しい時刻:" << time.toString("HH:mm:ss");
}
int main(int argc, char *argv[])
{
    QApplication app(argc, argv);
    QWidget window;
    window.setWindowTitle("入力バリデーションサンプル");
    QVBoxLayout layout(&window);
    QTimeEdit *timeEdit = new QTimeEdit(&window);
    timeEdit->setTime(QTime(12, 0, 0));
    timeEdit->setMinimumTime(QTime(9, 0, 0));
    timeEdit->setMaximumTime(QTime(18, 0, 0));
    // シグナルとスロットを接続。値が変更されるとonTimeChanged関数が呼ばれる
    QObject::connect(timeEdit, &QTimeEdit::timeChanged, onTimeChanged);
    layout.addWidget(timeEdit);
    window.show();
    return app.exec();
}

(ユーザーが時刻を変更するたびに、コンソールに「新しい時刻: hh:mm:ss」の出力が見られる)
新しい時刻: "13:00:00"
新しい時刻: "13:01:00"
新しい時刻: "13:02:00"
新しい時刻: "13:03:00"
新しい時刻: "13:04:00"

このような方法を取り入れることで、ユーザーの入力をリアルタイムにチェックし、ルールに沿った値のみを受け付ける柔軟なバリデーションが実現できるです。

シグナルとイベント処理

時刻変更シグナルの検知

QTimeEditはユーザーの操作に応じたシグナルを豊富に発行する仕組みが備わっているです。

特に重要なのが、時刻が変更された際に発生するtimeChangedシグナルです。

このシグナルを利用すると、ユーザーが時刻を変更したときに直ちに処理を実行できるので、リアルタイムなフィードバックやイベント処理が簡単に組み込めるです。

たとえば、変更後の値を即座に別のウィジェットに反映させたり、ログとして記録するなどの実装が可能なため、インタラクティブな動作が実現できるです。

以下に接続例を示すコードを掲載するです。

#include <QApplication>
#include <QTimeEdit>
#include <QVBoxLayout>
#include <QWidget>
#include <QObject>
#include <QDebug>
#include <QTime>
// ユーザー操作に応じた時刻変更イベントの処理を定義
void handleTimeChanged(const QTime &newTime)
{
    qDebug() << "時刻が変更されました:" << newTime.toString("HH:mm:ss");
}
int main(int argc, char *argv[])
{
    QApplication app(argc, argv);
    QWidget window;
    window.setWindowTitle("シグナル検知サンプル");
    QVBoxLayout layout(&window);
    QTimeEdit *timeEdit = new QTimeEdit(&window);
    timeEdit->setDisplayFormat("HH:mm:ss");
    timeEdit->setTime(QTime(10, 30, 0));
    // 時刻変更時のシグナルをhandleTimeChanged関数に接続
    QObject::connect(timeEdit, &QTimeEdit::timeChanged, handleTimeChanged);
    layout.addWidget(timeEdit);
    window.show();
    return app.exec();
}

(ユーザーがウィジェット上で時刻を変更すると「時刻が変更されました: hh:mm:ss」とコンソールにログが出力される)
時刻が変更されました: "11:30:00"

このシグナル機能の活用により、ウィジェットの状態変化に応じた柔軟なイベント処理が構築でき、ユーザー入力に即時対応できる点が魅力です。

スロット連携による動作拡張

シグナルと連動させたスロットを利用することで、入力時刻に関連した動作をカスタム実装することができるです。

たとえば、ユーザーが時刻を入力するたびに別ウィジェットの表示内容を変更したり、内部ロジックをトリガーする処理を実装することが可能なため、複雑なアプリケーションにも柔軟に対応できるメリットがです。

この仕組みを応用するサンプル例として、入力時刻に応じたメッセージを表示する簡単なコードを示すです。

#include <QApplication>
#include <QTimeEdit>
#include <QLabel>
#include <QVBoxLayout>
#include <QWidget>
#include <QObject>
#include <QTime>
// 時刻変更に応じたメッセージ表示のスロット
void updateLabel(QLabel *label, const QTime &time)
{
    // 文字列リテラルを利用して状態を表示
    label->setText("設定された時刻は " + time.toString("HH:mm:ss") + " です");
}
int main(int argc, char *argv[])
{
    QApplication app(argc, argv);
    QWidget window;
    window.setWindowTitle("スロット連携サンプル");
    QVBoxLayout layout(&window);
    QTimeEdit *timeEdit = new QTimeEdit(&window);
    timeEdit->setDisplayFormat("HH:mm:ss");
    timeEdit->setTime(QTime(14, 15, 0));
    QLabel *displayLabel = new QLabel("時刻を選択してください", &window);
    // timeChangedシグナルとラムダ式を利用してスロット連携
    QObject::connect(timeEdit, &QTimeEdit::timeChanged, [&displayLabel](const QTime &time) {
        updateLabel(displayLabel, time);
    });
    layout.addWidget(timeEdit);
    layout.addWidget(displayLabel);
    window.show();
    return app.exec();
}

(ウィンドウ上で時刻が変更されるたびに、ラベルが「設定された時刻は hh:mm:ss です」と更新される)

このような組み合わせにより、ユーザーインタラクションに応じたダイナミックな動作を実装できるため、より直感的な操作体験を実現できるです。

ウィジェットのカスタマイズ

外観や動作の調整オプション

QTimeEditウィジェットは、外観や動作面にもさまざまなカスタマイズオプションが用意されているです。

ウィジェットのサイズ、フォント、カラー、さらにはスピンボタンの配置など、利用者の好みに合わせた調整が可能なため、アプリケーションのデザインに統一感を持たせることができるです。

たとえば、ウィジェット全体の幅や高さを変更したり、独自のスタイルシート(CSSライクな記法)を設定して見た目を変えられる点が魅力です。

カスタムスタイルの適用例

QSS(Qt Style Sheets)を利用することで、簡単にウィジェットの外観をカスタマイズできるです。

下記の例は、QTimeEditに対して背景色とフォントサイズを変更するサンプルコードです。

#include <QApplication>
#include <QTimeEdit>
#include <QTime>
#include <QWidget>
#include <QVBoxLayout>
int main(int argc, char *argv[])
{
    QApplication app(argc, argv);
    QWidget window;
    window.setWindowTitle("カスタムスタイルサンプル");
    QVBoxLayout layout(&window);
    QTimeEdit *timeEdit = new QTimeEdit(&window);
    timeEdit->setDisplayFormat("HH:mm:ss");
    timeEdit->setTime(QTime::currentTime());
    // QSSを利用して、背景色とフォントサイズを変更
    timeEdit->setStyleSheet("QTimeEdit { background-color: #f0f8ff; font-size: 16px; color: #333333; }");
    layout.addWidget(timeEdit);
    window.show();
    return app.exec();
}

(ウィンドウで背景色が淡い青色、フォントサイズが大きめのQTimeEditウィジェットが表示される)

このように、QSSを活用することで、プロジェクト全体のデザイン指針に沿ったウィジェットの見た目調整が簡単に行えるので、自由度の高いカスタマイズが実現できるです。

インタラクション向上の工夫

利用者にとって使いやすい操作性を追求するために、ウィジェット間の連係やホバー効果などの工夫も取り入れられるです。

例えば、時刻入力の補助機能として、フォーカスが当たった際に入力内容を選択状態にする処理や、マウスオーバー時の色変化など、細かい操作性向上の施策が挙げられるです。

これらの工夫は、QSSやイベントフィルターを用いることで実装可能なため、ユーザーに優しいUI設計ができるです。

国際化とローカリゼーション対応

言語設定に基づくフォーマット変更

アプリケーションが多言語に対応する必要がある場合、QTimeEditの表示形式も柔軟に変えられるです。

Qtにはローカライズ対応のための仕組みが用意されており、例えばシステムのロケール設定に合わせて表示される時刻のフォーマットを変更することができるです。

具体的には、ユーザーのロケールに合わせてsetLocale()メソッドを呼び出すことで、入力補助や曜日、時刻の記号などの表示が自動的に切り替わる効果が期待できるです。

言語ごとの特徴を考慮して、フォーマット指定子を調整
ロケール固有の記号や順序に合わせた表示に変更可能

タイムゾーン考慮のポイント

国際化対応において、タイムゾーンの差異は見逃せない点です。

QTimeEdit自体はタイムゾーンの操作に直接関与しないが、アプリケーション全体としてタイムゾーンを管理する場合、表示する時刻と内部表現を明確に区別する必要がです。

たとえば、サーバー側とクライアント側で時刻を共有する場合、タイムゾーンの変換処理が別途必要になるので、この点に注意しながら実装を検討できるです。

入力エラーと例外処理

エラー発生時の対応方法

ユーザーが無効な値を入力した場合、QTimeEditは基本的なバリデーションを自動で行うですが、特にカスタムの処理が必要な場合は、シグナルを用いてエラーを検知することができるです。

入力値と設定された範囲を比較してエラー状態を確認するロジックを実装する場合、エラー発生時にダイアログを出すなどのフィードバックを与えることができるです。

以下は、入力エラー発生時に警告を表示する例を考えると、単にエラーログを出力するシンプルなパターンが挙げられるです。

#include <QApplication>
#include <QTimeEdit>
#include <QTime>
#include <QWidget>
#include <QVBoxLayout>
#include <QObject>
#include <QDebug>
// エラー発生時の処理をシンプルに表現
void handlePotentialError(const QTime &time)
{
    // ここではサンプルとして、午前8時以前の入力をエラーとみなす
    if (time < QTime(8, 0, 0)) {
        qDebug() << "エラー: 入力された時刻は午前8時以前です。" ;
    }
}
int main(int argc, char *argv[])
{
    QApplication app(argc, argv);
    QWidget window;
    window.setWindowTitle("入力エラー対応サンプル");
    QVBoxLayout layout(&window);
    QTimeEdit *timeEdit = new QTimeEdit(&window);
    timeEdit->setTime(QTime(9, 30, 0));
    // 範囲制限や初期値設定はここでは省略
    // 時刻が変更された際に、handlePotentialError関数でエラーをチェック
    QObject::connect(timeEdit, &QTimeEdit::timeChanged, handlePotentialError);
    layout.addWidget(timeEdit);
    window.show();
    return app.exec();
}

(ユーザーが午前8時より前の時刻を入力すると、コンソールにエラーメッセージが表示される)
エラー: 入力された時刻は午前8時以前です。

このように、想定外の入力が発生した場合に分かりやすいフィードバックを出せる工夫が有効なため、ユーザーの混乱を防ぐことができるです。

デバッグ時のポイントと留意点

デバッグ時には、ウィジェットに対する各種シグナルの発火状況や、入力値の変化を逐次確認することが重要です。

Qt Creatorのデバッガを活用し、タイムスタンプと入力値のログを出力するなどして、どのタイミングで問題が発生しているかを把握すると良いです。

また、以下の点に留意することが推奨されるです。

シグナルとスロットの接続状態を確認する
ユーザーインターフェースの変更が内部ロジックにどのような影響を与えるかを追跡する
タイムゾーンやローカル設定の変更が、表示フォーマットに反映されているかを確認する

これらの工夫により、入力に関するバグや仕様外の動作を効率的に検出できるので、安定した動作を実現しやすくなるです。

まとめ

今回の内容は、QTimeEditウィジェットを活用する際の基本設定から、表示形式の変更、入力範囲の制限、シグナル接続やスロット連携、さらに外観や国際化といった要素を柔軟に設定する方法について詳しく紹介したです。

各設定項目ごとに具体的なコードサンプルや工夫が示され、さまざまなアプリケーションシナリオに合わせたカスタマイズが可能な点が印象的です。

ユーザーが直感的に操作できる時刻入力ウィジェットを作成できるとともに、エラー検知やデバッグの視点からも充実した対応策が用意されているため、実装時の安心感が得られると思うです。