diff options
| author | Eike Ziller <eike.ziller@qt.io> | 2020-08-10 14:23:50 +0200 |
|---|---|---|
| committer | Eike Ziller <eike.ziller@qt.io> | 2020-08-10 15:56:54 +0200 |
| commit | 3944162039d9cea30384a0d867afab35cc3bfabf (patch) | |
| tree | ec07f797055a69823f47edff588f5dc82a1dfeca /share | |
| parent | 84e4b3af31364973c44ad52c8c01430d42f996a4 (diff) | |
| parent | acadee710e00cca55736db864263bdcdcbac31a6 (diff) | |
Merge remote-tracking branch 'origin/4.13' into master
Conflicts:
cmake/QtCreatorIDEBranding.cmake
qbs/modules/qtc/qtc.qbs
qtcreator_ide_branding.pri
src/plugins/cmakeprojectmanager/cmakebuildstep.cpp
src/plugins/cmakeprojectmanager/cmakebuildstep.h
tests/auto/debugger/tst_namedemangler.cpp
tests/auto/qml/codemodel/check/tst_check.cpp
Change-Id: Iefd5f71c03c0078513b76a92af764a4fb22ee4c2
Diffstat (limited to 'share')
47 files changed, 1192 insertions, 958 deletions
diff --git a/share/qtcreator/debugger/cdbbridge.py b/share/qtcreator/debugger/cdbbridge.py index aa76d698920..8f2dbada3b6 100644 --- a/share/qtcreator/debugger/cdbbridge.py +++ b/share/qtcreator/debugger/cdbbridge.py @@ -110,7 +110,10 @@ class Dumper(DumperBase): # There is no cdb api for the size of bitfields. # Workaround this issue by parsing the native debugger text for integral types. if val.type.code == TypeCode.Integral: - integerString = nativeValue.nativeDebuggerValue() + try: + integerString = nativeValue.nativeDebuggerValue() + except UnicodeDecodeError: + integerString = '' # cannot decode - read raw if integerString == 'true': val.ldata = int(1).to_bytes(1, byteorder='little') elif integerString == 'false': diff --git a/share/qtcreator/debugger/dumper.py b/share/qtcreator/debugger/dumper.py index e66900c1ef6..42dd8e9ba8a 100644 --- a/share/qtcreator/debugger/dumper.py +++ b/share/qtcreator/debugger/dumper.py @@ -2903,11 +2903,11 @@ class DumperBase(): return dd(intval, self.laddress, form) def display(self): + if self.ldisplay is not None: + return self.ldisplay simple = self.value() if simple is not None: return str(simple) - if self.ldisplay is not None: - return self.ldisplay #if self.ldata is not None: # if sys.version_info[0] == 2 and isinstance(self.ldata, buffer): # return bytes(self.ldata).encode('hex') diff --git a/share/qtcreator/qml/qmlpuppet/mockfiles/AxisHelperArm.qml b/share/qtcreator/qml/qmlpuppet/mockfiles/AxisHelperArm.qml index 0fd5ad1e989..0121938cada 100644 --- a/share/qtcreator/qml/qmlpuppet/mockfiles/AxisHelperArm.qml +++ b/share/qtcreator/qml/qmlpuppet/mockfiles/AxisHelperArm.qml @@ -45,7 +45,7 @@ Node { source: "meshes/axishelper.mesh" materials: DefaultMaterial { id: posMat - emissiveColor: posModel.hovering ? armRoot.hoverColor : armRoot.color + diffuseColor: posModel.hovering ? armRoot.hoverColor : armRoot.color lighting: DefaultMaterial.NoLighting } pickable: true @@ -62,7 +62,7 @@ Node { scale: Qt.vector3d(0.025, 0.025, 0.025) materials: DefaultMaterial { id: negMat - emissiveColor: negModel.hovering ? armRoot.hoverColor : armRoot.color + diffuseColor: negModel.hovering ? armRoot.hoverColor : armRoot.color lighting: DefaultMaterial.NoLighting } pickable: true diff --git a/share/qtcreator/qml/qmlpuppet/mockfiles/CameraFrustum.qml b/share/qtcreator/qml/qmlpuppet/mockfiles/CameraFrustum.qml index 0ba02e362b9..22c404ff67d 100644 --- a/share/qtcreator/qml/qmlpuppet/mockfiles/CameraFrustum.qml +++ b/share/qtcreator/qml/qmlpuppet/mockfiles/CameraFrustum.qml @@ -48,7 +48,7 @@ Model { materials: [ DefaultMaterial { id: defaultMaterial - emissiveColor: cameraFrustum.selected ? "#FF0000" : "#555555" + diffuseColor: cameraFrustum.selected ? "#FF0000" : "#555555" lighting: DefaultMaterial.NoLighting cullMode: Material.NoCulling } diff --git a/share/qtcreator/qml/qmlpuppet/mockfiles/DirectionalDraggable.qml b/share/qtcreator/qml/qmlpuppet/mockfiles/DirectionalDraggable.qml index e88b9c4c51c..29548bee1e3 100644 --- a/share/qtcreator/qml/qmlpuppet/mockfiles/DirectionalDraggable.qml +++ b/share/qtcreator/qml/qmlpuppet/mockfiles/DirectionalDraggable.qml @@ -31,7 +31,7 @@ Model { id: rootModel property View3D view3D - property alias color: material.emissiveColor + property alias color: material.diffuseColor property Node targetNode: null property bool dragging: mouseAreaYZ.dragging || mouseAreaXZ.dragging property bool active: false @@ -52,7 +52,7 @@ Model { DefaultMaterial { id: material - emissiveColor: "white" + diffuseColor: "white" lighting: DefaultMaterial.NoLighting } diff --git a/share/qtcreator/qml/qmlpuppet/mockfiles/EditView3D.qml b/share/qtcreator/qml/qmlpuppet/mockfiles/EditView3D.qml index 2bf81b837f1..95245aae5eb 100644 --- a/share/qtcreator/qml/qmlpuppet/mockfiles/EditView3D.qml +++ b/share/qtcreator/qml/qmlpuppet/mockfiles/EditView3D.qml @@ -202,7 +202,7 @@ Item { if ("transformMode" in toolStates) transformMode = toolStates.transformMode; else if (resetToDefault) - selectionMode = EditView3D.TransformMode.Move; + transformMode = EditView3D.TransformMode.Move; if ("editCamState" in toolStates) cameraControl.restoreCameraState(toolStates.editCamState); @@ -266,8 +266,10 @@ Item { { var theObject = object; if (selectionMode === EditView3D.SelectionMode.Group) { - while (theObject && theObject !== activeScene && theObject.parent !== activeScene) + while (theObject && theObject !== activeScene + && (activeScene instanceof Model || theObject.parent !== activeScene)) { theObject = theObject.parent; + } } // Object selection logic: // Regular click: Clear any multiselection, single-selects the clicked object @@ -487,6 +489,12 @@ Item { position: moveGizmo.scenePosition } + AutoScaleHelper { + id: pivotAutoScale + view3D: overlayView + position: pivotLine.startPos + } + Line3D { id: pivotLine visible: viewRoot.selectedNode @@ -513,14 +521,14 @@ Item { Model { id: pivotCap source: "#Sphere" - scale: autoScale.getScale(Qt.vector3d(0.03, 0.03, 0.03)) + scale: pivotAutoScale.getScale(Qt.vector3d(0.03, 0.03, 0.03)) position: pivotLine.startPos materials: [ DefaultMaterial { id: lineMat lighting: DefaultMaterial.NoLighting cullMode: Material.NoCulling - emissiveColor: pivotLine.color + diffuseColor: pivotLine.color } ] } diff --git a/share/qtcreator/qml/qmlpuppet/mockfiles/HelperGrid.qml b/share/qtcreator/qml/qmlpuppet/mockfiles/HelperGrid.qml index 70e6e82ee32..dbd7f38523c 100644 --- a/share/qtcreator/qml/qmlpuppet/mockfiles/HelperGrid.qml +++ b/share/qtcreator/qml/qmlpuppet/mockfiles/HelperGrid.qml @@ -47,7 +47,7 @@ Node { materials: [ DefaultMaterial { id: mainGridMaterial - emissiveColor: "#aaaaaa" + diffuseColor: "#aaaaaa" lighting: DefaultMaterial.NoLighting cullMode: Material.NoCulling } @@ -65,7 +65,7 @@ Node { materials: [ DefaultMaterial { id: subGridMaterial - emissiveColor: mainGridMaterial.emissiveColor + diffuseColor: mainGridMaterial.diffuseColor lighting: DefaultMaterial.NoLighting cullMode: Material.NoCulling } @@ -82,7 +82,7 @@ Node { materials: [ DefaultMaterial { id: vCenterLineMaterial - emissiveColor: "#00a1d2" + diffuseColor: "#00a1d2" lighting: DefaultMaterial.NoLighting cullMode: Material.NoCulling } @@ -99,7 +99,7 @@ Node { materials: [ DefaultMaterial { id: hCenterLineMaterial - emissiveColor: "#cb211a" + diffuseColor: "#cb211a" lighting: DefaultMaterial.NoLighting cullMode: Material.NoCulling } diff --git a/share/qtcreator/qml/qmlpuppet/mockfiles/LightGizmo.qml b/share/qtcreator/qml/qmlpuppet/mockfiles/LightGizmo.qml index ee1c5017eff..2e9791dc282 100644 --- a/share/qtcreator/qml/qmlpuppet/mockfiles/LightGizmo.qml +++ b/share/qtcreator/qml/qmlpuppet/mockfiles/LightGizmo.qml @@ -336,7 +336,7 @@ Node { DefaultMaterial { id: lightMaterial - emissiveColor: lightGizmo.color + diffuseColor: lightGizmo.color lighting: DefaultMaterial.NoLighting cullMode: Material.NoCulling } diff --git a/share/qtcreator/qml/qmlpuppet/mockfiles/Line3D.qml b/share/qtcreator/qml/qmlpuppet/mockfiles/Line3D.qml index 79718d042f2..f9af7070571 100644 --- a/share/qtcreator/qml/qmlpuppet/mockfiles/Line3D.qml +++ b/share/qtcreator/qml/qmlpuppet/mockfiles/Line3D.qml @@ -33,7 +33,7 @@ Node { property alias startPos: lineGeometry.startPos property alias endPos: lineGeometry.endPos property alias name: lineGeometry.name // Name must be unique for each line - property alias color: lineMat.emissiveColor + property alias color: lineMat.diffuseColor Model { geometry: LineGeometry { diff --git a/share/qtcreator/qml/qmlpuppet/mockfiles/PlanarDraggable.qml b/share/qtcreator/qml/qmlpuppet/mockfiles/PlanarDraggable.qml index 41a44f23863..0d66033eaad 100644 --- a/share/qtcreator/qml/qmlpuppet/mockfiles/PlanarDraggable.qml +++ b/share/qtcreator/qml/qmlpuppet/mockfiles/PlanarDraggable.qml @@ -31,7 +31,7 @@ Model { id: rootModel property View3D view3D - property alias color: gizmoMaterial.emissiveColor + property alias color: gizmoMaterial.diffuseColor property alias priority: mouseArea.priority property Node targetNode: null property bool dragging: mouseArea.dragging @@ -53,7 +53,7 @@ Model { DefaultMaterial { id: gizmoMaterial - emissiveColor: "white" + diffuseColor: "white" lighting: DefaultMaterial.NoLighting cullMode: Material.NoCulling } diff --git a/share/qtcreator/qml/qmlpuppet/mockfiles/RotateGizmo.qml b/share/qtcreator/qml/qmlpuppet/mockfiles/RotateGizmo.qml index 8ed85f32969..6fccfbcdc79 100644 --- a/share/qtcreator/qml/qmlpuppet/mockfiles/RotateGizmo.qml +++ b/share/qtcreator/qml/qmlpuppet/mockfiles/RotateGizmo.qml @@ -175,7 +175,7 @@ Node { source: "#Sphere" materials: DefaultMaterial { id: material - emissiveColor: "black" + diffuseColor: "black" opacity: mouseAreaFree.hovering ? 0.15 : 0 lighting: DefaultMaterial.NoLighting } diff --git a/share/qtcreator/qml/qmlpuppet/mockfiles/RotateRing.qml b/share/qtcreator/qml/qmlpuppet/mockfiles/RotateRing.qml index fc803c679a2..00494a5d91b 100644 --- a/share/qtcreator/qml/qmlpuppet/mockfiles/RotateRing.qml +++ b/share/qtcreator/qml/qmlpuppet/mockfiles/RotateRing.qml @@ -31,7 +31,7 @@ Model { id: rotateRing property View3D view3D - property alias color: material.emissiveColor + property alias color: material.diffuseColor property Node targetNode: null property bool dragging: mouseAreaMain.dragging property bool active: false @@ -60,7 +60,7 @@ Model { materials: DefaultMaterial { id: material - emissiveColor: "white" + diffuseColor: "white" lighting: DefaultMaterial.NoLighting } diff --git a/share/qtcreator/qml/qmlpuppet/mockfiles/ScaleGizmo.qml b/share/qtcreator/qml/qmlpuppet/mockfiles/ScaleGizmo.qml index ff64957699a..076f8d53a62 100644 --- a/share/qtcreator/qml/qmlpuppet/mockfiles/ScaleGizmo.qml +++ b/share/qtcreator/qml/qmlpuppet/mockfiles/ScaleGizmo.qml @@ -170,7 +170,7 @@ Node { scale: Qt.vector3d(0.024, 0.024, 0.024) materials: DefaultMaterial { id: material - emissiveColor: highlightOnHover + diffuseColor: highlightOnHover && (centerMouseArea.hovering || centerMouseArea.dragging) ? Qt.lighter(Qt.rgba(0.5, 0.5, 0.5, 1)) : Qt.rgba(0.5, 0.5, 0.5, 1) diff --git a/share/qtcreator/qml/qmlpuppet/mockfiles/ScaleRod.qml b/share/qtcreator/qml/qmlpuppet/mockfiles/ScaleRod.qml index ead4f1458da..fcdf4a74158 100644 --- a/share/qtcreator/qml/qmlpuppet/mockfiles/ScaleRod.qml +++ b/share/qtcreator/qml/qmlpuppet/mockfiles/ScaleRod.qml @@ -44,7 +44,7 @@ DirectionalDraggable { scale: Qt.vector3d(0.020, 0.020, 0.020) materials: DefaultMaterial { id: material - emissiveColor: scaleRod.color + diffuseColor: scaleRod.color lighting: DefaultMaterial.NoLighting } } diff --git a/share/qtcreator/qml/qmlpuppet/mockfiles/SelectionBox.qml b/share/qtcreator/qml/qmlpuppet/mockfiles/SelectionBox.qml index 739c7a6d34b..201d1a63775 100644 --- a/share/qtcreator/qml/qmlpuppet/mockfiles/SelectionBox.qml +++ b/share/qtcreator/qml/qmlpuppet/mockfiles/SelectionBox.qml @@ -56,7 +56,7 @@ Node { materials: [ DefaultMaterial { - emissiveColor: "#fff600" + diffuseColor: "#fff600" lighting: DefaultMaterial.NoLighting cullMode: Material.NoCulling } diff --git a/share/qtcreator/qmldesigner/itemLibraryQmlSources/ItemDelegate.qml b/share/qtcreator/qmldesigner/itemLibraryQmlSources/ItemDelegate.qml index cd3ddef34db..1cbec5d802b 100644 --- a/share/qtcreator/qmldesigner/itemLibraryQmlSources/ItemDelegate.qml +++ b/share/qtcreator/qmldesigner/itemLibraryQmlSources/ItemDelegate.qml @@ -23,9 +23,8 @@ ** ****************************************************************************/ -import QtQuick 2.1 -import QtQuick.Controls 1.1 -import QtQuick.Controls.Styles 1.0 +import QtQuick 2.15 +import QtQuick.Controls 2.15 import QtQuickDesignerTheme 1.0 import HelperWidgets 2.0 @@ -76,8 +75,6 @@ Item { id: mouseRegion anchors.fill: parent tooltip: itemName - - onPressed: { rootView.startDragAndDrop(mouseRegion, itemLibraryEntry) } diff --git a/share/qtcreator/qmldesigner/itemLibraryQmlSources/ItemsView.qml b/share/qtcreator/qmldesigner/itemLibraryQmlSources/ItemsView.qml index 30b741f99da..c7619526934 100644 --- a/share/qtcreator/qmldesigner/itemLibraryQmlSources/ItemsView.qml +++ b/share/qtcreator/qmldesigner/itemLibraryQmlSources/ItemsView.qml @@ -23,15 +23,11 @@ ** ****************************************************************************/ -import QtQuick 2.1 -import QtQuick.Controls 1.1 -import QtQuick.Controls.Styles 1.0 -import "../common" - -import QtQuick.Layouts 1.0 -import HelperWidgets 2.0 - +import QtQuick 2.15 +import QtQuick.Layouts 1.15 import QtQuickDesignerTheme 1.0 +import HelperWidgets 2.0 +import StudioTheme 1.0 as StudioTheme /* The view displaying the item grid. @@ -65,9 +61,6 @@ ScrollView { Item { id: styleConstants - readonly property color backgroundColor: Theme.qmlDesignerBackgroundColorDarkAlternate() - readonly property color lighterBackgroundColor: Theme.color(Theme.FancyToolBarSeparatorColor) - property int textWidth: 58 property int textHeight: Theme.smallFontPixelSize() * 2 @@ -81,48 +74,37 @@ ScrollView { 2 * cellVerticalMargin + cellVerticalSpacing } - Rectangle { - id: background - anchors.fill: parent - color: styleConstants.backgroundColor - } - - style: DesignerScrollViewStyle { - - } - - Flickable { - contentHeight: column.height - Column { - id: column - Repeater { - model: itemLibraryModel // to be set in Qml context - delegate: Section { - width: itemsView.viewport.width - caption: sectionName // to be set by model - visible: sectionVisible - topPadding: 2 - leftPadding: 2 - rightPadding: 1 - expanded: sectionExpanded - onExpandedChanged: itemLibraryModel.setExpanded(expanded, sectionName); - Grid { - id: itemGrid - - columns: parent.width / styleConstants.cellWidth - property int flexibleWidth: (parent.width - styleConstants.cellWidth * columns) / columns - - Repeater { - model: sectionEntries - delegate: ItemDelegate { - visible: itemVisible - width: styleConstants.cellWidth + itemGrid.flexibleWidth - height: styleConstants.cellHeight - } + Column { + id: column + Repeater { + model: itemLibraryModel // to be set in Qml context + delegate: Section { + width: itemsView.width - + (itemsView.verticalScrollBarVisible ? StudioTheme.Values.scrollBarThickness : 0) + caption: sectionName // to be set by model + visible: sectionVisible + topPadding: 2 + leftPadding: 2 + rightPadding: 1 + expanded: sectionExpanded + onExpandedChanged: itemLibraryModel.setExpanded(expanded, sectionName); + Grid { + id: itemGrid + + columns: parent.width / styleConstants.cellWidth + property int flexibleWidth: (parent.width - styleConstants.cellWidth * columns) / columns + + Repeater { + model: sectionEntries + delegate: ItemDelegate { + visible: itemVisible + width: styleConstants.cellWidth + itemGrid.flexibleWidth + height: styleConstants.cellHeight } } } } } } + } diff --git a/share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/AdvancedSection.qml b/share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/AdvancedSection.qml index a37af55dbb2..f5a51b7383e 100644 --- a/share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/AdvancedSection.qml +++ b/share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/AdvancedSection.qml @@ -33,7 +33,7 @@ Section { caption: qsTr("Advanced") SectionLayout { - rows: 4 + columns: 2 Label { text: qsTr("Origin") @@ -171,7 +171,6 @@ Section { backendValue: backendValues.focus text: backendValues.focus.valueToString enabled: backendValues.focus.isAvailable - implicitWidth: 180 } ExpandingSpacer { } @@ -187,7 +186,6 @@ Section { backendValue: backendValues.activeFocusOnTab text: backendValues.activeFocusOnTab.valueToString enabled: backendValues.activeFocusOnTab.isAvailable - implicitWidth: 180 } ExpandingSpacer { } diff --git a/share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/AlignDistributeSection.qml b/share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/AlignDistributeSection.qml index 36f4c026429..e21879057bf 100644 --- a/share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/AlignDistributeSection.qml +++ b/share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/AlignDistributeSection.qml @@ -32,10 +32,10 @@ import StudioTheme 1.0 as StudioTheme Section { anchors.left: parent.left anchors.right: parent.right + caption: qsTr("Align") - ColumnLayout { - width: parent.width + SectionLayout { enabled: alignDistribute.multiSelection && !alignDistribute.selectionHasAnchors && alignDistribute.selectionExclusivlyItems && @@ -49,8 +49,11 @@ Section { Label { text: qsTr("Align objects") width: 120 + Layout.columnSpan: 2 } + RowLayout { + Layout.columnSpan: 2 Row { spacing: -StudioTheme.Values.border AbstractButton { @@ -105,8 +108,11 @@ Section { Label { text: qsTr("Distribute objects") width: 120 + Layout.columnSpan: 2 } + RowLayout { + Layout.columnSpan: 2 Row { spacing: -StudioTheme.Values.border AbstractButton { @@ -161,8 +167,11 @@ Section { Label { text: qsTr("Distribute spacing") width: 120 + Layout.columnSpan: 2 } + RowLayout { + Layout.columnSpan: 2 Row { spacing: -StudioTheme.Values.border AbstractButton { @@ -242,18 +251,16 @@ Section { } } - SectionLayout { - columns: 2 - - ItemFilterModel { - id: itemFilterModel - modelNodeBackendProperty: modelNodeBackend - selectionOnly: true - } + ItemFilterModel { + id: itemFilterModel + modelNodeBackendProperty: modelNodeBackend + selectionOnly: true + } - Label { - text: qsTr("Align to") - } + Label { + text: qsTr("Align to") + } + SecondColumnLayout { ComboBox { id: alignToComboBox Layout.fillWidth: true @@ -267,9 +274,14 @@ Section { } } - Label { - text: qsTr("Key object") + ExpandingSpacer { } + } + + Label { + text: qsTr("Key object") + } + SecondColumnLayout { ComboBox { id: keyObjectComboBox enabled: alignToComboBox.currentIndex === 2 @@ -285,11 +297,15 @@ Section { lastSelectedItem = "" // TODO } } + + ExpandingSpacer { + } } SectionLayout { columns: 1 Layout.topMargin: 30 + Layout.columnSpan: 2 visible: alignDistribute.multiSelection && (alignDistribute.selectionHasAnchors || !alignDistribute.selectionExclusivlyItems || diff --git a/share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/AnchorRow.qml b/share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/AnchorRow.qml index 7d18d6a1f98..406e5af011c 100644 --- a/share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/AnchorRow.qml +++ b/share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/AnchorRow.qml @@ -23,9 +23,9 @@ ** ****************************************************************************/ -import QtQuick 2.0 +import QtQuick 2.15 import HelperWidgets 2.0 -import QtQuick.Layouts 1.0 +import QtQuick.Layouts 1.15 import QtQuickDesignerTheme 1.0 import StudioControls 1.0 as StudioControls @@ -34,11 +34,9 @@ import StudioTheme 1.0 as StudioTheme RowLayout { id: anchorRow - anchors.left: parent.left - anchors.right: parent.right opacity: enabled ? 1 : 0.5 - property alias iconSource: icon.source + property alias iconSource: iconLabel.icon property variant anchorMargin @@ -64,8 +62,10 @@ RowLayout { readonly property color __defaultTextColor: StudioTheme.Values.themeTextColor IconLabel { - id: icon + id: iconLabel Layout.alignment: Qt.AlignTop + Layout.topMargin: 4 + Layout.leftMargin: 4 } GridLayout { diff --git a/share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/ItemPane.qml b/share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/ItemPane.qml index 4415375cefc..fd39b0bd2d6 100644 --- a/share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/ItemPane.qml +++ b/share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/ItemPane.qml @@ -23,10 +23,11 @@ ** ****************************************************************************/ -import QtQuick 2.0 -import HelperWidgets 2.0 -import QtQuick.Layouts 1.0 +import QtQuick 2.15 +import QtQuick.Controls 2.15 +import QtQuick.Layouts 1.15 import QtQuickDesignerTheme 1.0 +import HelperWidgets 2.0 import StudioControls 1.0 as StudioControls import StudioTheme 1.0 as StudioTheme @@ -35,14 +36,15 @@ Rectangle { width: 320 height: 400 color: Theme.qmlDesignerBackgroundColorDarkAlternate() + MouseArea { anchors.fill: parent onClicked: forceActiveFocus() } ScrollView { + clip: true anchors.fill: parent - horizontalScrollBarPolicy: Qt.ScrollBarAlwaysOff Column { y: -1 @@ -57,7 +59,6 @@ Rectangle { SectionLayout { Label { text: qsTr("Type") - } SecondColumnLayout { @@ -65,15 +66,12 @@ Rectangle { RoundedPanel { Layout.fillWidth: true - height: 24 + height: StudioTheme.Values.height Label { - x: 6 anchors.fill: parent - anchors.leftMargin: 16 - + anchors.leftMargin: StudioTheme.Values.inputHorizontalPadding text: backendValues.className.value - verticalAlignment: Text.AlignVCenter } ToolTipArea { anchors.fill: parent @@ -87,10 +85,10 @@ Rectangle { } ExpressionTextField { - z: 2 id: typeLineEdit + z: 2 completeOnlyTypes: true - + replaceCurrentTextByCompletion: true anchors.fill: parent visible: false @@ -98,10 +96,26 @@ Rectangle { showButtons: false fixedSize: true + property bool blockEditingFinished: false + onEditingFinished: { - if (visible) + if (typeLineEdit.blockEditingFinished) + return + + typeLineEdit.blockEditingFinished = true + + if (typeLineEdit.visible) changeTypeName(typeLineEdit.text.trim()) - visible = false + typeLineEdit.visible = false + + typeLineEdit.blockEditingFinished = false + + typeLineEdit.completionList.model = null + } + + onRejected: { + typeLineEdit.visible = false + typeLineEdit.completionList.model = null } } @@ -117,6 +131,7 @@ Rectangle { } SecondColumnLayout { + spacing: 2 LineEdit { id: lineEdit @@ -129,29 +144,55 @@ Rectangle { showExtendedFunctionButton: false enabled: !modelNodeBackend.multiSelection } - // workaround: without this item the lineedit does not shrink to the - // right size after resizing to a wider width - Image { - visible: !modelNodeBackend.multiSelection - Layout.preferredWidth: 20 - Layout.preferredHeight: 20 - horizontalAlignment: Image.AlignHCenter - verticalAlignment: Image.AlignVCenter - source: hasAliasExport ? "image://icons/alias-export-checked" : "image://icons/alias-export-unchecked" + Rectangle { + id: aliasIndicator + color: "transparent" + border.color: "transparent" + implicitWidth: StudioTheme.Values.height + implicitHeight: StudioTheme.Values.height + z: 10 + + Label { + id: aliasIndicatorIcon + enabled: !modelNodeBackend.multiSelection + anchors.fill: parent + text: { + if (!aliasIndicatorIcon.enabled) + return StudioTheme.Constants.idAliasOff + + return hasAliasExport ? StudioTheme.Constants.idAliasOn : StudioTheme.Constants.idAliasOff + } + color: { + if (!aliasIndicatorIcon.enabled) + return StudioTheme.Values.themeTextColorDisabled + + return hasAliasExport ? StudioTheme.Values.themeInteraction : StudioTheme.Values.themeTextColor + } + font.family: StudioTheme.Constants.iconFont.family + font.pixelSize: Math.round(16 * StudioTheme.Values.scaleFactor) + verticalAlignment: Text.AlignVCenter + horizontalAlignment: Text.AlignHCenter + states: [ + State { + name: "hovered" + when: toolTipArea.containsMouse && aliasIndicatorIcon.enabled + PropertyChanges { + target: aliasIndicatorIcon + scale: 1.2 + } + } + ] + } + ToolTipArea { + id: toolTipArea enabled: !modelNodeBackend.multiSelection anchors.fill: parent onClicked: toogleExportAlias() tooltip: qsTr("Exports this item as an alias property of the root item.") } } - Item { //dummy object to preserve layout in case of multiselection - Layout.preferredWidth: 20 - Layout.preferredHeight: 20 - enabled: modelNodeBackend.multiSelection - visible: enabled - } } Label { @@ -280,7 +321,6 @@ Rectangle { Item { width: 10 height: 10 - } CheckBox { @@ -319,88 +359,92 @@ Rectangle { width: 4 } - TabView { + StudioControls.TabBar { + id: tabBar + anchors.left: parent.left anchors.right: parent.right - frameVisible: false - id: tabView + StudioControls.TabButton { + text: backendValues.className.value + } + StudioControls.TabButton { + text: qsTr("Layout") + } + StudioControls.TabButton { + text: qsTr("Advanced") + } + } - height: currentHeight + extraHeight + StackLayout { + anchors.left: parent.left + anchors.right: parent.right + currentIndex: tabBar.currentIndex - property int currentHeight: getTab(currentIndex).item.implicitHeight + property int currentHeight: children[currentIndex].implicitHeight property int extraHeight: 40 - Tab { - title: backendValues.className.value + height: currentHeight + extraHeight + + Column { + anchors.left: parent.left + anchors.right: parent.right - component: Column { + Loader { anchors.left: parent.left anchors.right: parent.right + visible: theSource !== "" - Loader { - anchors.left: parent.left - anchors.right: parent.right - visible: theSource !== "" - - id: specificsTwo; - sourceComponent: specificQmlComponent + id: specificsTwo; + sourceComponent: specificQmlComponent - property string theSource: specificQmlData + property string theSource: specificQmlData - onTheSourceChanged: { - active = false - active = true - } + onTheSourceChanged: { + active = false + active = true } + } - Loader { - anchors.left: parent.left - anchors.right: parent.right + Loader { + anchors.left: parent.left + anchors.right: parent.right - id: specificsOne; - source: specificsUrl; + id: specificsOne; + source: specificsUrl; - property int loaderHeight: specificsOne.item.height + tabView.extraHeight - } + property int loaderHeight: specificsOne.item.height + tabView.extraHeight } } - Tab { - title: qsTr("Layout") - component: Column { - anchors.left: parent.left - anchors.right: parent.right + Column { + anchors.left: parent.left + anchors.right: parent.right - LayoutSection { - } + LayoutSection { + } - MarginSection { - visible: anchorBackend.isInLayout - backendValueTopMargin: backendValues.Layout_topMargin - backendValueBottomMargin: backendValues.Layout_bottomMargin - backendValueLeftMargin: backendValues.Layout_leftMargin - backendValueRightMargin: backendValues.Layout_rightMargin - backendValueMargins: backendValues.Layout_margins - } + MarginSection { + visible: anchorBackend.isInLayout + backendValueTopMargin: backendValues.Layout_topMargin + backendValueBottomMargin: backendValues.Layout_bottomMargin + backendValueLeftMargin: backendValues.Layout_leftMargin + backendValueRightMargin: backendValues.Layout_rightMargin + backendValueMargins: backendValues.Layout_margins + } - AlignDistributeSection { - visible: !anchorBackend.isInLayout - } + AlignDistributeSection { + visible: !anchorBackend.isInLayout } } - Tab { - anchors.fill: parent - title: qsTr("Advanced") - component: Column { - anchors.left: parent.left - anchors.right: parent.right + Column { + anchors.left: parent.left + anchors.right: parent.right - AdvancedSection { - } - LayerSection { - } + AdvancedSection { + } + LayerSection { } } } diff --git a/share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/LayoutSection.qml b/share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/LayoutSection.qml index 7eeb8d22856..458e394fbf4 100644 --- a/share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/LayoutSection.qml +++ b/share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/LayoutSection.qml @@ -50,8 +50,8 @@ Section { } AnchorRow { - visible: anchorBackend.topAnchored; - iconSource: "image://icons/anchor-top" + visible: anchorBackend.topAnchored + iconSource: StudioTheme.Constants.anchorTop anchorMargin: backendValues.anchors_topMargin targetName: anchorBackend.topTarget onTargetChanged: { @@ -73,8 +73,8 @@ Section { } AnchorRow { - visible: anchorBackend.bottomAnchored; - iconSource: "image://icons/anchor-bottom" + visible: anchorBackend.bottomAnchored + iconSource: StudioTheme.Constants.anchorBottom anchorMargin: backendValues.anchors_bottomMargin targetName: anchorBackend.bottomTarget onTargetChanged: { @@ -97,8 +97,8 @@ Section { } AnchorRow { - visible: anchorBackend.leftAnchored; - iconSource: "image://icons/anchor-left" + visible: anchorBackend.leftAnchored + iconSource: StudioTheme.Constants.anchorLeft anchorMargin: backendValues.anchors_leftMargin targetName: anchorBackend.leftTarget onTargetChanged: { @@ -120,8 +120,8 @@ Section { } AnchorRow { - visible: anchorBackend.rightAnchored; - iconSource: "image://icons/anchor-right" + visible: anchorBackend.rightAnchored + iconSource: StudioTheme.Constants.anchorRight anchorMargin: backendValues.anchors_rightMargin targetName: anchorBackend.rightTarget onTargetChanged: { @@ -145,8 +145,8 @@ Section { AnchorRow { showAlternativeTargets: false - visible: anchorBackend.horizontalCentered; - iconSource: "image://icons/anchor-horizontal" + visible: anchorBackend.horizontalCentered + iconSource: StudioTheme.Constants.centerHorizontal anchorMargin: backendValues.anchors_horizontalCenterOffset targetName: anchorBackend.horizontalTarget onTargetChanged: { @@ -158,8 +158,8 @@ Section { AnchorRow { showAlternativeTargets: false - visible: anchorBackend.verticalCentered; - iconSource: "image://icons/anchor-vertical" + visible: anchorBackend.verticalCentered + iconSource: StudioTheme.Constants.centerVertical anchorMargin: backendValues.anchors_verticalCenterOffset targetName: anchorBackend.verticalTarget onTargetChanged: { diff --git a/share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/QtObjectPane.qml b/share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/QtObjectPane.qml index a91a98cdbe1..96d22e5a7b9 100644 --- a/share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/QtObjectPane.qml +++ b/share/qtcreator/qmldesigner/propertyEditorQmlSources/QtQuick/QtObjectPane.qml @@ -23,10 +23,11 @@ ** ****************************************************************************/ -import QtQuick 2.0 -import HelperWidgets 2.0 +import QtQuick 2.15 import QtQuick.Layouts 1.0 import QtQuickDesignerTheme 1.0 +import HelperWidgets 2.0 +import StudioTheme 1.0 as StudioTheme Rectangle { id: itemPane @@ -43,6 +44,7 @@ Rectangle { anchors.fill: parent Column { + id: rootColumn y: -1 width: itemPane.width Section { @@ -54,7 +56,6 @@ Rectangle { SectionLayout { Label { text: qsTr("Type") - } SecondColumnLayout { @@ -62,15 +63,12 @@ Rectangle { RoundedPanel { Layout.fillWidth: true - height: 24 + height: StudioTheme.Values.height Label { - x: 6 anchors.fill: parent - anchors.leftMargin: 16 - + anchors.leftMargin: StudioTheme.Values.inputHorizontalPadding text: backendValues.className.value - verticalAlignment: Text.AlignVCenter } ToolTipArea { anchors.fill: parent @@ -87,7 +85,7 @@ Rectangle { z: 2 id: typeLineEdit completeOnlyTypes: true - + replaceCurrentTextByCompletion: true anchors.fill: parent visible: false @@ -95,17 +93,33 @@ Rectangle { showButtons: false fixedSize: true + property bool blockEditingFinished: false + onEditingFinished: { - if (visible) + if (typeLineEdit.blockEditingFinished) + return + + typeLineEdit.blockEditingFinished = true + + if (typeLineEdit.visible) changeTypeName(typeLineEdit.text.trim()) - visible = false + typeLineEdit.visible = false + + typeLineEdit.blockEditingFinished = false + + typeLineEdit.completionList.model = null + } + + onRejected: { + typeLineEdit.visible = false + typeLineEdit.completionList.model = null } } } Item { - Layout.preferredWidth: 16 - Layout.preferredHeight: 16 + Layout.preferredWidth: 20 + Layout.preferredHeight: 20 } } @@ -114,6 +128,7 @@ Rectangle { } SecondColumnLayout { + spacing: 2 LineEdit { id: lineEdit @@ -127,12 +142,48 @@ Rectangle { enabled: !modelNodeBackend.multiSelection } - Image { - visible: !modelNodeBackend.multiSelection - Layout.preferredWidth: 16 - Layout.preferredHeight: 16 - source: hasAliasExport ? "image://icons/alias-export-checked" : "image://icons/alias-export-unchecked" + Rectangle { + id: aliasIndicator + color: "transparent" + border.color: "transparent" + implicitWidth: StudioTheme.Values.height + implicitHeight: StudioTheme.Values.height + z: 10 + + Label { + id: aliasIndicatorIcon + enabled: !modelNodeBackend.multiSelection + anchors.fill: parent + text: { + if (!aliasIndicatorIcon.enabled) + return StudioTheme.Constants.idAliasOff + + return hasAliasExport ? StudioTheme.Constants.idAliasOn : StudioTheme.Constants.idAliasOff + } + color: { + if (!aliasIndicatorIcon.enabled) + return StudioTheme.Values.themeTextColorDisabled + + return hasAliasExport ? StudioTheme.Values.themeInteraction : StudioTheme.Values.themeTextColor + } + font.family: StudioTheme.Constants.iconFont.family + font.pixelSize: Math.round(16 * StudioTheme.Values.scaleFactor) + verticalAlignment: Text.AlignVCenter + horizontalAlignment: Text.AlignHCenter + states: [ + State { + name: "hovered" + when: toolTipArea.containsMouse && aliasIndicatorIcon.enabled + PropertyChanges { + target: aliasIndicatorIcon + scale: 1.2 + } + } + ] + } + ToolTipArea { + id: toolTipArea enabled: !modelNodeBackend.multiSelection anchors.fill: parent onClicked: toogleExportAlias() @@ -148,69 +199,30 @@ Rectangle { width: 4 } - TabView { + Column { anchors.left: parent.left anchors.right: parent.right - frameVisible: false - - id: tabView - height: Math.max(layoutSectionHeight, specficsHeight) - - property int layoutSectionHeight: 400 - property int specficsOneHeight: 0 - property int specficsTwoHeight: 0 - - property int specficsHeight: Math.max(specficsOneHeight, specficsTwoHeight) - - property int extraHeight: 40 - - Tab { - id: tab - title: backendValues.className.value - - component: Column { - anchors.left: parent.left - anchors.right: parent.right - Loader { - anchors.left: parent.left - anchors.right: parent.right - - visible: theSource !== "" - - id: specificsTwo; - sourceComponent: specificQmlComponent - - property string theSource: specificQmlData - - onTheSourceChanged: { - active = false - active = true - } - - property int loaderHeight: specificsTwo.item.height + tabView.extraHeight - onLoaderHeightChanged: tabView.specficsTwoHeight = loaderHeight - - onLoaded: { - tabView.specficsTwoHeight = loaderHeight - } - } - - Loader { - anchors.left: parent.left - anchors.right: parent.right - - id: specificsOne; - source: specificsUrl; - - property int loaderHeight: specificsOne.item.height + tabView.extraHeight - onLoaderHeightChanged: tabView.specficsHeight = loaderHeight - - onLoaded: { - tabView.specficsOneHeight = loaderHeight - } - } + Loader { + id: specificsTwo + anchors.left: parent.left + anchors.right: parent.right + visible: theSource !== "" + sourceComponent: specificQmlComponent + + property string theSource: specificQmlData + + onTheSourceChanged: { + active = false + active = true } } + + Loader { + id: specificsOne + anchors.left: parent.left + anchors.right: parent.right + source: specificsUrl + } } } } diff --git a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/AnchorButtons.qml b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/AnchorButtons.qml index 84d5090125f..483c4947f0c 100644 --- a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/AnchorButtons.qml +++ b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/AnchorButtons.qml @@ -156,7 +156,7 @@ StudioControls.ButtonRow { buttonIcon: StudioTheme.Constants.centerVertical tooltip: qsTr("Anchor item vertically.") - property bool verticalCentered: anchorBackend.verticalCentered; + property bool verticalCentered: anchorBackend.verticalCentered onVerticalCenteredChanged: { checked = verticalCentered } @@ -179,7 +179,7 @@ StudioControls.ButtonRow { buttonIcon: StudioTheme.Constants.centerHorizontal tooltip: qsTr("Anchor item horizontally.") - property bool horizontalCentered: anchorBackend.horizontalCentered; + property bool horizontalCentered: anchorBackend.horizontalCentered onHorizontalCenteredChanged: { checked = horizontalCentered } diff --git a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/Button.qml b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/Button.qml index 5f989d7e5fd..a20469966af 100644 --- a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/Button.qml +++ b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/Button.qml @@ -1,6 +1,6 @@ /**************************************************************************** ** -** Copyright (C) 2016 The Qt Company Ltd. +** Copyright (C) 2020 The Qt Company Ltd. ** Contact: https://www.qt.io/licensing/ ** ** This file is part of Qt Creator. @@ -23,48 +23,79 @@ ** ****************************************************************************/ -import QtQuick 2.1 -import QtQuick.Controls 1.1 as Controls -import QtQuick.Controls.Styles 1.1 -import "Constants.js" as Constants +import QtQuick 2.15 +import QtQuick.Templates 2.15 as T +import StudioTheme 1.0 as StudioTheme -Controls.Button { - property color borderColor: "#222" - property color highlightColor: "orange" - property color textColor: "#eee" - style: ButtonStyle { - label: Text { - color: Constants.colorsDefaultText - anchors.fill: parent - renderType: Text.NativeRendering - verticalAlignment: Text.AlignVCenter - horizontalAlignment: Text.AlignHCenter - text: control.text - opacity: enabled ? 1 : 0.7 - } - background: Rectangle { - implicitWidth: 100 - implicitHeight: 23 - radius: 3 - gradient: control.pressed ? pressedGradient : gradient - Gradient{ - id: pressedGradient - GradientStop{color: "#333" ; position: 0} +T.AbstractButton { + id: myButton + + implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset, + implicitContentWidth + leftPadding + rightPadding) + implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset, + implicitContentHeight + topPadding + bottomPadding) + + background: Rectangle { + id: buttonBackground + implicitWidth: 100 + implicitHeight: 23 + radius: 3 + color: StudioTheme.Values.themeControlBackground + border.color: StudioTheme.Values.themeControlOutline + border.width: StudioTheme.Values.border + } + + contentItem: Text { + id: buttonText + color: StudioTheme.Values.themeTextColor + font.family: StudioTheme.Constants.font.family + font.pixelSize: StudioTheme.Values.myFontSize + verticalAlignment: Text.AlignVCenter + horizontalAlignment: Text.AlignHCenter + anchors.fill: parent + renderType: Text.QtRendering + text: myButton.text + } + + states: [ + State { + name: "default" + when: myButton.enabled && !myButton.hovered && !myButton.pressed + && !myButton.checked + PropertyChanges { + target: buttonBackground + color: StudioTheme.Values.themeControlBackground + } + }, + State { + name: "hovered" + when: myButton.hovered && !myButton.pressed + PropertyChanges { + target: buttonBackground + color: StudioTheme.Values.themeHoverHighlight } - Gradient { - id: gradient - GradientStop {color: "#606060" ; position: 0} - GradientStop {color: "#404040" ; position: 0.07} - GradientStop {color: "#303030" ; position: 1} + }, + State { + name: "pressed" + when: myButton.hovered && myButton.pressed + PropertyChanges { + target: buttonBackground + color: StudioTheme.Values.themeControlBackgroundPressed + border.color: StudioTheme.Values.themeInteraction } - Rectangle { - anchors.fill: parent - anchors.margins: -1 - color: "transparent" - radius: 4 - opacity: 0.3 - visible: control.activeFocus + }, + State { + name: "disabled" + when: !myButton.enabled + PropertyChanges { + target: buttonBackground + color: StudioTheme.Values.themeControlBackgroundDisabled + border.color: StudioTheme.Values.themeControlOutlineDisabled + } + PropertyChanges { + target: buttonText + color: StudioTheme.Values.themeTextColorDisabled } } - } + ] } diff --git a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/ButtonRowButton.qml b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/ButtonRowButton.qml index 6ba9957cd57..a893a12529a 100644 --- a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/ButtonRowButton.qml +++ b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/ButtonRowButton.qml @@ -23,10 +23,8 @@ ** ****************************************************************************/ -import QtQuick 2.1 -import QtQuick.Controls 1.0 as Controls -import QtQuick.Layouts 1.0 -import QtQuick.Controls.Private 1.0 +import QtQuick 2.15 +import QtQuick.Layouts 1.15 import QtQuickDesignerTheme 1.0 Item { diff --git a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/ColorEditor.qml b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/ColorEditor.qml index 8c12d37bb57..3d8291e7e70 100644 --- a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/ColorEditor.qml +++ b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/ColorEditor.qml @@ -38,7 +38,7 @@ Column { property bool supportGradient: false - property string caption: "Color" + property string caption: qsTr("Color") property variant backendValue @@ -47,7 +47,6 @@ Column { return Qt.rgba(backendValue.value.x, backendValue.value.y, backendValue.value.z, 1); else return backendValue.value; - } property alias gradientPropertyName: gradientLine.gradientPropertyName diff --git a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/EditableListView.qml b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/EditableListView.qml index e1d177fe074..c3344fcfe02 100644 --- a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/EditableListView.qml +++ b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/EditableListView.qml @@ -104,6 +104,7 @@ Rectangle { color: "transparent" border.width: StudioTheme.Values.border border.color: StudioTheme.Values.themeInteraction + visible: myColumn.currentItem ? myColumn.currentItem.focus : false x: myColumn.currentItem ? myColumn.currentItem.x : 0 y: myColumn.currentItem ? myColumn.currentItem.y : 0 z: 10 diff --git a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/ExpressionTextField.qml b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/ExpressionTextField.qml index 6209325e7e3..53557780d1a 100644 --- a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/ExpressionTextField.qml +++ b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/ExpressionTextField.qml @@ -23,13 +23,14 @@ ** ****************************************************************************/ -import QtQuick 2.1 -import "Constants.js" as Constants -import StudioControls 1.0 as StudioControls +import QtQuick 2.15 +import QtQuick.Window 2.15 +import QtQuick.Controls 2.15 import QtQuickDesignerTheme 1.0 +import StudioControls 1.0 as StudioControls +import StudioTheme 1.0 as StudioTheme StudioControls.TextField { - id: textField signal rejected @@ -38,103 +39,199 @@ StudioControls.TextField { actionIndicator.visible: false property bool completeOnlyTypes: false - - property bool completionActive: listView.count > 0 + property bool completionActive: listView.model !== null property bool dotCompletion: false property int dotCursorPos: 0 property string prefix - property alias showButtons: buttonrow.visible - property bool fixedSize: false + property bool replaceCurrentTextByCompletion: false - function commitCompletion() { - var cursorPos = textField.cursorPosition + property alias completionList: listView - var string = textField.text - var before = string.slice(0, cursorPos - textField.prefix.length) - var after = string.slice(cursorPos) - - textField.text = before + listView.currentItem.text + after - - textField.cursorPosition = cursorPos + listView.currentItem.text.length - prefix.length + function commitCompletion() { + if (replaceCurrentTextByCompletion) { + textField.text = listView.currentItem.text + } else { + var cursorPos = textField.cursorPosition + var string = textField.text + var before = string.slice(0, cursorPos - textField.prefix.length) + var after = string.slice(cursorPos) + textField.text = before + listView.currentItem.text + after + textField.cursorPosition = cursorPos + listView.currentItem.text.length - prefix.length + } listView.model = null } - ListView { - id: listView + Popup { + id: textFieldPopup + x: textField.x + y: textField.height - StudioTheme.Values.border + width: textField.width + // TODO Setting the height on the popup solved the problem with the popup of height 0, + // but it has the problem that it sometimes extend over the border of the actual window + // and is then cut off. + height: Math.min(contentItem.implicitHeight + textFieldPopup.topPadding + textFieldPopup.bottomPadding, + textField.Window.height - topMargin - bottomMargin, + StudioTheme.Values.maxComboBoxPopupHeight) + padding: StudioTheme.Values.border + margins: 0 // If not defined margin will be -1 + closePolicy: Popup.CloseOnPressOutside | Popup.CloseOnPressOutsideParent + | Popup.CloseOnEscape | Popup.CloseOnReleaseOutside + | Popup.CloseOnReleaseOutsideParent - clip: true - cacheBuffer: 0 - snapMode: ListView.SnapToItem - boundsBehavior: Flickable.StopAtBounds visible: textField.completionActive - delegate: Text { - text: modelData - color: Theme.color(Theme.PanelTextColorLight) - Rectangle { - visible: index === listView.currentIndex - z: -1 - anchors.fill: parent - color: Theme.qmlDesignerBackgroundColorDarkAlternate() + + onClosed: listView.model = null + + contentItem: ListView { + id: listView + clip: true + implicitHeight: contentHeight + boundsBehavior: Flickable.StopAtBounds + ScrollBar.vertical: StudioControls.ScrollBar { + id: popupScrollBar } - } - anchors.top: parent.top - anchors.topMargin: 26 - anchors.bottomMargin: textField.fixedSize ? -180 : 12 - anchors.bottom: parent.bottom - anchors.left: parent.left - width: 200 - spacing: 2 - children: [ - Rectangle { - visible: textField.fixedSize - anchors.fill: parent - color: Theme.qmlDesignerBackgroundColorDarker() - border.color: Theme.qmlDesignerBorderColor() - anchors.rightMargin: 12 - z: -1 + model: null + + delegate: ItemDelegate { + id: myItemDelegate + + width: textFieldPopup.width - textFieldPopup.leftPadding - textFieldPopup.rightPadding + - (popupScrollBar.visible ? popupScrollBar.contentItem.implicitWidth + + 2 : 0) // TODO Magic number + height: StudioTheme.Values.height - 2 * StudioTheme.Values.border + padding: 0 + text: itemDelegateText.text + + contentItem: Text { + id: itemDelegateText + leftPadding: 8 + text: modelData + color: StudioTheme.Values.themeTextColor + font: textField.font + elide: Text.ElideRight + verticalAlignment: Text.AlignVCenter + } + background: Rectangle { + color: "transparent" + } + + hoverEnabled: true + onHoveredChanged: { + if (hovered) + listView.currentIndex = index + } + onClicked: { + listView.currentIndex = index + if (textField.completionActive) + textField.commitCompletion() + } } - ] + highlight: Rectangle { + id: listViewHighlight + width: textFieldPopup.width - textFieldPopup.leftPadding - textFieldPopup.rightPadding + - (popupScrollBar.visible ? popupScrollBar.contentItem.implicitWidth + + 2 : 0) + height: StudioTheme.Values.height - 2 * StudioTheme.Values.border + color: StudioTheme.Values.themeInteraction + y: listView.currentItem.y + } + highlightFollowsCurrentItem: false + } + + background: Rectangle { + color: StudioTheme.Values.themeControlBackground + border.color: StudioTheme.Values.themeInteraction + border.width: StudioTheme.Values.border + } + + enter: Transition { + } + exit: Transition { + } } verticalAlignment: Text.AlignTop + onPressed: listView.model = null + Keys.priority: Keys.BeforeItem Keys.onPressed: { + var text = textField.text + var pos = textField.cursorPosition + var explicitComplete = true + + switch (event.key) { - if (event.key === Qt.Key_Period) { + case Qt.Key_Period: textField.dotCursorPos = textField.cursorPosition + 1 - var list = autoComplete(textField.text+".", textField.dotCursorPos, false, textField.completeOnlyTypes) - textField.prefix = list.pop() - listView.model = list; + text = textField.text + "." + pos = textField.dotCursorPos + explicitComplete = false textField.dotCompletion = true - } else { - if (textField.completionActive) { - var list2 = autoComplete(textField.text + event.text, - textField.cursorPosition + event.text.length, - true, textField.completeOnlyTypes) - textField.prefix = list2.pop() - listView.model = list2; - } + break + + case Qt.Key_Right: + if (!textField.completionActive) + return + + pos = Math.min(textField.cursorPosition + 1, textField.text.length) + break + + case Qt.Key_Left: + if (!textField.completionActive) + return + + pos = Math.max(0, textField.cursorPosition - 1) + break + + case Qt.Key_Backspace: + if (!textField.completionActive) + return + + pos = textField.cursorPosition - 1 + if (pos < 0) + return + + text = textField.text.substring(0, pos) + textField.text.substring(textField.cursorPosition) + break + + case Qt.Key_Delete: + return + + default: + if (!textField.completionActive) + return + + var tmp = textField.text + text = tmp.substring(0, textField.cursorPosition) + event.text + tmp.substring(textField.cursorPosition) + pos = textField.cursorPosition + event.text.length } + + var list = autoComplete(text.trim(), pos, explicitComplete, textField.completeOnlyTypes) + textField.prefix = text.substring(0, pos) + + if (list.length && list[list.length - 1] === textField.prefix) + list.pop() + + listView.model = list } Keys.onSpacePressed: { if (event.modifiers & Qt.ControlModifier) { var list = autoComplete(textField.text, textField.cursorPosition, true, textField.completeOnlyTypes) - textField.prefix = list.pop() - listView.model = list; + textField.prefix = textField.text.substring(0, textField.cursorPosition) + if (list.length && list[list.length - 1] === textField.prefix) + list.pop() + + listView.model = list textField.dotCompletion = false event.accepted = true; - - if (list.length == 1) - textField.commitCompletion() - } else { event.accepted = false } diff --git a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/FontSection.qml b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/FontSection.qml index bf81004f97d..d9da5510445 100644 --- a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/FontSection.qml +++ b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/FontSection.qml @@ -73,7 +73,6 @@ Section { Layout.fillWidth: true width: 160 property string familyName: backendValue.value - onFamilyNameChanged: print(styleNamesForFamily(familyName)) } Label { diff --git a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/GradientPresetList.qml b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/GradientPresetList.qml index d756b53fe65..4a0665076a6 100644 --- a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/GradientPresetList.qml +++ b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/GradientPresetList.qml @@ -23,12 +23,11 @@ ** ****************************************************************************/ -import QtQuick 2.11 -import QtQuick.Layouts 1.12 +import QtQuick 2.15 +import QtQuick.Layouts 1.15 import QtQuick.Dialogs 1.3 - -import HelperWidgets 2.0 import QtQuickDesignerTheme 1.0 +import HelperWidgets 2.0 import StudioControls 1.0 as StudioControls import StudioTheme 1.0 as StudioTheme @@ -76,49 +75,52 @@ Dialog { anchors.margins: 13 anchors.bottomMargin: 71 - TabView { - id: presetTabView - Layout.alignment: Qt.AlignTop | Qt.AlignHCenter - Layout.fillHeight: true - Layout.fillWidth: true + StudioControls.TabBar { + id: presetTabBar - Tab { - title: qsTr("System Presets") - anchors.fill: parent + anchors.left: parent.left + anchors.right: parent.right - GradientPresetTabContent { - id: defaultTabContent - viewModel: defaultPresetListModel - editableName: false - } + StudioControls.TabButton { + text: qsTr("System Presets") } + StudioControls.TabButton { + text: qsTr("User Presets") + } + } + + StackLayout { + anchors.left: parent.left + anchors.right: parent.right + currentIndex: presetTabBar.currentIndex + + GradientPresetTabContent { + id: defaultTabContent + viewModel: defaultPresetListModel + editableName: false + } + + GradientPresetTabContent { + id: customTabContent + viewModel: customPresetListModel + editableName: true + onPresetNameChanged: customPresetListModel.changePresetName(id, name) + + property int deleteId + + onDeleteButtonClicked: { + deleteId = id + deleteDialog.open() + } - Tab { - title: qsTr("User Presets") - anchors.fill: parent - - GradientPresetTabContent { - id: customTabContent - viewModel: customPresetListModel - editableName: true - onPresetNameChanged: customPresetListModel.changePresetName(id, name) - - property int deleteId - - onDeleteButtonClicked: { - deleteId = id - deleteDialog.open() - } - - MessageDialog { - id: deleteDialog - visible: false - modality: Qt.WindowModal - standardButtons: Dialog.No | Dialog.Yes - title: qsTr("Delete preset?") - text: qsTr("Are you sure you want to delete this preset?") - onAccepted: customPresetListModel.deletePreset(customTabContent.deleteId) - } + MessageDialog { + id: deleteDialog + visible: false + modality: Qt.WindowModal + standardButtons: Dialog.No | Dialog.Yes + title: qsTr("Delete preset?") + text: qsTr("Are you sure you want to delete this preset?") + onAccepted: customPresetListModel.deletePreset(customTabContent.deleteId) } } } diff --git a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/GradientPresetTabContent.qml b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/GradientPresetTabContent.qml index f26064dd213..fd0fee4cf77 100644 --- a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/GradientPresetTabContent.qml +++ b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/GradientPresetTabContent.qml @@ -23,12 +23,11 @@ ** ****************************************************************************/ -import QtQuick 2.11 -import QtQuick.Layouts 1.12 -import QtQuick.Dialogs 1.3 - -import HelperWidgets 2.0 +import QtQuick 2.15 +import QtQuick.Controls 2.15 +import QtQuick.Layouts 1.15 import QtQuickDesignerTheme 1.0 +import HelperWidgets 2.0 import StudioControls 1.0 as StudioControls import StudioTheme 1.0 as StudioTheme @@ -48,271 +47,277 @@ Rectangle { property real delegateHeight: 178 property real gridCellWidth: 160 - ScrollView { + GridView { + id: gradientTable Layout.fillWidth: true Layout.fillHeight: true anchors.fill: parent + anchors.leftMargin: 10 + clip: true + delegate: gradientDelegate + + property int gridColumns: width / tabBackground.gridCellWidth; + cellWidth: width / gridColumns + cellHeight: 185 + + property bool bothVisible: horizontal.scrollBarVisible && vertical.scrollBarVisible + + ScrollBar.horizontal: HorizontalScrollBar { + id: horizontal + parent: gradientTable + } + + ScrollBar.vertical: VerticalScrollBar { + id: vertical + parent: gradientTable + } + + Component { + id: gradientDelegate + + Rectangle { + id: backgroundCard + color: StudioTheme.Values.themeControlOutline + clip: true - GridView { - id: gradientTable - Layout.fillWidth: true - Layout.fillHeight: true - anchors.fill: parent - anchors.leftMargin: 10 - clip: true - delegate: gradientDelegate - - property int gridColumns: width / tabBackground.gridCellWidth; - cellWidth: width / gridColumns - cellHeight: 185 - - Component { - id: gradientDelegate - - Rectangle { - id: backgroundCard - color: StudioTheme.Values.themeControlOutline - clip: true - - property real flexibleWidth: (gradientTable.width - gradientTable.cellWidth * gradientTable.gridColumns) / gradientTable.gridColumns - property bool isSelected: false - - width: gradientTable.cellWidth + flexibleWidth - 8 - height: tabBackground.delegateHeight - radius: 16 - - function selectPreset(index) { - gradientTable.currentIndex = index - gradientData.stops = stopsPosList - gradientData.colors = stopsColorList - gradientData.stopsCount = stopListSize - gradientData.presetID = presetID - gradientData.presetType = presetTabView.currentIndex - - if (gradientData.selectedItem != null) - gradientData.selectedItem.isSelected = false - - backgroundCard.isSelected = true - gradientData.selectedItem = backgroundCard + property real flexibleWidth: (gradientTable.width - gradientTable.cellWidth * gradientTable.gridColumns) / gradientTable.gridColumns + property bool isSelected: false + + width: gradientTable.cellWidth + flexibleWidth - 8 + height: tabBackground.delegateHeight + radius: 16 + + function selectPreset(index) { + gradientTable.currentIndex = index + gradientData.stops = stopsPosList + gradientData.colors = stopsColorList + gradientData.stopsCount = stopListSize + gradientData.presetID = presetID + gradientData.presetType = presetTabBar.currentIndex + + if (gradientData.selectedItem != null) + gradientData.selectedItem.isSelected = false + + backgroundCard.isSelected = true + gradientData.selectedItem = backgroundCard + } + + MouseArea { + id: rectMouseArea + anchors.fill: parent + hoverEnabled: true + onClicked: { + presetNameBox.edit = false + nameInput.focus = false + backgroundCard.selectPreset(index) } + } - MouseArea { - id: rectMouseArea - anchors.fill: parent - hoverEnabled: true - onClicked: { - presetNameBox.edit = false - nameInput.focus = false - backgroundCard.selectPreset(index) + states: [ + State { + name: "default" + when: !(rectMouseArea.containsMouse || removeButton.hovered || + (nameMouseArea.containsMouse && !tabBackground.editableName)) && + !backgroundCard.isSelected + PropertyChanges { + target: backgroundCard + color: StudioTheme.Values.themeControlOutline + border.width: 0 + } + }, + State { + name: "hovered" + when: (rectMouseArea.containsMouse || removeButton.hovered || + (nameMouseArea.containsMouse && !tabBackground.editableName)) && + !backgroundCard.isSelected + PropertyChanges { + target: backgroundCard + color: StudioTheme.Values.themeControlBackgroundPressed + border.width: 1 + border.color: StudioTheme.Values.themeInteraction + } + }, + State { + name: "selected" + when: backgroundCard.isSelected + PropertyChanges { + target: backgroundCard + color:StudioTheme.Values.themeInteraction + border.width: 1 + border.color: StudioTheme.Values.themeControlBackgroundPressed } } + ] + + ColumnLayout { + spacing: 2 + anchors.fill: parent + + Rectangle { + id: gradientRect + width: 150 + height: 150 + radius: 16 + Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter + Layout.topMargin: 2 + + gradient: Gradient { + id: showGr + } - states: [ - State { - name: "default" - when: !(rectMouseArea.containsMouse || removeButton.hovered || - (nameMouseArea.containsMouse && !tabBackground.editableName)) && - !backgroundCard.isSelected - PropertyChanges { - target: backgroundCard - color: StudioTheme.Values.themeControlOutline - border.width: 0 - } - }, - State { - name: "hovered" - when: (rectMouseArea.containsMouse || removeButton.hovered || - (nameMouseArea.containsMouse && !tabBackground.editableName)) && - !backgroundCard.isSelected - PropertyChanges { - target: backgroundCard - color: StudioTheme.Values.themeControlBackgroundPressed - border.width: 1 - border.color: StudioTheme.Values.themeInteraction - } - }, - State { - name: "selected" - when: backgroundCard.isSelected - PropertyChanges { - target: backgroundCard - color:StudioTheme.Values.themeInteraction - border.width: 1 - border.color: StudioTheme.Values.themeControlBackgroundPressed + Component { + id: stopComponent + GradientStop {} + } + + Component.onCompleted: { + var stopsAmount = stopListSize; + var newStops = []; + for (var i = 0; i < stopsAmount; i++) { + newStops.push( stopComponent.createObject(showGr, { "position": stopsPosList[i], "color": stopsColorList[i] }) ); } + showGr.stops = newStops; } - ] - ColumnLayout { - spacing: 2 - anchors.fill: parent + AbstractButton { + id: removeButton + visible: editableName && (rectMouseArea.containsMouse || removeButton.hovered) + backgroundRadius: StudioTheme.Values.smallRectWidth + anchors.right: parent.right + anchors.rightMargin: 5 + anchors.top: parent.top + anchors.topMargin: 5 + width: Math.round(StudioTheme.Values.smallRectWidth) + height: Math.round(StudioTheme.Values.smallRectWidth) + buttonIcon: StudioTheme.Constants.closeCross + onClicked: tabBackground.deleteButtonClicked(index) + } + } + + Item { + id: presetNameBox + Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter + Layout.preferredWidth: backgroundCard.width - 2 + Layout.preferredHeight: backgroundCard.height - gradientRect.height - 4 + Layout.bottomMargin: 4 + + property bool edit: false Rectangle { - id: gradientRect - width: 150 - height: 150 + id: nameBackgroundColor + enabled: tabBackground.editableName + color: "transparent" radius: 16 - Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter - Layout.topMargin: 2 - - gradient: Gradient { - id: showGr - } + visible: true + anchors.fill: parent + } - Component { - id: stopComponent - GradientStop {} - } + ToolTipArea { + id: nameMouseArea + anchors.fill: parent + tooltip: nameText.text + propagateComposedEvents: true - Component.onCompleted: { - var stopsAmount = stopListSize; - var newStops = []; - for (var i = 0; i < stopsAmount; i++) { - newStops.push( stopComponent.createObject(showGr, { "position": stopsPosList[i], "color": stopsColorList[i] }) ); + onClicked: { + if (!tabBackground.editableName) { + backgroundCard.selectPreset(index) + return } - showGr.stops = newStops; - } - AbstractButton { - id: removeButton - visible: editableName && (rectMouseArea.containsMouse || removeButton.hovered) - backgroundRadius: StudioTheme.Values.smallRectWidth - anchors.right: parent.right - anchors.rightMargin: 5 - anchors.top: parent.top - anchors.topMargin: 5 - width: Math.round(StudioTheme.Values.smallRectWidth) - height: Math.round(StudioTheme.Values.smallRectWidth) - buttonIcon: StudioTheme.Constants.closeCross - onClicked: tabBackground.deleteButtonClicked(index) + presetNameBox.edit = true + nameInput.forceActiveFocus() + // have to select text like this, otherwise there is an issue with long names + nameInput.cursorPosition = 0 + nameInput.cursorPosition = nameInput.length + nameInput.selectAll() } } - Item { - id: presetNameBox - Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter - Layout.preferredWidth: backgroundCard.width - 2 - Layout.preferredHeight: backgroundCard.height - gradientRect.height - 4 - Layout.bottomMargin: 4 - - property bool edit: false - - Rectangle { - id: nameBackgroundColor - enabled: tabBackground.editableName - color: "transparent" - radius: 16 - visible: true - anchors.fill: parent - } - - ToolTipArea { - id: nameMouseArea - anchors.fill: parent - tooltip: nameText.text - propagateComposedEvents: true - - onClicked: { - if (!tabBackground.editableName) { - backgroundCard.selectPreset(index) - return - } - - presetNameBox.edit = true - nameInput.forceActiveFocus() - // have to select text like this, otherwise there is an issue with long names - nameInput.cursorPosition = 0 - nameInput.cursorPosition = nameInput.length - nameInput.selectAll() - } - } + Text { + id: nameText + text: presetName + anchors.fill: parent + horizontalAlignment: Text.AlignHCenter + verticalAlignment: Text.AlignVCenter + color: StudioTheme.Values.themeTextColor + elide: Text.ElideMiddle + maximumLineCount: 1 + } - Text { - id: nameText - text: presetName - anchors.fill: parent - horizontalAlignment: Text.AlignHCenter - verticalAlignment: Text.AlignVCenter - color: StudioTheme.Values.themeTextColor - elide: Text.ElideMiddle - maximumLineCount: 1 + TextInput { + id: nameInput + enabled: tabBackground.editableName + visible: false + text: presetName + anchors.fill: parent + anchors.leftMargin: 5 + anchors.rightMargin: 5 + horizontalAlignment: TextInput.AlignHCenter + verticalAlignment: TextInput.AlignVCenter + color: StudioTheme.Values.themeTextColor + selectionColor: StudioTheme.Values.themeInteraction + selectByMouse: true + activeFocusOnPress: true + wrapMode: TextInput.NoWrap + clip: true + + onEditingFinished: { + nameText.text = text + tabBackground.presetNameChanged(index, text) + presetNameBox.edit = false } - TextInput { - id: nameInput - enabled: tabBackground.editableName - visible: false - text: presetName - anchors.fill: parent - anchors.leftMargin: 5 - anchors.rightMargin: 5 - horizontalAlignment: TextInput.AlignHCenter - verticalAlignment: TextInput.AlignVCenter - color: StudioTheme.Values.themeTextColor - selectionColor: StudioTheme.Values.themeInteraction - selectByMouse: true - activeFocusOnPress: true - wrapMode: TextInput.NoWrap - clip: true - - onEditingFinished: { - nameText.text = text - tabBackground.presetNameChanged(index, text) - presetNameBox.edit = false + Keys.onPressed: { + if (event.key === Qt.Key_Enter || event.key === Qt.Key_Return) { + event.accepted = true + nameInput.editingFinished() + nameInput.focus = false } - Keys.onPressed: { - if (event.key === Qt.Key_Enter || event.key === Qt.Key_Return) { - event.accepted = true - nameInput.editingFinished() - nameInput.focus = false - } - - if (event.key === Qt.Key_Escape) { - event.accepted = true - nameInput.text = nameText.text - nameInput.focus = false - } + if (event.key === Qt.Key_Escape) { + event.accepted = true + nameInput.text = nameText.text + nameInput.focus = false } } + } - states: [ - State { - name: "default" - when: tabBackground.editableName && !nameMouseArea.containsMouse && !presetNameBox.edit - PropertyChanges { - target: nameBackgroundColor - color: "transparent" - border.width: 0 - } - PropertyChanges { target: nameText; visible: true } - PropertyChanges { target: nameInput; visible: false } - }, - State { - name: "hovered" - when: tabBackground.editableName && nameMouseArea.containsMouse && !presetNameBox.edit - PropertyChanges { - target: nameBackgroundColor - color: StudioTheme.Values.themeControlBackgroundPressed - border.width: 0 - } - PropertyChanges { target: nameText; visible: true } - PropertyChanges { target: nameInput; visible: false } - }, - State { - name: "edit" - when: tabBackground.editableName && presetNameBox.edit - PropertyChanges { - target: nameBackgroundColor - color: StudioTheme.Values.themeControlBackgroundPressed - border.color: StudioTheme.Values.themeInteraction - border.width: 1 - } - PropertyChanges { target: nameText; visible: false } - PropertyChanges { target: nameInput; visible: true } + states: [ + State { + name: "default" + when: tabBackground.editableName && !nameMouseArea.containsMouse && !presetNameBox.edit + PropertyChanges { + target: nameBackgroundColor + color: "transparent" + border.width: 0 } - ] - } + PropertyChanges { target: nameText; visible: true } + PropertyChanges { target: nameInput; visible: false } + }, + State { + name: "hovered" + when: tabBackground.editableName && nameMouseArea.containsMouse && !presetNameBox.edit + PropertyChanges { + target: nameBackgroundColor + color: StudioTheme.Values.themeControlBackgroundPressed + border.width: 0 + } + PropertyChanges { target: nameText; visible: true } + PropertyChanges { target: nameInput; visible: false } + }, + State { + name: "edit" + when: tabBackground.editableName && presetNameBox.edit + PropertyChanges { + target: nameBackgroundColor + color: StudioTheme.Values.themeControlBackgroundPressed + border.color: StudioTheme.Values.themeInteraction + border.width: 1 + } + PropertyChanges { target: nameText; visible: false } + PropertyChanges { target: nameInput; visible: true } + } + ] } } } diff --git a/share/qtcreator/qmldesigner/statesEditorQmlSources/DesignerTextFieldStyle.qml b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/HorizontalScrollBar.qml index 64a8835db70..12111f7e1c0 100644 --- a/share/qtcreator/qmldesigner/statesEditorQmlSources/DesignerTextFieldStyle.qml +++ b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/HorizontalScrollBar.qml @@ -1,6 +1,6 @@ /**************************************************************************** ** -** Copyright (C) 2016 The Qt Company Ltd. +** Copyright (C) 2020 The Qt Company Ltd. ** Contact: https://www.qt.io/licensing/ ** ** This file is part of Qt Creator. @@ -23,25 +23,29 @@ ** ****************************************************************************/ -import QtQuick 2.2 -import QtQuick.Controls 1.1 -import QtQuick.Controls.Styles 1.1 -import QtQuickDesignerTheme 1.0 +import QtQuick 2.15 +import QtQuick.Controls 2.15 +import StudioTheme 1.0 as StudioTheme -TextFieldStyle { - selectionColor: Theme.color(Theme.PanelTextColorLight) - selectedTextColor: Theme.color(Theme.PanelTextColorDark) - textColor: Theme.color(Theme.PanelTextColorLight) - placeholderTextColor: Theme.color(Theme.PanelTextColorMid) +ScrollBar { + id: scrollBar - padding.top: 4 - padding.bottom: 4 + property bool scrollBarVisible: parent.childrenRect.width > parent.width + + orientation: Qt.Horizontal + policy: scrollBar.scrollBarVisible ? ScrollBar.AlwaysOn : ScrollBar.AlwaysOff + x: 0 + y: parent.height - height + width: parent.availableWidth + - (parent.bothVisible ? parent.verticalThickness : 0) + padding: 0 background: Rectangle { - implicitWidth: 100 - implicitHeight: font.pixelSize + padding.top + padding.bottom - color: Theme.color(Theme.FancyToolButtonSelectedColor) - border.color: Theme.qmlDesignerBackgroundColorDarker() + color: StudioTheme.Values.themeSectionHeadBackground + } + + contentItem: Rectangle { + implicitHeight: StudioTheme.Values.scrollBarThickness + color: StudioTheme.Values.themeScrollBarHandle } - renderType: Text.NativeRendering } diff --git a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/IconLabel.qml b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/IconLabel.qml index f61a057ae09..85ed936a6b0 100644 --- a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/IconLabel.qml +++ b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/IconLabel.qml @@ -23,31 +23,16 @@ ** ****************************************************************************/ -import QtQuick 2.1 -import QtQuick.Controls 2.0 as Controls -import QtQuick.Layouts 1.0 +import QtQuick 2.15 +import HelperWidgets 2.0 +import StudioTheme 1.0 as StudioTheme -Item { - id: label - width: parent.width < 300 ? 80 : Math.min(140, parent.width - 220) - height: 16 - property alias source: image.source +Label { + id: myLabel - Item { - width: 16 - height: 16 - Image { - id: image - anchors.fill: parent - } + property alias icon: myLabel.text - } - - Layout.preferredWidth: width - Layout.minimumWidth: width - Layout.maximumWidth: width - -// Component.onCompleted: { -// label.Layout.preferredWidth = width -// } + text: StudioTheme.Constants.actionIcon + font.family: StudioTheme.Constants.iconFont.family + font.pixelSize: StudioTheme.Values.myIconFontSize } diff --git a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/ScrollView.qml b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/ScrollView.qml index 7dc4a0e395b..c101bff09c7 100644 --- a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/ScrollView.qml +++ b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/ScrollView.qml @@ -23,13 +23,37 @@ ** ****************************************************************************/ -import QtQuick 2.1 -import QtQuick.Controls 1.0 as Controls -import "../../../common/" +import QtQuick 2.15 +import QtQuick.Controls 2.15 +import StudioTheme 1.0 as StudioTheme -Controls.ScrollView { - style: DesignerScrollViewStyle { +Flickable { + id: flickable + property alias horizontalThickness: horizontalScrollBar.height + property alias verticalThickness: verticalScrollBar.width + property bool bothVisible: verticalScrollBar.scrollBarVisible + && horizontalScrollBar.scrollBarVisible + + contentWidth: areaItem.childrenRect.width + contentHeight: areaItem.childrenRect.height + boundsBehavior: Flickable.StopAtBounds + + default property alias content: areaItem.children + + Item { + id: areaItem + } + + ScrollBar.horizontal: HorizontalScrollBar { + id: horizontalScrollBar + parent: flickable + scrollBarVisible: areaItem.childrenRect.width > flickable.width + } + + ScrollBar.vertical: VerticalScrollBar { + id: verticalScrollBar + parent: flickable + scrollBarVisible: areaItem.childrenRect.height > flickable.height } - frameVisible: false } diff --git a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/Tab.qml b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/VerticalScrollBar.qml index 79806d2bcc5..97234524d44 100644 --- a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/Tab.qml +++ b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/VerticalScrollBar.qml @@ -1,6 +1,6 @@ /**************************************************************************** ** -** Copyright (C) 2016 The Qt Company Ltd. +** Copyright (C) 2020 The Qt Company Ltd. ** Contact: https://www.qt.io/licensing/ ** ** This file is part of Qt Creator. @@ -23,9 +23,29 @@ ** ****************************************************************************/ -import QtQuick 2.1 -import QtQuick.Controls 1.0 as Controls +import QtQuick 2.15 +import QtQuick.Controls 2.15 +import StudioTheme 1.0 as StudioTheme -Controls.Tab { +ScrollBar { + id: scrollBar + property bool scrollBarVisible: parent.childrenRect.height > parent.height + + orientation: Qt.Vertical + policy: scrollBar.scrollBarVisible ? ScrollBar.AlwaysOn : ScrollBar.AlwaysOff + x: parent.width - width + y: 0 + height: parent.availableHeight + - (parent.bothVisible ? parent.horizontalThickness : 0) + padding: 0 + + background: Rectangle { + color: StudioTheme.Values.themeSectionHeadBackground + } + + contentItem: Rectangle { + implicitWidth: StudioTheme.Values.scrollBarThickness + color: StudioTheme.Values.themeScrollBarHandle + } } diff --git a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/qmldir b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/qmldir index f77c9e19348..59573217c53 100644 --- a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/qmldir +++ b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/qmldir @@ -39,11 +39,11 @@ SimpleColorPalette 2.0 SimpleColorPalette.qml DoubleSpinBox 2.0 DoubleSpinBox.qml SpinBox 2.0 SpinBox.qml StandardTextSection 2.0 StandardTextSection.qml -Tab 2.0 Tab.qml -TabView 2.0 TabView.qml ToolTipArea 2.0 ToolTipArea.qml UrlChooser 2.0 UrlChooser.qml PaddingSection 2.0 PaddingSection.qml RoundedPanel 2.0 RoundedPanel.qml ExpressionTextField 2.0 ExpressionTextField.qml MarginSection 2.0 MarginSection.qml +HorizontalScrollBar 2.0 HorizontalScrollBar.qml +VerticalScrollBar 2.0 VerticalScrollBar.qml diff --git a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/ActionIndicator.qml b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/ActionIndicator.qml index 908f2274e6a..a055447d967 100644 --- a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/ActionIndicator.qml +++ b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/ActionIndicator.qml @@ -116,7 +116,6 @@ Rectangle { color: StudioTheme.Values.themeHoverHighlight border.color: StudioTheme.Values.themeControlOutline } - }, State { name: "edit" diff --git a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/CheckBox.qml b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/CheckBox.qml index 0faaf7e0a8d..5e55a4855be 100644 --- a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/CheckBox.qml +++ b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/CheckBox.qml @@ -46,8 +46,7 @@ T.CheckBox { implicitWidth: Math.max( implicitBackgroundWidth + leftInset + rightInset, - implicitContentWidth + leftPadding + rightPadding - + implicitIndicatorWidth + spacing + actionIndicator.width) + implicitContentWidth + leftPadding + rightPadding) implicitHeight: Math.max( implicitBackgroundHeight + topInset + bottomInset, implicitContentHeight + topPadding + bottomPadding, diff --git a/share/qtcreator/qmldesigner/common/DesignerScrollViewStyle.qml b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/TabBar.qml index b8284e7d4d2..1b71f1f4dea 100644 --- a/share/qtcreator/qmldesigner/common/DesignerScrollViewStyle.qml +++ b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/TabBar.qml @@ -1,6 +1,6 @@ /**************************************************************************** ** -** Copyright (C) 2016 The Qt Company Ltd. +** Copyright (C) 2020 The Qt Company Ltd. ** Contact: https://www.qt.io/licensing/ ** ** This file is part of Qt Creator. @@ -23,38 +23,33 @@ ** ****************************************************************************/ -import QtQuick 2.2 -import QtQuick.Controls 1.1 -import QtQuick.Controls.Styles 1.1 -import QtQuickDesignerTheme 1.0 +import QtQuick 2.15 +import QtQuick.Templates 2.15 as T +import StudioTheme 1.0 as StudioTheme -ScrollViewStyle { - readonly property color scrollbarColor: Theme.color(Theme.BackgroundColorDark) - readonly property color scrollBarHandleColor: Theme.color(Theme.QmlDesigner_ScrollBarHandleColor) +T.TabBar { + id: myButton - padding {left: 0; top: 0; right: 0; bottom: 0} + implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset, + implicitContentWidth + leftPadding + rightPadding) + implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset, + implicitContentHeight + topPadding + bottomPadding) - scrollBarBackground: Rectangle { - height: 10 - width: 10 - color: scrollbarColor - } - handle: Item { - implicitWidth: 10 - implicitHeight: 10 - Rectangle { - anchors.fill: parent - color: scrollBarHandleColor - } - } + spacing: 0 + bottomPadding: 4 - decrementControl: Item {} - incrementControl: Item {} - corner: Item {} + contentItem: ListView { + model: myButton.contentModel + currentIndex: myButton.currentIndex + + spacing: myButton.spacing + orientation: ListView.Horizontal + boundsBehavior: Flickable.StopAtBounds + flickableDirection: Flickable.AutoFlickIfNeeded + snapMode: ListView.SnapToItem + } - //Even if the platform style reports touch support a scrollview should not be flickable. - Component.onCompleted: { - control.flickableItem.interactive = false + background: Rectangle { + color: StudioTheme.Values.themeTabLight } - transientScrollBars: false } diff --git a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/TabView.qml b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/TabButton.qml index b5e0ac02214..3b8efdfe55a 100644 --- a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/TabView.qml +++ b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/TabButton.qml @@ -1,6 +1,6 @@ /**************************************************************************** ** -** Copyright (C) 2016 The Qt Company Ltd. +** Copyright (C) 2020 The Qt Company Ltd. ** Contact: https://www.qt.io/licensing/ ** ** This file is part of Qt Creator. @@ -23,40 +23,38 @@ ** ****************************************************************************/ -import QtQuick 2.1 -import QtQuick.Controls 1.0 as Controls -import QtQuick.Controls.Styles 1.1 -import QtQuickDesignerTheme 1.0 +import QtQuick 2.15 +import QtQuick.Templates 2.15 as T import StudioTheme 1.0 as StudioTheme -Controls.TabView { - id: root +T.TabButton { + id: myButton - frameVisible: false - style: TabViewStyle { - frameOverlap: 0 - frame: Item { } - tab: Rectangle { - color: styleData.selected ? Theme.qmlDesignerTabLight() : Theme.qmlDesignerTabDark() - implicitWidth: root.width/root.count + 2 - implicitHeight: 28 - Text { - id: text - font.bold: true - font.pixelSize: StudioTheme.Values.myFontSize - anchors.centerIn: parent - anchors.verticalCenterOffset: -1 - text: styleData.title - renderType: Text.NativeRendering - color: styleData.selected ? Theme.qmlDesignerTabDark() : Theme.qmlDesignerTabLight() - } + implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset, + implicitContentWidth + leftPadding + rightPadding) + implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset, + implicitContentHeight + topPadding + bottomPadding) - Rectangle { - color:Theme.qmlDesignerTabLight() - width: parent.width - height: 4 - anchors.bottom: parent.bottom - } - } + padding: 1 + + background: Rectangle { + id: buttonBackground + color: myButton.checked ? StudioTheme.Values.themeTabLight : StudioTheme.Values.themeTabDark + border.color: StudioTheme.Values.themeControlOutline + border.width: 0 + } + + contentItem: T.Label { + id: buttonIcon + color: myButton.checked ? StudioTheme.Values.themeTabDark : StudioTheme.Values.themeTabLight + font.weight: Font.Bold + //font.family: StudioTheme.Constants.font.family + font.pixelSize: StudioTheme.Values.myFontSize + verticalAlignment: Text.AlignVCenter + horizontalAlignment: Text.AlignHCenter + anchors.fill: parent + renderType: Text.QtRendering + + text: myButton.text } } diff --git a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/qmldir b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/qmldir index ee876cc9353..75cf4f0cfad 100644 --- a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/qmldir +++ b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioControls/qmldir @@ -28,6 +28,8 @@ SliderPopup 1.0 SliderPopup.qml SpinBox 1.0 SpinBox.qml SpinBoxIndicator 1.0 SpinBoxIndicator.qml SpinBoxInput 1.0 SpinBoxInput.qml +TabBar 1.0 TabBar.qml +TabButton 1.0 TabButton.qml TextArea 1.0 TextArea.qml TextField 1.0 TextField.qml TranslationIndicator 1.0 TranslationIndicator.qml diff --git a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioTheme/InternalConstants.qml b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioTheme/InternalConstants.qml index c326cc08f1d..3d17883c544 100644 --- a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioTheme/InternalConstants.qml +++ b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioTheme/InternalConstants.qml @@ -94,27 +94,33 @@ QtObject { readonly property string fontStyleItalic: "\u0057" readonly property string fontStyleStrikethrough: "\u0058" readonly property string fontStyleUnderline: "\u0059" - readonly property string mergeCells: "\u005A" - readonly property string redo: "\u005B" - readonly property string splitColumns: "\u005C" - readonly property string splitRows: "\u005D" - readonly property string startNode: "\u005E" - readonly property string testIcon: "\u005F" - readonly property string textAlignBottom: "\u0060" - readonly property string textAlignCenter: "\u0061" - readonly property string textAlignLeft: "\u0062" - readonly property string textAlignMiddle: "\u0063" - readonly property string textAlignRight: "\u0064" - readonly property string textAlignTop: "\u0065" - readonly property string textBulletList: "\u0066" - readonly property string textFullJustification: "\u0067" - readonly property string textNumberedList: "\u0068" - readonly property string tickIcon: "\u0069" - readonly property string triState: "\u006A" - readonly property string undo: "\u006B" - readonly property string upDownIcon: "\u006C" - readonly property string upDownSquare2: "\u006D" - readonly property string wildcard: "\u006E" + readonly property string idAliasOff: "\u005A" + readonly property string idAliasOn: "\u005B" + readonly property string mergeCells: "\u005C" + readonly property string redo: "\u005D" + readonly property string splitColumns: "\u005E" + readonly property string splitRows: "\u005F" + readonly property string startNode: "\u0060" + readonly property string testIcon: "\u0061" + readonly property string textAlignBottom: "\u0062" + readonly property string textAlignCenter: "\u0063" + readonly property string textAlignLeft: "\u0064" + readonly property string textAlignMiddle: "\u0065" + readonly property string textAlignRight: "\u0066" + readonly property string textAlignTop: "\u0067" + readonly property string textBulletList: "\u0068" + readonly property string textFullJustification: "\u0069" + readonly property string textNumberedList: "\u006A" + readonly property string tickIcon: "\u006B" + readonly property string triState: "\u006C" + readonly property string undo: "\u006D" + readonly property string upDownIcon: "\u006E" + readonly property string upDownSquare2: "\u006F" + readonly property string wildcard: "\u0070" + readonly property string zoomAll: "\u0071" + readonly property string zoomIn: "\u0072" + readonly property string zoomOut: "\u0073" + readonly property string zoomSelection: "\u0074" readonly property font iconFont: Qt.font({ "family": controlIcons.name, diff --git a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioTheme/Values.qml b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioTheme/Values.qml index 9f04812af91..65cc7f3cfcd 100644 --- a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioTheme/Values.qml +++ b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioTheme/Values.qml @@ -79,6 +79,8 @@ QtObject { property real inputHorizontalPadding: Math.round(4 * values.scaleFactor) + property real scrollBarThickness: 10 + // Theme Colors // COLORS NOW COME FROM THE THEME FILES @@ -117,6 +119,9 @@ QtObject { property string themeTranslationIndicatorBorder: Theme.color(Theme.DStranlsationIndicatorBorder) property string themeSectionHeadBackground: Theme.color(Theme.DSsectionHeadBackground) + property string themeTabDark: Theme.color(Theme.QmlDesigner_TabDark) + property string themeTabLight: Theme.color(Theme.QmlDesigner_TabLight) + // Taken out of Constants.js property string themeChangedStateText: Theme.color(Theme.DSchangedStateText) } diff --git a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioTheme/icons.ttf b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioTheme/icons.ttf Binary files differindex 47becb68731..46a677784ac 100644 --- a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioTheme/icons.ttf +++ b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioTheme/icons.ttf diff --git a/share/qtcreator/qmldesigner/statesEditorQmlSources/StatesDelegate.qml b/share/qtcreator/qmldesigner/statesEditorQmlSources/StatesDelegate.qml index e6e5be75239..ef624574ac8 100644 --- a/share/qtcreator/qmldesigner/statesEditorQmlSources/StatesDelegate.qml +++ b/share/qtcreator/qmldesigner/statesEditorQmlSources/StatesDelegate.qml @@ -23,13 +23,15 @@ ** ****************************************************************************/ -import QtQuick 2.2 -import QtQuick.Controls 1.1 -import QtQuick.Controls.Styles 1.1 -import HelperWidgets 2.0 +import QtQuick 2.15 import QtQuickDesignerTheme 1.0 +import HelperWidgets 2.0 +import StudioControls 1.0 as StudioControls +import StudioTheme 1.0 as StudioTheme Rectangle { + id: myRoot + border.width: 1 property bool isBaseState property bool isCurrentState @@ -41,6 +43,8 @@ Rectangle { property string delegateWhenConditionString readonly property bool isDefaultState: isDefault + signal delegateInteraction + color: baseColor border.color: Theme.qmlDesignerBorderColor() @@ -50,38 +54,28 @@ Rectangle { } MouseArea { + id: mouseArea anchors.fill: parent acceptedButtons: Qt.LeftButton onClicked: { focus = true root.currentStateInternalId = internalNodeId + contextMenu.dismiss() // close potentially open context menu + myRoot.delegateInteraction() } } - ToolButton { + StudioControls.AbstractButton { id: removeStateButton - - style: ButtonStyle { - background: Rectangle { - color: control.hovered ? Qt.lighter(baseColor, 1.2) : "transparent" - Image { - source: "image://icons/close" - height: 16 - width: 16 - } - } - } - - + buttonIcon: StudioTheme.Constants.closeCross anchors.right: parent.right - anchors.rightMargin: 2 + anchors.rightMargin: 4 anchors.verticalCenter: stateNameField.verticalCenter - height: 16 - width: 16 visible: !isBaseState onClicked: { + myRoot.delegateInteraction() if (isDefaultState) statesEditorModel.resetDefaultState() @@ -89,86 +83,77 @@ Rectangle { } } - Image { - id: whenButton - visible: !isBaseState || (isBaseState && modelHasDefaultState) - width: 14 - height: 14 - x: 4 - y: 6 - source: { - if (whenMouseArea.containsMouse) - return "image://icons/submenu" - - return delegateHasWhenCondition ? "image://icons/expression" : "image://icons/placeholder" + StudioControls.Menu { + id: contextMenu + StudioControls.MenuItem { + enabled: !isBaseState + text: qsTr("Set when Condition") + onTriggered: { + bindingEditor.showWidget() + bindingEditor.text = delegateWhenConditionString + bindingEditor.prepareBindings() + } } - MouseArea { - id: whenMouseArea - hoverEnabled: true - anchors.fill: parent - onClicked: contextMenu.popup() - } - Menu { - id: contextMenu - - MenuItem { - visible: !isBaseState - text: qsTr("Set when Condition") - onTriggered: { - bindingEditor.showWidget() - bindingEditor.text = delegateWhenConditionString - bindingEditor.prepareBindings() - } + StudioControls.MenuItem { + enabled: !isBaseState && delegateHasWhenCondition + text: qsTr("Reset when Condition") + onTriggered: { + statesEditorModel.resetWhenCondition(internalNodeId) } + } - MenuItem { - visible: !isBaseState && delegateHasWhenCondition - text: qsTr("Reset when Condition") - onTriggered: { - statesEditorModel.resetWhenCondition(internalNodeId) - } + StudioControls.MenuItem { + enabled: !isBaseState && !isDefaultState + text: qsTr("Set as Default") + onTriggered: { + statesEditorModel.setStateAsDefault(internalNodeId) } + } - MenuItem { - visible: !isBaseState && !isDefaultState - text: qsTr("Set as Default") - onTriggered: { - statesEditorModel.setStateAsDefault(internalNodeId) - } + StudioControls.MenuItem { + enabled: (!isBaseState && isDefaultState) || (isBaseState && modelHasDefaultState) + text: qsTr("Reset Default") + onTriggered: { + statesEditorModel.resetDefaultState() } + } - MenuItem { - visible: (!isBaseState && isDefaultState) || (isBaseState && modelHasDefaultState) - text: qsTr("Reset Default") - onTriggered: { - statesEditorModel.resetDefaultState() - } - } + onClosed: { + stateNameField.actionIndicator.forceVisible = false + } + + onOpened: { + myRoot.delegateInteraction() } } - TextField { + + StudioControls.TextField { id: stateNameField + + actionIndicator.onClicked: { + stateNameField.actionIndicator.forceVisible = true + contextMenu.popup() + } + + onEditChanged: { + if (contextMenu.open && stateNameField.edit) + contextMenu.dismiss() + } + + actionIndicator.icon.text: delegateHasWhenCondition + ? StudioTheme.Constants.actionIconBinding : StudioTheme.Constants.actionIcon + + translationIndicatorVisible: false y: 4 - font.pixelSize: Theme.smallFontPixelSize() - anchors.left: whenButton.right + anchors.left: parent.left // use the spacing which the image to the delegate rectangle has anchors.leftMargin: 4 anchors.right: removeStateButton.left - anchors.rightMargin: 4 - style: DesignerTextFieldStyle { - background: Rectangle { - implicitWidth: 100 - implicitHeight: font.pixelSize + padding.top + padding.bottom - color: ((isBaseState && modelHasDefaultState) ? "transparent" - : Theme.color(Theme.FancyToolButtonSelectedColor)) - border.color: ((isBaseState && !modelHasDefaultState) || isDefaultState) ? "#ffd700" - : (isBaseState && modelHasDefaultState) ? "transparent" - : Theme.qmlDesignerBackgroundColorDarker() - } - } + anchors.rightMargin: 2 + readOnly: isBaseState onActiveFocusChanged: { @@ -188,7 +173,7 @@ Rectangle { stateNameField.oldValue = stateNameField.text - if (stateNameField.text != delegateStateName) + if (stateNameField.text !== delegateStateName) statesEditorModel.renameState(internalNodeId, stateNameField.text) } } @@ -220,8 +205,8 @@ Rectangle { Text { id: stateDefaultIndicator - anchors.left: whenButton.left - anchors.leftMargin: 0 + anchors.left: parent.left + anchors.leftMargin: StudioTheme.Values.height anchors.right: removeStateButton.left anchors.rightMargin: 4 anchors.bottom: parent.bottom diff --git a/share/qtcreator/qmldesigner/statesEditorQmlSources/StatesList.qml b/share/qtcreator/qmldesigner/statesEditorQmlSources/StatesList.qml index c512b7098a8..8eb80fbfc66 100644 --- a/share/qtcreator/qmldesigner/statesEditorQmlSources/StatesList.qml +++ b/share/qtcreator/qmldesigner/statesEditorQmlSources/StatesList.qml @@ -23,32 +23,33 @@ ** ****************************************************************************/ -import QtQuick 2.2 -import QtQuick.Controls 1.1 -import QtQuick.Controls.Styles 1.1 -import "../common" +import QtQuick 2.15 +import QtQuick.Controls 2.15 import QtQuickDesignerTheme 1.0 +import HelperWidgets 2.0 +import StudioControls 1.0 as StudioControls +import StudioTheme 1.0 as StudioTheme FocusScope { id: root - height: expanded ? 192 : 40 + height: (root.expanded ? 192 : 40) + StudioTheme.Values.scrollBarThickness signal createNewState signal deleteState(int internalNodeId) signal duplicateCurrentState property int stateImageSize: 180 - property int delegateWidth: stateImageSize + 44 property int padding: 2 - property int delegateHeight: root.height - padding * 2 + 1 + property int delegateWidth: root.stateImageSize + 44 + property int delegateHeight: root.height - StudioTheme.Values.scrollBarThickness - root.padding * 2 + 1 property int innerSpacing: 0 - property int currentStateInternalId : 0 + property int currentStateInternalId: 0 property bool expanded: true Connections { target: statesEditorModel - onChangedToState: root.currentStateInternalId = n + function onChangedToState(n) { root.currentStateInternalId = n } } SystemPalette { @@ -66,35 +67,41 @@ FocusScope { acceptedButtons: Qt.LeftButton | Qt.RightButton onClicked: { - if (mouse.button === Qt.LeftButton) + if (mouse.button === Qt.LeftButton) { + contextMenu.dismiss() focus = true - else if (mouse.button === Qt.RightButton) + } else if (mouse.button === Qt.RightButton) { contextMenu.popup() + } } - Menu { + StudioControls.Menu { id: contextMenu - MenuItem { + StudioControls.MenuItem { text: root.expanded ? qsTr("Collapse") : qsTr("Expand") onTriggered: { root.expanded = !root.expanded } - } } } + function closeContextMenu() { + if (contextMenu.open) + contextMenu.dismiss() + } + Item { id: addStateItem - property int buttonLeftSpacing: 8 * (expanded ? 1 : 2) + property int buttonLeftSpacing: 8 * (root.expanded ? 1 : 2) anchors.right: parent.right - width: delegateHeight / 2 + buttonLeftSpacing - height: delegateHeight + width: root.delegateHeight / 2 + buttonLeftSpacing + height: root.delegateHeight - Button { + AbstractButton { id: addStateButton visible: canAddNewStates @@ -106,56 +113,69 @@ FocusScope { width: Math.max(parent.height / 2 - 8, 18) height: width - onClicked: root.createNewState() - - style: ButtonStyle { - background: Rectangle { - property color buttonBaseColor: Qt.darker(Theme.qmlDesignerBackgroundColorDarkAlternate(), 1.1) - color: control.hovered ? Qt.lighter(buttonBaseColor, 1.2) : buttonBaseColor - border.color: Theme.qmlDesignerBorderColor() - border.width: 1 - Image { - source: "image://icons/plus" - width: 16 - height: 16 - anchors.centerIn: parent - smooth: false - } + onClicked: { + root.closeContextMenu() + root.createNewState() + } + + background: Rectangle { + property color buttonBaseColor: Qt.darker(Theme.qmlDesignerBackgroundColorDarkAlternate(), 1.1) + color: addStateButton.hovered ? Qt.lighter(buttonBaseColor, 1.2) : buttonBaseColor + border.color: Theme.qmlDesignerBorderColor() + border.width: 1 + Image { + source: "image://icons/plus" + width: 16 + height: 16 + anchors.centerIn: parent + smooth: false } } } } - ScrollView { + ListView { + id: flickable + + boundsBehavior: Flickable.StopAtBounds + clip: true + anchors.left: parent.left anchors.right: addStateItem.left - height: delegateHeight - y: padding - anchors.leftMargin: padding - anchors.rightMargin: padding + height: root.delegateHeight + StudioTheme.Values.scrollBarThickness + y: root.padding + anchors.leftMargin: root.padding + anchors.rightMargin: root.padding + + model: statesEditorModel + orientation: ListView.Horizontal + spacing: root.innerSpacing + + delegate: StatesDelegate { + id: statesDelegate + width: root.delegateWidth + height: root.delegateHeight + isBaseState: 0 == internalNodeId + isCurrentState: root.currentStateInternalId == internalNodeId + baseColor: isCurrentState ? Theme.color(Theme.QmlDesigner_HighlightColor) : background.color + delegateStateName: stateName + delegateStateImageSource: stateImageSource + delegateStateImageSize: stateImageSize + delegateHasWhenCondition: hasWhenCondition + delegateWhenConditionString: whenConditionString + onDelegateInteraction: root.closeContextMenu() + } - style: DesignerScrollViewStyle { + property bool bothVisible: horizontal.scrollBarVisible && vertical.scrollBarVisible + + ScrollBar.horizontal: HorizontalScrollBar { + id: horizontal + parent: flickable } - ListView { - anchors.fill: parent - model: statesEditorModel - orientation: ListView.Horizontal - spacing: innerSpacing - - delegate: StatesDelegate { - id: statesDelegate - width: delegateWidth - height: delegateHeight - isBaseState: 0 == internalNodeId - isCurrentState: root.currentStateInternalId == internalNodeId - baseColor: isCurrentState ? Theme.color(Theme.QmlDesigner_HighlightColor) : background.color - delegateStateName: stateName - delegateStateImageSource: stateImageSource - delegateStateImageSize: stateImageSize - delegateHasWhenCondition: hasWhenCondition - delegateWhenConditionString: whenConditionString - } + ScrollBar.vertical: VerticalScrollBar { + id: vertical + parent: flickable } } } |