diff options
3 files changed, 73 insertions, 22 deletions
diff --git a/share/qtcreator/qmldesigner/collectionEditorQmlSource/CollectionView.qml b/share/qtcreator/qmldesigner/collectionEditorQmlSource/CollectionView.qml index 6b808d1ab2..c4cf2f7f5e 100644 --- a/share/qtcreator/qmldesigner/collectionEditorQmlSource/CollectionView.qml +++ b/share/qtcreator/qmldesigner/collectionEditorQmlSource/CollectionView.qml @@ -45,29 +45,76 @@ Item { message: "" } - GridLayout { - id: grid - readonly property bool isHorizontal: width >= 500 + Rectangle { + // Covers the toolbar color on top to prevent the background + // color for the margin of splitter + + anchors.top: parent.top + anchors.left: parent.left + anchors.right: parent.right + height: topToolbar.height + color: topToolbar.color + } + + SplitView { + id: splitView - columnSpacing: 0 - rowSpacing: 0 + readonly property bool isHorizontal: splitView.orientation === Qt.Horizontal + orientation: width >= 500 ? Qt.Horizontal : Qt.Vertical anchors.fill: parent - columns: isHorizontal ? 3 : 1 + + handle: Item { + id: handleDelegate + + property color color: SplitHandle.pressed ? StudioTheme.Values.themeControlOutlineInteraction + : SplitHandle.hovered ? StudioTheme.Values.themeControlOutlineHover + : StudioTheme.Values.themeControlOutline + + implicitWidth: 1 + implicitHeight: 1 + + Rectangle { + id: handleRect + + property real verticalMargin: splitView.isHorizontal ? StudioTheme.Values.splitterMargin : 0 + property real horizontalMargin: splitView.isHorizontal ? 0 : StudioTheme.Values.splitterMargin + + anchors.fill: parent + anchors.topMargin: handleRect.verticalMargin + anchors.bottomMargin: handleRect.verticalMargin + anchors.leftMargin: handleRect.horizontalMargin + anchors.rightMargin: handleRect.horizontalMargin + + color: handleDelegate.color + } + + containmentMask: Item { + x: splitView.isHorizontal ? ((handleDelegate.width - width) / 2) : 0 + y: splitView.isHorizontal ? 0 : ((handleDelegate.height - height) / 2) + height: splitView.isHorizontal ? handleDelegate.height : StudioTheme.Values.borderHover + width: splitView.isHorizontal ? StudioTheme.Values.borderHover : handleDelegate.width + } + } ColumnLayout { id: collectionsSideBar spacing: 0 - Layout.alignment: Qt.AlignTop | Qt.AlignLeft - Layout.minimumWidth: 300 - Layout.fillWidth: !grid.isHorizontal + SplitView.minimumWidth: 200 + SplitView.maximumWidth: 450 + SplitView.minimumHeight: 200 + SplitView.maximumHeight: 400 + SplitView.fillWidth: !splitView.isHorizontal + SplitView.fillHeight: splitView.isHorizontal Rectangle { + id: topToolbar color: StudioTheme.Values.themeToolbarBackground Layout.preferredHeight: StudioTheme.Values.toolbarHeight Layout.fillWidth: true + Layout.alignment: Qt.AlignTop | Qt.AlignHCenter Text { anchors.verticalCenter: parent.verticalCenter @@ -92,11 +139,13 @@ Item { } } - Rectangle { // Model Groups + Item { // Model Groups Layout.fillWidth: true - color: StudioTheme.Values.themeBackgroundColorNormal - Layout.minimumHeight: 150 + Layout.minimumHeight: bottomSpacer.isExpanded ? 150 : 0 + Layout.fillHeight: !bottomSpacer.isExpanded Layout.preferredHeight: sourceListView.contentHeight + Layout.maximumHeight: sourceListView.contentHeight + Layout.alignment: Qt.AlignTop | Qt.AlignHCenter MouseArea { anchors.fill: parent @@ -132,22 +181,22 @@ Item { icon: StudioTheme.Constants.create_medium onClicked: newCollection.open() } - } - Rectangle { // Splitter - Layout.fillWidth: !grid.isHorizontal - Layout.fillHeight: grid.isHorizontal - Layout.minimumWidth: 2 - Layout.minimumHeight: 2 - color: "black" + Item { + id: bottomSpacer + + readonly property bool isExpanded: height > 0 + Layout.minimumWidth: 1 + Layout.fillHeight: true + } } CollectionDetailsView { model: root.collectionDetailsModel backend: root.model sortedModel: root.collectionDetailsSortFilterModel - Layout.fillHeight: true - Layout.fillWidth: true + SplitView.fillHeight: true + SplitView.fillWidth: true } } } diff --git a/share/qtcreator/qmldesigner/collectionEditorQmlSource/ModelSourceItem.qml b/share/qtcreator/qmldesigner/collectionEditorQmlSource/ModelSourceItem.qml index 2678a36755..8872bb0d04 100644 --- a/share/qtcreator/qmldesigner/collectionEditorQmlSource/ModelSourceItem.qml +++ b/share/qtcreator/qmldesigner/collectionEditorQmlSource/ModelSourceItem.qml @@ -21,7 +21,7 @@ Item { width: parent.width implicitHeight: contentHeight - leftMargin: 6 + leftMargin: 0 model: internalModels clip: true diff --git a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioTheme/Values.qml b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioTheme/Values.qml index fadebdd720..59030cd126 100644 --- a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioTheme/Values.qml +++ b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/StudioTheme/Values.qml @@ -125,6 +125,7 @@ QtObject { property real controlLabelGap: 5 property real controlGap: 5 // TODO different name + property real splitterMargin: 5 property real twoControlColumnGap: values.controlLabelGap + values.controlLabelWidth + values.controlGap @@ -350,6 +351,7 @@ QtObject { property color themeControlOutline: Theme.color(Theme.DScontrolOutline) property color themeControlOutlineInteraction: Theme.color(Theme.DScontrolOutlineInteraction) property color themeControlOutlineDisabled: Theme.color(Theme.DScontrolOutlineDisabled) + property color themeControlOutlineHover: Theme.color(Theme.DScontrolOutline_topToolbarHover) // Panels & Panes property color themeBackgroundColorNormal: Theme.color(Theme.DSBackgroundColorNormal) |