From 44fa5d90d622f9eb598cc9aeaac0d3476f2fe0c5 Mon Sep 17 00:00:00 2001 From: Thomas Hartmann Date: Thu, 31 Aug 2023 18:02:29 +0200 Subject: [PATCH] QmlDesigner: Refactor QML in Connection Editor MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Moving the StatementEditor into a separate component, so it can be used for else case. Change-Id: I2fc5a002333d63a484142a997882e502ffcc4016 Reviewed-by: Henning Gründl --- .../ConnectionsDialogForm.qml | 240 +--------------- .../connectionseditor/StatementEditor.qml | 258 ++++++++++++++++++ 2 files changed, 268 insertions(+), 230 deletions(-) create mode 100644 share/qtcreator/qmldesigner/connectionseditor/StatementEditor.qml diff --git a/share/qtcreator/qmldesigner/connectionseditor/ConnectionsDialogForm.qml b/share/qtcreator/qmldesigner/connectionseditor/ConnectionsDialogForm.qml index 7380d47aeb8..669bbc190c1 100644 --- a/share/qtcreator/qmldesigner/connectionseditor/ConnectionsDialogForm.qml +++ b/share/qtcreator/qmldesigner/connectionseditor/ConnectionsDialogForm.qml @@ -75,233 +75,13 @@ Column { } } - // Call Function - Row { - visible: action.currentValue === ConnectionModelStatementDelegate.CallFunction - spacing: root.horizontalSpacing - - PopupLabel { text: qsTr("Item") ; tooltip: qsTr("The target item of the function.")} - PopupLabel { text: qsTr("Method") ; tooltip: qsTr("The name of the function.")} - } - - Row { - visible: action.currentValue === ConnectionModelStatementDelegate.CallFunction - spacing: root.horizontalSpacing - - StudioControls.TopLevelComboBox { - id: functionId - style: StudioTheme.Values.connectionPopupControlStyle - width: root.columnWidth - - model: backend.okStatement.function.id.model ?? 0 - - onActivated: backend.okStatement.function.id.activateIndex(functionId.currentIndex) - property int currentTypeIndex: backend.okStatement.function.id.currentIndex ?? 0 - onCurrentTypeIndexChanged: functionId.currentIndex = functionId.currentTypeIndex - } - - StudioControls.TopLevelComboBox { - id: functionName - style: StudioTheme.Values.connectionPopupControlStyle - width: root.columnWidth - model: backend.okStatement.function.name.model ?? 0 - - onActivated: backend.okStatement.function.name.activateIndex(functionName.currentIndex) - property int currentTypeIndex: backend.okStatement.function.name.currentIndex ?? 0 - onCurrentTypeIndexChanged: functionName.currentIndex = functionName.currentTypeIndex - } - } - - // Assign - Row { - visible: action.currentValue === ConnectionModelStatementDelegate.Assign - spacing: root.horizontalSpacing - - PopupLabel { text: qsTr("From") ; tooltip: qsTr("The Property to assign from.")} - PopupLabel { text: qsTr("To"); tooltip: qsTr("The Property to assign to.") } - } - - Row { - visible: action.currentValue === ConnectionModelStatementDelegate.Assign - spacing: root.horizontalSpacing - - StudioControls.TopLevelComboBox { - id: rhsAssignmentId - style: StudioTheme.Values.connectionPopupControlStyle - width: root.columnWidth - //from - rhs - id - - model: backend.okStatement.rhsAssignment.id.model ?? 0 - - onActivated: backend.okStatement.rhsAssignment.id.activateIndex(rhsAssignmentId.currentIndex) - property int currentTypeIndex: backend.okStatement.rhsAssignment.id.currentIndex ?? 0 - onCurrentTypeIndexChanged: rhsAssignmentId.currentIndex = rhsAssignmentId.currentTypeIndex - } - - StudioControls.TopLevelComboBox { - id: lhsAssignmentId - style: StudioTheme.Values.connectionPopupControlStyle - width: root.columnWidth - //to lhs - id - model: backend.okStatement.lhs.id.model ?? 0 - - onActivated: backend.okStatement.lhs.id.activateIndex(lhsAssignmentId.currentIndex) - property int currentTypeIndex: backend.okStatement.lhs.id.currentIndex ?? 0 - onCurrentTypeIndexChanged: lhsAssignmentId.currentIndex = lhsAssignmentId.currentTypeIndex - } - } - - Row { - visible: action.currentValue === ConnectionModelStatementDelegate.Assign - spacing: root.horizontalSpacing - - StudioControls.TopLevelComboBox { - id: rhsAssignmentName - style: StudioTheme.Values.connectionPopupControlStyle - width: root.columnWidth - //from - rhs - name - - model: backend.okStatement.rhsAssignment.name.model ?? 0 - - onActivated: backend.okStatement.rhsAssignment.name.activateIndex(rhsAssignmentName.currentIndex) - property int currentTypeIndex: backend.okStatement.rhsAssignment.name.currentIndex ?? 0 - onCurrentTypeIndexChanged: rhsAssignmentName.currentIndex = rhsAssignmentName.currentTypeIndex - } - - StudioControls.TopLevelComboBox { - id: lhsAssignmentName - style: StudioTheme.Values.connectionPopupControlStyle - width: root.columnWidth - //to lhs - name - model: backend.okStatement.lhs.name.model ?? 0 - - onActivated: backend.okStatement.lhs.name.activateIndex(lhsAssignmentName.currentIndex) - property int currentTypeIndex: backend.okStatement.lhs.name.currentIndex ?? 0 - onCurrentTypeIndexChanged: lhsAssignmentName.currentIndex = lhsAssignmentName.currentTypeIndex - } - } - - // Change State - Row { - visible: action.currentValue === ConnectionModelStatementDelegate.ChangeState - spacing: root.horizontalSpacing - - PopupLabel { text: qsTr("State Group"); tooltip: qsTr("The State Group.") } - PopupLabel { text: qsTr("State"); tooltip: qsTr("The State .") } - } - - Row { - visible: action.currentValue === ConnectionModelStatementDelegate.ChangeState - spacing: root.horizontalSpacing - - StudioControls.TopLevelComboBox { - id: stateGroups - style: StudioTheme.Values.connectionPopupControlStyle - width: root.columnWidth - model: backend.okStatement.stateTargets.model ?? 0 - - onActivated: backend.okStatement.stateTargets.activateIndex(stateGroups.currentIndex) - property int currentTypeIndex: backend.okStatement.stateTargets.currentIndex ?? 0 - onCurrentTypeIndexChanged: stateGroups.currentIndex = stateGroups.currentTypeIndex - } - - StudioControls.TopLevelComboBox { - id: states - style: StudioTheme.Values.connectionPopupControlStyle - width: root.columnWidth - - model: backend.okStatement.states.model ?? 0 - - onActivated: backend.okStatement.states.activateIndex(states.currentIndex) - property int currentTypeIndex: backend.okStatement.states.currentIndex ?? 0 - onCurrentTypeIndexChanged: states.currentIndex = states.currentTypeIndex - } - } - - // Set Property - Row { - visible: action.currentValue === ConnectionModelStatementDelegate.SetProperty - spacing: root.horizontalSpacing - - PopupLabel { text: qsTr("Item"); tooltip: qsTr("The Item.")} - PopupLabel { text: qsTr("Property"); tooltip: qsTr("The property of the item.")} - } - - Row { - visible: action.currentValue === ConnectionModelStatementDelegate.SetProperty - spacing: root.horizontalSpacing - - StudioControls.TopLevelComboBox { - id: lhsPropertyId - style: StudioTheme.Values.connectionPopupControlStyle - width: root.columnWidth - - model: backend.okStatement.lhs.id.model ?? 0 - - onActivated: backend.okStatement.lhs.id.activateIndex(lhsPropertyId.currentIndex) - property int currentTypeIndex: backend.okStatement.lhs.id.currentIndex ?? 0 - onCurrentTypeIndexChanged: lhsPropertyId.currentIndex = lhsPropertyId.currentTypeIndex - - } - - StudioControls.TopLevelComboBox { - id: lhsPropertyName - style: StudioTheme.Values.connectionPopupControlStyle - width: root.columnWidth - model: backend.okStatement.lhs.name.model ?? 0 - - onActivated: backend.okStatement.lhs.name.activateIndex(lhsPropertyName.currentIndex) - property int currentTypeIndex: backend.okStatement.lhs.name.currentIndex ?? 0 - onCurrentTypeIndexChanged: lhsPropertyName.currentIndex = lhsPropertyName.currentTypeIndex - } - } - - PopupLabel { - visible: action.currentValue === ConnectionModelStatementDelegate.SetProperty - text: qsTr("Value") - } - - StudioControls.TextField { - id: setPropertyArgument - visible: action.currentValue === ConnectionModelStatementDelegate.SetProperty - width: root.width - actionIndicatorVisible: false - translationIndicatorVisible: false - - text: backend.okStatement.stringArgument.text ?? "" - onEditingFinished: { - backend.okStatement.stringArgument.activateText(setPropertyArgument.text) - } - } - - // Print Message - PopupLabel { - visible: action.currentValue === ConnectionModelStatementDelegate.PrintMessage - text: qsTr("Message") - tooltip: qsTr("The message that is printed.") - } - - StudioControls.TextField { - id: messageString - visible: action.currentValue === ConnectionModelStatementDelegate.PrintMessage - width: root.width - actionIndicatorVisible: false - translationIndicatorVisible: false - text: backend.okStatement.stringArgument.text ?? "" - onEditingFinished: { - backend.okStatement.stringArgument.activateText(messageString.text) - } - } - - // Custom - PopupLabel { - visible: action.currentValue === ConnectionModelStatementDelegate.Custom - text: qsTr("Custom Connections can only be edited with the binding editor") - anchors.left: parent.left - anchors.right: parent.right - anchors.margins: 30 - horizontalAlignment: Text.AlignHCenter - wrapMode: Text.WordWrap + StatementEditor { + actionType: action.currentValue + id: container + horizontalSpacing: root.horizontalSpacing + columnWidth: root.columnWidth + statement: backend.okStatement + spacing: root.verticalSpacing } HelperWidgets.AbstractButton { @@ -316,7 +96,7 @@ Column { onClicked: backend.addCondition() } - HelperWidgets.AbstractButton { + HelperWidgets.AbstractButton { style: StudioTheme.Values.connectionPopupButtonStyle width: 160 buttonIcon: qsTr("Remove Condition") @@ -342,9 +122,9 @@ Column { opacity: 0.2 color: { if (type === ConditionListModel.Invalid) - return "red" + return "red" if (type === ConditionListModel.Operator) - return "blue" + return "blue" if (type === ConditionListModel.Literal) return "green" if (type === ConditionListModel.Variable) diff --git a/share/qtcreator/qmldesigner/connectionseditor/StatementEditor.qml b/share/qtcreator/qmldesigner/connectionseditor/StatementEditor.qml new file mode 100644 index 00000000000..f33316dfcd7 --- /dev/null +++ b/share/qtcreator/qmldesigner/connectionseditor/StatementEditor.qml @@ -0,0 +1,258 @@ +// Copyright (C) 2023 The Qt Company Ltd. +// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GPL-3.0-only WITH Qt-GPL-exception-1.0 + +import QtQuick +import QtQuick.Controls +import HelperWidgets as HelperWidgets +import StudioControls as StudioControls +import StudioTheme as StudioTheme +import ConnectionsEditorEditorBackend + +Column { + id: root + + property int actionType + + property int horizontalSpacing + property int columnWidth + + property var statement + + //implicitWidth: Math.max(16, container.childrenRect.width + container.childrenRect.x) + //implicitHeight: Math.max(16, container.childrenRect.height + container.childrenRect.y) + + onActionTypeChanged: { + print("changed") + print(root.actionType) + print(ConnectionModelStatementDelegate.ChangeState) + } + + // Call Function + Row { + visible: root.actionType === ConnectionModelStatementDelegate.CallFunction + spacing: root.horizontalSpacing + + PopupLabel { text: qsTr("Item") ; tooltip: qsTr("The target item of the function.")} + PopupLabel { text: qsTr("Method") ; tooltip: qsTr("The name of the function.")} + } + + Row { + visible: root.actionType === ConnectionModelStatementDelegate.CallFunction + spacing: root.horizontalSpacing + + StudioControls.TopLevelComboBox { + id: functionId + style: StudioTheme.Values.connectionPopupControlStyle + width: root.columnWidth + + model: root.statement.function.id.model ?? 0 + + onActivated: backend.okStatement.function.id.activateIndex(functionId.currentIndex) + property int currentTypeIndex: backend.okStatement.function.id.currentIndex ?? 0 + onCurrentTypeIndexChanged: functionId.currentIndex = functionId.currentTypeIndex + } + + StudioControls.TopLevelComboBox { + id: functionName + style: StudioTheme.Values.connectionPopupControlStyle + width: root.columnWidth + model: root.statement.function.name.model ?? 0 + + onActivated: root.statement.function.name.activateIndex(functionName.currentIndex) + property int currentTypeIndex: root.statement.function.name.currentIndex ?? 0 + onCurrentTypeIndexChanged: functionName.currentIndex = functionName.currentTypeIndex + } + } + + // Assign + Row { + visible: root.actionType === ConnectionModelStatementDelegate.Assign + spacing: root.horizontalSpacing + + PopupLabel { text: qsTr("From") ; tooltip: qsTr("The Property to assign from.")} + PopupLabel { text: qsTr("To"); tooltip: qsTr("The Property to assign to.") } + } + + Row { + visible: root.actionType === ConnectionModelStatementDelegate.Assign + spacing: root.horizontalSpacing + + StudioControls.TopLevelComboBox { + id: rhsAssignmentId + style: StudioTheme.Values.connectionPopupControlStyle + width: root.columnWidth + //from - rhs - id + + model: root.statement.rhsAssignment.id.model ?? 0 + + onActivated: root.statement.rhsAssignment.id.activateIndex(rhsAssignmentId.currentIndex) + property int currentTypeIndex: root.statement.rhsAssignment.id.currentIndex ?? 0 + onCurrentTypeIndexChanged: rhsAssignmentId.currentIndex = rhsAssignmentId.currentTypeIndex + } + + StudioControls.TopLevelComboBox { + id: lhsAssignmentId + style: StudioTheme.Values.connectionPopupControlStyle + width: root.columnWidth + //to lhs - id + model: root.statement.lhs.id.model ?? 0 + + onActivated: root.statement.lhs.id.activateIndex(lhsAssignmentId.currentIndex) + property int currentTypeIndex: root.statement.lhs.id.currentIndex ?? 0 + onCurrentTypeIndexChanged: lhsAssignmentId.currentIndex = lhsAssignmentId.currentTypeIndex + } + } + + Row { + visible: root.actionType === ConnectionModelStatementDelegate.Assign + spacing: root.horizontalSpacing + + StudioControls.TopLevelComboBox { + id: rhsAssignmentName + style: StudioTheme.Values.connectionPopupControlStyle + width: root.columnWidth + //from - rhs - name + + model: root.statement.rhsAssignment.name.model ?? 0 + + onActivated: root.statement.rhsAssignment.name.activateIndex(rhsAssignmentName.currentIndex) + property int currentTypeIndex: root.statement.rhsAssignment.name.currentIndex ?? 0 + onCurrentTypeIndexChanged: rhsAssignmentName.currentIndex = rhsAssignmentName.currentTypeIndex + } + + StudioControls.TopLevelComboBox { + id: lhsAssignmentName + style: StudioTheme.Values.connectionPopupControlStyle + width: root.columnWidth + //to lhs - name + model: root.statement.lhs.name.model ?? 0 + + onActivated: root.statement.lhs.name.activateIndex(lhsAssignmentName.currentIndex) + property int currentTypeIndex: root.statement.lhs.name.currentIndex ?? 0 + onCurrentTypeIndexChanged: lhsAssignmentName.currentIndex = lhsAssignmentName.currentTypeIndex + } + } + + // Change State + Row { + visible: root.actionType === ConnectionModelStatementDelegate.ChangeState + spacing: root.horizontalSpacing + + PopupLabel { text: qsTr("State Group"); tooltip: qsTr("The State Group.") } + PopupLabel { text: qsTr("State"); tooltip: qsTr("The State .") } + } + + Row { + visible: root.actionType === ConnectionModelStatementDelegate.ChangeState + spacing: root.horizontalSpacing + + StudioControls.TopLevelComboBox { + id: stateGroups + style: StudioTheme.Values.connectionPopupControlStyle + width: root.columnWidth + model: root.statement.stateTargets.model ?? 0 + + onActivated: root.statement.stateTargets.activateIndex(stateGroups.currentIndex) + property int currentTypeIndex: root.statement.stateTargets.currentIndex ?? 0 + onCurrentTypeIndexChanged: stateGroups.currentIndex = stateGroups.currentTypeIndex + } + + StudioControls.TopLevelComboBox { + id: states + style: StudioTheme.Values.connectionPopupControlStyle + width: root.columnWidth + + model: root.statement.states.model ?? 0 + + onActivated: root.statement.states.activateIndex(states.currentIndex) + property int currentTypeIndex: root.statement.states.currentIndex ?? 0 + onCurrentTypeIndexChanged: states.currentIndex = states.currentTypeIndex + } + } + + // Set Property + Row { + visible: root.actionType === ConnectionModelStatementDelegate.SetProperty + spacing: root.horizontalSpacing + + PopupLabel { text: qsTr("Item"); tooltip: qsTr("The Item.")} + PopupLabel { text: qsTr("Property"); tooltip: qsTr("The property of the item.")} + } + + Row { + visible: root.actionType === ConnectionModelStatementDelegate.SetProperty + spacing: root.horizontalSpacing + + StudioControls.TopLevelComboBox { + id: lhsPropertyId + style: StudioTheme.Values.connectionPopupControlStyle + width: root.columnWidth + + model: root.statement.lhs.id.model ?? 0 + + onActivated: root.statement.lhs.id.activateIndex(lhsPropertyId.currentIndex) + property int currentTypeIndex: root.statement.lhs.id.currentIndex ?? 0 + onCurrentTypeIndexChanged: lhsPropertyId.currentIndex = lhsPropertyId.currentTypeIndex + + } + + StudioControls.TopLevelComboBox { + id: lhsPropertyName + style: StudioTheme.Values.connectionPopupControlStyle + width: root.columnWidth + model: root.statement.lhs.name.model ?? 0 + + onActivated: root.statement.lhs.name.activateIndex(lhsPropertyName.currentIndex) + property int currentTypeIndex: root.statement.lhs.name.currentIndex ?? 0 + onCurrentTypeIndexChanged: lhsPropertyName.currentIndex = lhsPropertyName.currentTypeIndex + } + } + + PopupLabel { + visible: root.actionType === ConnectionModelStatementDelegate.SetProperty + text: qsTr("Value") + } + + StudioControls.TextField { + id: setPropertyArgument + visible: root.actionType === ConnectionModelStatementDelegate.SetProperty + width: root.width + actionIndicatorVisible: false + translationIndicatorVisible: false + + text: root.statement.stringArgument.text ?? "" + onEditingFinished: { + root.statement.stringArgument.activateText(setPropertyArgument.text) + } + } + + // Print Message + PopupLabel { + visible: root.actionType === ConnectionModelStatementDelegate.PrintMessage + text: qsTr("Message") + tooltip: qsTr("The message that is printed.") + } + + StudioControls.TextField { + id: messageString + visible: root.actionType === ConnectionModelStatementDelegate.PrintMessage + width: root.width + actionIndicatorVisible: false + translationIndicatorVisible: false + text: root.statement.stringArgument.text ?? "" + onEditingFinished: { + root.statement.stringArgument.activateText(messageString.text) + } + } + + // Custom + PopupLabel { + visible: root.actionType === ConnectionModelStatementDelegate.Custom + text: qsTr("Custom Connections can only be edited with the binding editor") + anchors.left: parent.left + anchors.right: parent.right + anchors.margins: 30 + horizontalAlignment: Text.AlignHCenter + wrapMode: Text.WordWrap + } +}