Merge pull request #16120 from Ultimaker/CURA-10687_Restore_Color_Picker

Color Picker from Qt 6.4
This commit is contained in:
Remco Burema 2023-07-13 13:20:27 +02:00 committed by GitHub
commit f272dda946
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 3 additions and 155 deletions

View File

@ -1,152 +0,0 @@
// Copyright (c) 2022 UltiMaker
// Cura is released under the terms of the LGPLv3 or higher.
import QtQuick 2.15
import QtQuick.Controls 2.2
import QtQuick.Window 2.1
import QtQuick.Layouts 1.1
import UM 1.7 as UM
import Cura 1.7 as Cura
/*
* A dialog that provides the option to pick a color. Currently it only asks for a hex code and shows the color
* in a color swath
*/
UM.Dialog
{
id: base
property variant catalog: UM.I18nCatalog { name: "cura" }
margin: UM.Theme.getSize("default_margin").width
property alias swatchGridColumns: colorSwatchGrid.columns
// In this case we would like to let the content of the dialog determine the size of the dialog
// however with the current implementation of the dialog this is not possible, so instead we calculate
// the size of the dialog ourselves.
// Ugly workaround for windows having overlapping elements due to incorrect dialog width
minimumWidth: content.width + (Qt.platform.os === "windows" ? 4 * margin : 2 * margin)
minimumHeight: {
const footerHeight = Math.max(okButton.height, cancelButton.height);
return content.height + footerHeight + (Qt.platform.os === "windows" ? 5 * margin : 3 * margin);
}
property alias color: colorInput.text
property var swatchColors: [
"#2161AF", "#57AFB2", "#F7B32D", "#E33D4A", "#C088AD",
"#5D88BE", "#5ABD0E", "#E17239", "#F74E46", "#874AF9",
"#50C2EC", "#8DC15A", "#C3977A", "#CD7776", "#9086BA",
"#FFFFFF", "#D3D3D3", "#9E9E9E", "#5A5A5A", "#000000",
]
Component.onCompleted: updateSwatches()
onSwatchColorsChanged: updateSwatches()
function updateSwatches()
{
swatchColorsModel.clear();
for (const swatchColor of base.swatchColors)
{
swatchColorsModel.append({ swatchColor });
}
}
Column
{
id: content
width: childrenRect.width
height: childrenRect.height
spacing: UM.Theme.getSize("wide_margin").height
GridLayout {
id: colorSwatchGrid
columns: 5
width: childrenRect.width
height: childrenRect.height
columnSpacing: UM.Theme.getSize("thick_margin").width
rowSpacing: UM.Theme.getSize("thick_margin").height
Repeater
{
model: ListModel
{
id: swatchColorsModel
}
delegate: Rectangle
{
color: swatchColor
implicitWidth: UM.Theme.getSize("medium_button_icon").width
implicitHeight: UM.Theme.getSize("medium_button_icon").height
radius: width / 2
UM.ColorImage
{
anchors.fill: parent
visible: swatchColor == base.color
source: UM.Theme.getIcon("Check", "low")
color: UM.Theme.getColor("checkbox")
}
MouseArea
{
anchors.fill: parent
onClicked: base.color = swatchColor
}
}
}
}
RowLayout
{
width: parent.width
spacing: UM.Theme.getSize("default_margin").width
UM.Label
{
text: catalog.i18nc("@label", "Hex")
}
Cura.TextField
{
id: colorInput
Layout.fillWidth: true
text: "#FFFFFF"
selectByMouse: true
onTextChanged: {
if (!text.startsWith("#"))
{
text = `#${text}`;
}
}
validator: UM.HexColorValidator {}
}
Rectangle
{
color: base.color
Layout.preferredHeight: parent.height
Layout.preferredWidth: height
}
}
}
buttonSpacing: UM.Theme.getSize("thin_margin").width
rightButtons:
[
Cura.TertiaryButton {
id: cancelButton
text: catalog.i18nc("@action:button", "Cancel")
onClicked: base.close()
},
Cura.PrimaryButton {
id: okButton
text: catalog.i18nc("@action:button", "OK")
onClicked: base.accept()
}
]
}

View File

@ -256,12 +256,12 @@ Item
// popup dialog to select a new color
// if successful it sets the properties.color_code value to the new color
Cura.ColorDialog
ColorDialog
{
id: colorDialog
title: catalog.i18nc("@title", "Material color picker")
color: properties.color_code
onAccepted: base.setMetaDataEntry("color_code", properties.color_code, color)
selectedColor: properties.color_code
onAccepted: base.setMetaDataEntry("color_code", properties.color_code, selectedColor)
}
}
}