Qt カラーダイアログ

ホーム C/C++チュートリアル

カラーダイアログ

今回はカラーダイアログを説明します。

また、簡単なメニューも説明します。

OS によってソースコードの一部を変更する方法も説明します。

colordialog プロジェクト

colordialog という作業用ディレクトリを作ってください。

そして、そこに次の colordialog.cpp を記述して保存してください。

colordialog.cpp


/*************************************
    colordialog.cpp
    copyright    :  vivacocoa.jp
    last modified:  Mar. 28, 2025
*************************************/

#include <QWidget>
#include <QPainter>
#include <QApplication>
#include <QColorDialog>
#include <QMenu>
#include <QMenuBar>
#include <QMainWindow>

class ColorDialog : public QMainWindow
{
public:
  ColorDialog (QWidget *parent = 0);
  QColor color = QColor ("#ff6666");
  int space = 0;
  
  #ifdef WIN64
  #define space 30
  #endif 
  
protected:
  void paintEvent (QPaintEvent *e);
private slots:
  void ChooseColor ();
private:
  void doPainting ();
};

ColorDialog::ColorDialog (QWidget *parent)
: QMainWindow (parent)
{
  auto *choose = new QAction ("&Choose color...", this);
  QMenu *menu  = menuBar ()->addMenu ("&Color");
  menu->addAction (choose);
  	
  connect (choose, &QAction::triggered, this, &ColorDialog::ChooseColor);
}

void ColorDialog::ChooseColor ()
{
  auto current = color;
  color = QColorDialog::getColor (color, this);
  if (color == nullptr)
  {
    //printf ("cancel\n");
    color = current;
  } else {
    //printf ("ok\n");
  }
  this->repaint ();
}

void ColorDialog::paintEvent (QPaintEvent *e)
{
  Q_UNUSED (e);
  doPainting ();
}

void ColorDialog::doPainting ()
{
  auto size = this->size ();
  auto w = size.width ();
  auto h = size.height ();
  
  QPainter painter (this);
  painter.setPen (color);
  painter.setBrush (color);
  painter.drawRect (0, 0 + space, w, h - space);
}

int main (int argc, char **argv)
{
  QApplication app (argc, argv);
  
  ColorDialog win;
  win.resize (450, 300);
  win.setWindowTitle ("ColorDialog");
  win.show ();
  
  return app.exec ();
}

ビルド

colordialog ディレクトリで作業を続けます。

macOS Linux の場合


// プロジェクトを作ります。
qmake -project

// colordialog.pro というファイルができていると思います。
// colordialog.pro の末尾に次の行を追加してください。
QT += widgets

// Makefile を作ります。
qmake

// make します。
make

// コードにエラーがありましたら、コードを修正して再び make する作業を繰り返します。
// プロジェクトから作り直す必要はありません。

Windows の場合


// プロジェクトを作ります。
qmake -project

// colordialog.pro というファイルができていると思います。
// colordialog.pro の末尾に次の行を追加してください。
QT += widgets

// Makefile を作ります。
qmake

// nmake します。make じゃなく nmake です。
nmake

// コードにエラーがありましたら、コードを修正して再び nmake する作業を繰り返します。
// プロジェクトから作り直す必要はありません。

実行


// Mac の場合は、colordialog ディレクトリに colordialog.app ができていると思います。
// ターミナルで実行するには次のようにコマンドします。
./colordialog.app/Contents/MacOS/colordialog

// Linux の場合は、colordialog という実行ファイルが出来上がっています。これをそのまま実行します。
./colordialog

// Windows の場合は、
// colordialog の中の release ディレクトリの中に colordialog.exe が出来上がっています。

Mac の場合、colordialog ディレクトリにできている colordialog.app (colordialog という名前になっています) をダブルクリックしても起動します。

他の場所、例えばデスクトップに持って行ってもダブルクリックで起動します。

Debian、Fedora、Kali の場合も、colordialog ディレクトリにできている colordialog をダブルクリックしても起動します。

他の場所、例えばデスクトップに持って行ってもダブルクリックで起動します。

Ubuntu、Mint はシステムに登録しないとダブルクリックでは起動できなかったと思います。

Windows の場合は、出来上がった colordialog.exe は、どこに持って行ってもダブルクリックで起動できます。

Color メニューが表示されています。

Mac