diff options
author | Mahmoud Badri <mahmoud.badri@qt.io> | 2021-12-10 11:47:04 +0200 |
---|---|---|
committer | Mahmoud Badri <mahmoud.badri@qt.io> | 2021-12-10 10:59:26 +0000 |
commit | ba007950493cd2643cd22272f59a2b182bb04aa5 (patch) | |
tree | 41f56ff043e561676247e5535900f2d33526c023 | |
parent | 136026a81b948875dbe66b34db1339b6b35d1965 (diff) |
QmlDesigner: Make the states view responsive
When resizing the states view vertically, states now will update their
height to fit the available space.
Fixes: QDS-5753
Change-Id: I3aa352610122b49049979c84aba12d99a0da0ea5
Reviewed-by: Miikka Heikkinen <miikka.heikkinen@qt.io>
-rw-r--r-- | share/qtcreator/qmldesigner/statesEditorQmlSources/StatesDelegate.qml | 12 | ||||
-rw-r--r-- | share/qtcreator/qmldesigner/statesEditorQmlSources/StatesList.qml | 15 |
2 files changed, 8 insertions, 19 deletions
diff --git a/share/qtcreator/qmldesigner/statesEditorQmlSources/StatesDelegate.qml b/share/qtcreator/qmldesigner/statesEditorQmlSources/StatesDelegate.qml index 1e592865cf..faae1210b5 100644 --- a/share/qtcreator/qmldesigner/statesEditorQmlSources/StatesDelegate.qml +++ b/share/qtcreator/qmldesigner/statesEditorQmlSources/StatesDelegate.qml @@ -40,7 +40,6 @@ Rectangle { property color baseColor property string delegateStateName property string delegateStateImageSource - property int delegateStateImageSize property bool delegateHasWhenCondition property string delegateWhenConditionString property bool hasAnnotation: checkAnnotation() @@ -70,7 +69,6 @@ Rectangle { MouseArea { id: mouseArea anchors.fill: parent - acceptedButtons: Qt.LeftButton onClicked: { focus = true root.currentStateInternalId = internalNodeId @@ -168,7 +166,7 @@ Rectangle { } - Rectangle { + Rectangle { // highlight for default state anchors.margins: (isDefaultState || (isBaseState && !modelHasDefaultState)) ? -myRoot.highlightBorderWidth : 0 anchors.fill: column color: StudioTheme.Values.themeStateSeparator @@ -176,7 +174,6 @@ Rectangle { border.width: (isDefaultState || (isBaseState && !modelHasDefaultState)) ? myRoot.highlightBorderWidth : 0 } - Column { id: column @@ -185,7 +182,6 @@ Rectangle { spacing: expanded ? myRoot.columnSpacing : 0 Rectangle { - width: myRoot.width - 2 * myRoot.stateMargin height: myRoot.topAreaHeight @@ -261,13 +257,12 @@ Rectangle { font.pixelSize: StudioTheme.Values.myFontSize font.family: StudioTheme.Constants.font - visible: (isDefaultState || (isBaseState && !modelHasDefaultState)) + visible: isDefaultState || (isBaseState && !modelHasDefaultState) text: qsTr("Default") } } - Rectangle { id: stateImageArea width: myRoot.width - 2 * myRoot.stateMargin @@ -297,8 +292,6 @@ Rectangle { anchors.centerIn: parent anchors.fill: parent source: delegateStateImageSource - sourceSize.width: delegateStateImageSize - sourceSize.height: delegateStateImageSize fillMode: Image.PreserveAspectFit } } @@ -329,5 +322,4 @@ Rectangle { hideWidget() } } - } diff --git a/share/qtcreator/qmldesigner/statesEditorQmlSources/StatesList.qml b/share/qtcreator/qmldesigner/statesEditorQmlSources/StatesList.qml index 5bb834011f..6f2dfbbf3d 100644 --- a/share/qtcreator/qmldesigner/statesEditorQmlSources/StatesList.qml +++ b/share/qtcreator/qmldesigner/statesEditorQmlSources/StatesList.qml @@ -34,20 +34,18 @@ FocusScope { id: root property int delegateTopAreaHeight: StudioTheme.Values.height + 8 - property int delegateBottomAreaHeight: 200 + property int delegateBottomAreaHeight: delegateHeight - 2 * delegateStateMargin - delegateTopAreaHeight - delegateColumnSpacing property int delegateColumnSpacing: 2 property int delegateStateMargin: 16 - property int delegatePreviewMargin: 16 - property int effectiveHeight: root.expanded ? 287 : 85 // height of the states area + property int delegatePreviewMargin: 10 + property int effectiveHeight: root.expanded ? Math.max(85, Math.min(287, root.height)) : 85 // height of the states area signal createNewState signal deleteState(int internalNodeId) signal duplicateCurrentState - property int stateImageSize: 200 property int padding: 2 - property int delegateWidth: root.stateImageSize - + 2 * (root.delegateStateMargin + root.delegatePreviewMargin) + property int delegateWidth: 264 property int delegateHeight: effectiveHeight - StudioTheme.Values.scrollBarThickness - 2 * (root.padding + StudioTheme.Values.border) @@ -102,8 +100,8 @@ FocusScope { anchors.right: parent.right anchors.rightMargin: 8 y: (Math.min(effectiveHeight, root.height) - height) / 2 - width: Math.max(root.delegateHeight / 2 - 8, 18) - height: root.expanded ? 60 : width + width: root.expanded ? 140 : 18 + height: root.expanded ? 60 : 18 onClicked: { contextMenu.dismiss() @@ -144,7 +142,6 @@ FocusScope { baseColor: isCurrentState ? StudioTheme.Values.themeInteraction : background.color delegateStateName: stateName delegateStateImageSource: stateImageSource - delegateStateImageSize: stateImageSize delegateHasWhenCondition: hasWhenCondition delegateWhenConditionString: whenConditionString onDelegateInteraction: contextMenu.dismiss() |