From 0128cd56f000c20e9cdda6943e49e3ba066c1dc9 Mon Sep 17 00:00:00 2001 From: Yann Lanthony Date: Wed, 18 Jul 2018 22:43:57 +0200 Subject: [PATCH] [ui] add CompatibilityBadge on CompatibilityNodes * add badge icon on nodes in GraphEditor * add badge banner in AttributeEditor with upgrade button when available --- .../ui/qml/GraphEditor/AttributeEditor.qml | 19 +++++ .../ui/qml/GraphEditor/CompatibilityBadge.qml | 79 +++++++++++++++++++ meshroom/ui/qml/GraphEditor/GraphEditor.qml | 2 +- meshroom/ui/qml/GraphEditor/Node.qml | 21 ++++- meshroom/ui/qml/main.qml | 8 ++ 5 files changed, 126 insertions(+), 3 deletions(-) create mode 100644 meshroom/ui/qml/GraphEditor/CompatibilityBadge.qml diff --git a/meshroom/ui/qml/GraphEditor/AttributeEditor.qml b/meshroom/ui/qml/GraphEditor/AttributeEditor.qml index 29c69c38..8a4d48aa 100644 --- a/meshroom/ui/qml/GraphEditor/AttributeEditor.qml +++ b/meshroom/ui/qml/GraphEditor/AttributeEditor.qml @@ -12,6 +12,9 @@ ColumnLayout { property variant node: null // the node to edit property bool readOnly: false + readonly property bool isCompatibilityNode: node.hasOwnProperty("compatibilityIssue") + + signal upgradeRequest() spacing: 0 @@ -19,6 +22,7 @@ ColumnLayout { Layout.fillWidth: true background: Rectangle { color: Qt.darker(parent.palette.window, 1.15) } padding: 2 + RowLayout { width: parent.width @@ -55,6 +59,20 @@ ColumnLayout { } } + // CompatibilityBadge banner for CompatibilityNode + Loader { + active: isCompatibilityNode + Layout.fillWidth: true + visible: active // for layout update + + sourceComponent: CompatibilityBadge { + canUpgrade: root.node.canUpgrade + issueDetails: root.node.issueDetails + onUpgradeRequest: root.upgradeRequest() + sourceComponent: bannerDelegate + } + } + StackLayout { Layout.fillHeight: true Layout.fillWidth: true @@ -76,6 +94,7 @@ ColumnLayout { model: node ? node.attributes : undefined delegate: AttributeItemDelegate { + readOnly: root.isCompatibilityNode labelWidth: 180 width: attributesListView.width attribute: object diff --git a/meshroom/ui/qml/GraphEditor/CompatibilityBadge.qml b/meshroom/ui/qml/GraphEditor/CompatibilityBadge.qml new file mode 100644 index 00000000..f4e1c813 --- /dev/null +++ b/meshroom/ui/qml/GraphEditor/CompatibilityBadge.qml @@ -0,0 +1,79 @@ +import QtQuick 2.9 +import QtQuick.Controls 2.3 +import QtQuick.Layouts 1.3 +import MaterialIcons 2.2 + + +/** Node Badge to inform about compatibility issues + * Provides 2 delegates (can be set using sourceComponent property): + * - iconDelegate (default): icon + tooltip with information about the issue + * - bannerDelegate: banner with issue info + upgrade request button +*/ +Loader { + id: root + + property bool canUpgrade + property string issueDetails + property color color: canUpgrade ? "#E68A00" : "#F44336" + + signal upgradeRequest() + + sourceComponent: iconDelegate + + property Component iconDelegate: Component { + + Label { + + text: MaterialIcons.warning + font.family: MaterialIcons.fontFamily + font.pointSize: 12 + color: root.color + + MouseArea { + anchors.fill: parent + hoverEnabled: true + onPressed: mouse.accepted = false + ToolTip.text: issueDetails + ToolTip.visible: containsMouse + } + } + } + + property Component bannerDelegate: Component { + + Pane { + padding: 6 + clip: true + background: Rectangle { color: root.color } + + RowLayout { + width: parent.width + Column { + Layout.fillWidth: true + Label { + width: parent.width + elide: Label.ElideMiddle + font.bold: true + text: "Compatibility issue" + color: "white" + } + Label { + width: parent.width + elide: Label.ElideMiddle + text: root.issueDetails + color: "white" + } + } + Button { + visible: root.canUpgrade && (parent.width > width) ? 1 : 0 + palette.window: root.color + palette.button: Qt.darker(root.color, 1.2) + palette.buttonText: "white" + text: "Upgrade" + onClicked: upgradeRequest() + } + } + } + + } +} diff --git a/meshroom/ui/qml/GraphEditor/GraphEditor.qml b/meshroom/ui/qml/GraphEditor/GraphEditor.qml index f382fd07..3b1ed79b 100755 --- a/meshroom/ui/qml/GraphEditor/GraphEditor.qml +++ b/meshroom/ui/qml/GraphEditor/GraphEditor.qml @@ -237,7 +237,7 @@ Item { node: object width: root.nodeWidth readOnly: root.readOnly - baseColor: root.selectedNode == node ? Qt.lighter("#607D8B", 1.2) : "#607D8B" + baseColor: root.selectedNode == node ? Qt.lighter(defaultColor, 1.2) : defaultColor onAttributePinCreated: registerAttributePin(attribute, pin) onAttributePinDeleted: unregisterAttributePin(attribute, pin) diff --git a/meshroom/ui/qml/GraphEditor/Node.qml b/meshroom/ui/qml/GraphEditor/Node.qml index c49e015b..9e83d62d 100755 --- a/meshroom/ui/qml/GraphEditor/Node.qml +++ b/meshroom/ui/qml/GraphEditor/Node.qml @@ -6,10 +6,12 @@ import Utils 1.0 Item { id: root - property variant node: object + property variant node property bool readOnly: false - property color baseColor: "#607D8B" + property color baseColor: defaultColor property color shadowColor: "black" + readonly property bool isCompatibilityNode: node.hasOwnProperty("compatibilityIssue") + readonly property color defaultColor: isCompatibilityNode ? "#444" : "#607D8B" signal pressed(var mouse) signal doubleClicked(var mouse) @@ -178,4 +180,19 @@ Item { } Item { width: 1; height: 2} } + + // CompatibilityBadge icon for CompatibilityNodes + Loader { + active: root.isCompatibilityNode + anchors { + right: parent.right + top: parent.top + margins: -4 + } + sourceComponent: CompatibilityBadge { + sourceComponent: iconDelegate + canUpgrade: root.node.canUpgrade + issueDetails: root.node.issueDetails + } + } } diff --git a/meshroom/ui/qml/main.qml b/meshroom/ui/qml/main.qml index f2c9b71e..ae3a1ec5 100755 --- a/meshroom/ui/qml/main.qml +++ b/meshroom/ui/qml/main.qml @@ -442,6 +442,14 @@ ApplicationWindow { node: graphEditor.selectedNode // Make AttributeEditor readOnly when computing readOnly: _reconstruction.computing + + onUpgradeRequest: { + var delegate = graphEditor.nodeDelegate(node.name) + var posX = delegate.x + var posY = delegate.y + _reconstruction.upgradeNode(node) + graphEditor.moveNode(node.name, posX, posY) + } } } }