Расширенный градиент

Question

Я пытаюсь сделать простую палитру цветов. Вначале он состоял из ползунков r, g, b и h, s, l, но позже я решил использовать go с более распространенным палитрой, с ползунком оттенка и вещами, как на этом изображении

образ

Это мой первый раз, когда я имею дело с цветами / градиентами, и я попытался сделать это и добиться градиента с помощью qlineargradient и понял, что градиент работает не так. Я не уверен, как программно нарисовать градиент, как на картинке. Как я могу нарисовать что-то подобное? Я не говорю о создании самого палитры цветов, а только о градиенте изображения.

Вот что я пробовал:

import sys
from PySide2.QtCore import *
from PySide2.QtGui import *
from PySide2.QtWidgets import *
import pathlib
import customColorsList


class widget(QWidget):
    def __init__(self):
        super(widget, self).__init__()

        self.resize(300, 300)

        self.setStyleSheet("background: qlineargradient("
                           "x1:0, y1:0,"
                           "x2:1, y2:1,"
                           "stop:0 white,"
                           "stop:0.5 green,"
                           "stop:1 black);")


if __name__ == '__main__':
    app = QApplication(sys.argv)
    w = widget()
    w.show()
    sys.exit(app.exec_())  

Answer 1

Вы не можете достичь этого с помощью простых градиентов, но вы можете использовать базовую c композицию с горизонтальным QLinearGradient для цвета и вертикальным для черного компонента.

Концепция basi c выглядит следующим образом:

        self.gradient = QtGui.QLinearGradient(0, 0, 1, 0)
        self.gradient.setCoordinateMode(QtGui.QGradient.ObjectBoundingMode)
        self.gradient.setColorAt(0, QtCore.Qt.white)
        self.gradient.setColorAt(0, QtCore.Qt.green)

        self.overlay = QtGui.QLinearGradient(0, 0, 0, 1)
        self.overlay.setCoordinateMode(QtGui.QGradient.ObjectBoundingMode)
        self.overlay.setColorAt(0, QtCore.Qt.transparent)
        self.overlay.setColorAt(1, QtCore.Qt.black)

В следующем примере я реализую виджет basi c для отображения цвета и простого интерфейса для его изменения:

пример градиента

from PyQt5 import QtCore, QtGui, QtWidgets

class Picker(QtWidgets.QWidget):
    def __init__(self, parent=None):
        super().__init__(parent)
        self.setMinimumSize(250, 250)

        self.gradient = QtGui.QLinearGradient(0, 0, 1, 0)
        self.gradient.setCoordinateMode(QtGui.QGradient.ObjectBoundingMode)
        self.gradient.setColorAt(0, QtCore.Qt.white)

        self.overlay = QtGui.QLinearGradient(0, 0, 0, 1)
        self.overlay.setCoordinateMode(QtGui.QGradient.ObjectBoundingMode)
        self.overlay.setColorAt(0, QtCore.Qt.transparent)
        self.overlay.setColorAt(1, QtCore.Qt.black)

    def setColor(self, color):
        self.gradient.setColorAt(1, color)
        self.update()

    def paintEvent(self, event):
        qp = QtGui.QPainter(self)
        qp.fillRect(self.rect(), self.gradient)
        qp.fillRect(self.rect(), self.overlay)


class Test(QtWidgets.QWidget):
    def __init__(self):
        super().__init__()
        layout = QtWidgets.QVBoxLayout(self)
        self.picker = Picker()
        layout.addWidget(self.picker)
        self.redSlider = QtWidgets.QSlider(QtCore.Qt.Horizontal, maximum=255)
        layout.addWidget(self.redSlider)
        self.greenSlider = QtWidgets.QSlider(QtCore.Qt.Horizontal, maximum=255)
        layout.addWidget(self.greenSlider)
        self.blueSlider = QtWidgets.QSlider(QtCore.Qt.Horizontal, maximum=255)
        layout.addWidget(self.blueSlider)

        self.redSlider.valueChanged.connect(self.updateColor)
        self.greenSlider.valueChanged.connect(self.updateColor)
        self.blueSlider.valueChanged.connect(self.updateColor)

        self.setColor(QtGui.QColor(QtCore.Qt.green))

    def setColor(self, color):
        self.redSlider.blockSignals(True)
        self.redSlider.setValue(color.red())
        self.redSlider.blockSignals(False)

        self.greenSlider.blockSignals(True)
        self.greenSlider.setValue(color.green())
        self.greenSlider.blockSignals(False)

        self.blueSlider.blockSignals(True)
        self.blueSlider.setValue(color.blue())
        self.blueSlider.blockSignals(False)

        self.updateColor()

    def updateColor(self):
        color = QtGui.QColor(
            self.redSlider.value(), 
            self.greenSlider.value(), 
            self.blueSlider.value()
            )
        self.picker.setColor(color)

if __name__ == '__main__':
    import sys
    app = QtWidgets.QApplication(sys.argv)
    test = Test()
    test.show()
    sys.exit(app.exec_())