Changed color button to a line edit+button combination

Sat, 08 Apr 2023 15:03:54 +0300

author
Teemu Piippo <teemu.s.piippo@gmail.com>
date
Sat, 08 Apr 2023 15:03:54 +0300
changeset 344
a24da8de2a3b
parent 343
4a82990affd5
child 345
81cd5dee6d77

Changed color button to a line edit+button combination

src/settingseditor/settingseditor.ui file | annotate | diff | comparison | revisions
widgets/colorbutton.cpp file | annotate | diff | comparison | revisions
widgets/colorbutton.h file | annotate | diff | comparison | revisions
--- a/src/settingseditor/settingseditor.ui	Sat Apr 08 12:55:11 2023 +0300
+++ b/src/settingseditor/settingseditor.ui	Sat Apr 08 15:03:54 2023 +0300
@@ -117,11 +117,7 @@
                  </widget>
                 </item>
                 <item row="0" column="1">
-                 <widget class="ColorButton" name="mainColorButton">
-                  <property name="text">
-                   <string/>
-                  </property>
-                 </widget>
+                 <widget class="ColorButton" name="mainColorButton"/>
                 </item>
                 <item row="1" column="0">
                  <widget class="QLabel" name="label_5">
@@ -131,11 +127,7 @@
                  </widget>
                 </item>
                 <item row="1" column="1">
-                 <widget class="ColorButton" name="selectedColorButton">
-                  <property name="text">
-                   <string/>
-                  </property>
-                 </widget>
+                 <widget class="ColorButton" name="selectedColorButton"/>
                 </item>
                 <item row="2" column="0">
                  <widget class="QLabel" name="label_3">
@@ -145,11 +137,7 @@
                  </widget>
                 </item>
                 <item row="2" column="1">
-                 <widget class="ColorButton" name="backgroundColorButton">
-                  <property name="text">
-                   <string/>
-                  </property>
-                 </widget>
+                 <widget class="ColorButton" name="backgroundColorButton"/>
                 </item>
                 <item row="3" column="0">
                  <widget class="QLabel" name="label_4">
--- a/widgets/colorbutton.cpp	Sat Apr 08 12:55:11 2023 +0300
+++ b/widgets/colorbutton.cpp	Sat Apr 08 15:03:54 2023 +0300
@@ -1,5 +1,6 @@
 #include <QColorDialog>
 #include <QStyleFactory>
+#include <QHBoxLayout>
 #include "widgets/colorbutton.h"
 
 ColorButton::ColorButton(const QColor& color, QWidget* parent) :
@@ -9,33 +10,52 @@
 }
 
 ColorButton::ColorButton(QWidget* parent) :
-	QPushButton{parent}
+	QWidget{parent},
+	lineEdit{new QLineEdit{this}},
+	button{new QPushButton{"…", this}}
 {
-	connect(this, &QPushButton::clicked, [&](){
-		const QColor color = QColorDialog::getColor(this->storedSelectedColor, this->parentWidget());
+	auto*const layout = new QHBoxLayout{};
+	layout->addWidget(this->lineEdit);
+	layout->addWidget(this->button);
+	layout->setStretch(0, 1);
+	layout->setStretch(1, 0);
+	this->setLayout(layout);
+	connect(this->button, &QPushButton::clicked, [&](){
+		const QColor color = QColorDialog::getColor(this->color(), this->parentWidget());
 		if (color.isValid()) {
 			this->setColor(color);
 		}
 	});
+	connect(this->lineEdit, &QLineEdit::textChanged, [&]{
+		const QColor color = this->color();
+		QPalette palette{color};
+		const qreal lightness = color.lightnessF();
+		const QColor foreground = lightness < 0.4 ? Qt::white : Qt::black;
+		const auto style = QStyleFactory::create("Fusion");
+		this->setStyle(style);
+		this->setStyleSheet(QStringLiteral(
+			"*{background-color: %1; color: %2;}"
+		).arg(color.name()).arg(foreground.name()));
+		/*
+		palette.setColor(QPalette::ButtonText, foreground);
+		for (QWidget* widget : {(QWidget*)this->lineEdit, (QWidget*)this->button}) {
+			widget->setPalette(palette);
+			widget->setStyle(style);
+		}
+		*/
+		Q_EMIT this->colorChanged(this->color());
+	});
 	this->setColor(Qt::black);
 }
 
-const QColor& ColorButton::color() const
+QColor ColorButton::color() const
 {
-	return this->storedSelectedColor;
+	return QColor{this->lineEdit->text()};
 }
 
 void ColorButton::setColor(const QColor& color)
 {
-	if (this->storedSelectedColor != color) {
-		this->storedSelectedColor = color;
-		this->setText(color.name());
-		QPalette palette{color};
-		const qreal lightness = color.lightnessF();
-		const QColor foreground = lightness < 0.4 ? Qt::white : Qt::black;
-		palette.setColor(QPalette::ButtonText, foreground);
-		this->setPalette(palette);
-		this->setStyle(QStyleFactory::create("Fusion"));
-		Q_EMIT this->colorChanged(this->storedSelectedColor);
+	if (color.isValid() and this->color() != color) {
+		this->lineEdit->setText(color.name());
 	}
 }
--- a/widgets/colorbutton.h	Sat Apr 08 12:55:11 2023 +0300
+++ b/widgets/colorbutton.h	Sat Apr 08 15:03:54 2023 +0300
@@ -1,18 +1,20 @@
 #pragma once
 #include <QPushButton>
+#include <QLineEdit>
 
 /**
  * @brief A button that can be used to select a color
  */
-class ColorButton : public QPushButton
+class ColorButton : public QWidget
 {
 	Q_OBJECT
 	Q_PROPERTY(QColor color READ color WRITE setColor NOTIFY colorChanged)
-	QColor storedSelectedColor;
+	QLineEdit* lineEdit;
+	QPushButton* button;
 public:
 	ColorButton(const QColor& color = {}, QWidget* parent = nullptr);
 	ColorButton(QWidget* parent = nullptr);
-	const QColor& color() const;
+	QColor color() const;
 	Q_SLOT void setColor(const QColor& color);
 	Q_SIGNAL void colorChanged(const QColor& color);
 };

mercurial