diff --git a/share/qtcreator/qmldesigner/collectionEditorQmlSource/SingleCollectionView.qml b/share/qtcreator/qmldesigner/collectionEditorQmlSource/SingleCollectionView.qml index 134a5eeefd4..202e050cfc9 100644 --- a/share/qtcreator/qmldesigner/collectionEditorQmlSource/SingleCollectionView.qml +++ b/share/qtcreator/qmldesigner/collectionEditorQmlSource/SingleCollectionView.qml @@ -3,6 +3,7 @@ import QtQuick import QtQuick.Controls +import QtQuick.Layouts import HelperWidgets 2.0 as HelperWidgets import StudioTheme 1.0 as StudioTheme import StudioControls 1.0 as StudioControls @@ -12,19 +13,19 @@ Rectangle { required property var model - property alias leftPadding: topRow.leftPadding - property real rightPadding: topRow.rightPadding - color: StudioTheme.Values.themeBackgroundColorAlternate - Column { + ColumnLayout { id: topRow spacing: 0 - width: parent.width - leftPadding: 20 - rightPadding: 20 - topPadding: 5 + anchors { + fill: parent + topMargin: 10 + leftMargin: 15 + rightMargin: 15 + bottomMargin: 10 + } Text { id: collectionNameText @@ -52,10 +53,8 @@ Rectangle { } CollectionDetailsToolbar { - property real availableWidth: parent.width - parent.leftPadding - parent.rightPadding - model: root.model - width: Math.max(availableWidth, implicitWidth) + Layout.fillWidth: true } Item { // spacer @@ -63,186 +62,236 @@ Rectangle { height: 5 } - HorizontalHeaderView { - id: headerView + GridLayout { + columns: 2 + rowSpacing: 1 + columnSpacing: 1 - property real topPadding: 5 - property real bottomPadding: 5 + Layout.fillWidth: true + Layout.fillHeight: true - height: headerMetrics.height + topPadding + bottomPadding - - syncView: tableView - clip: true - - delegate: Rectangle { - id: headerItem - implicitWidth: 100 - implicitHeight: headerText.height - border.width: 2 - border.color: StudioTheme.Values.themeControlOutline + Rectangle { clip: true + visible: root.model.isEmpty === false + color: StudioTheme.Values.themeControlBackground + border.color: StudioTheme.Values.themeControlOutline + border.width: 2 + + Layout.preferredWidth: rowIdView.width + Layout.preferredHeight: headerView.height Text { - id: headerText - - topPadding: headerView.topPadding - bottomPadding: headerView.bottomPadding - leftPadding: 5 - rightPadding: 5 - text: display - font: headerMetrics.font + anchors.fill: parent + font: headerTextMetrics.font + text: "#" horizontalAlignment: Text.AlignHCenter verticalAlignment: Text.AlignVCenter - anchors.centerIn: parent - elide: Text.ElideRight + color: StudioTheme.Values.themeTextColor } - - MouseArea { - anchors.fill: parent - acceptedButtons: Qt.LeftButton | Qt.RightButton - onClicked: (mouse) => { - root.model.selectColumn(index) - - if (mouse.button === Qt.RightButton) - headerMenu.popIndex(index) - - mouse.accepted = true - } - } - - states: [ - State { - name: "default" - when: index !== root.model.selectedColumn - PropertyChanges { - target: headerItem - color: StudioTheme.Values.themeControlBackground - } - - PropertyChanges { - target: headerText - color: StudioTheme.Values.themeIdleGreen - } - }, - State { - name: "selected" - when: index === root.model.selectedColumn - - PropertyChanges { - target: headerItem - color: StudioTheme.Values.themeControlBackgroundInteraction - } - - PropertyChanges { - target: headerText - color: StudioTheme.Values.themeRunningGreen - } - } - ] } - TextMetrics { - id: headerMetrics + HorizontalHeaderView { + id: headerView - font.pixelSize: StudioTheme.Values.baseFontSize - text: "Xq" + property real topPadding: 5 + property real bottomPadding: 5 + + Layout.preferredHeight: headerTextMetrics.height + topPadding + bottomPadding + Layout.fillWidth: true + syncView: tableView + clip: true + + delegate: Rectangle { + id: headerItem + implicitWidth: 100 + implicitHeight: headerText.height + border.width: 2 + border.color: StudioTheme.Values.themeControlOutline + clip: true + + Text { + id: headerText + + topPadding: headerView.topPadding + bottomPadding: headerView.bottomPadding + leftPadding: 5 + rightPadding: 5 + text: display + font: headerTextMetrics.font + horizontalAlignment: Text.AlignHCenter + verticalAlignment: Text.AlignVCenter + anchors.centerIn: parent + elide: Text.ElideRight + } + + MouseArea { + anchors.fill: parent + acceptedButtons: Qt.LeftButton | Qt.RightButton + onClicked: (mouse) => { + root.model.selectColumn(index) + + if (mouse.button === Qt.RightButton) + headerMenu.popIndex(index) + + mouse.accepted = true + } + } + + states: [ + State { + name: "default" + when: index !== root.model.selectedColumn + PropertyChanges { + target: headerItem + color: StudioTheme.Values.themeControlBackground + } + + PropertyChanges { + target: headerText + color: StudioTheme.Values.themeIdleGreen + } + }, + State { + name: "selected" + when: index === root.model.selectedColumn + + PropertyChanges { + target: headerItem + color: StudioTheme.Values.themeControlBackgroundInteraction + } + + PropertyChanges { + target: headerText + color: StudioTheme.Values.themeRunningGreen + } + } + ] + } + + StudioControls.Menu { + id: headerMenu + + property int clickedHeader: -1 + + function popIndex(clickedIndex) + { + headerMenu.clickedHeader = clickedIndex + headerMenu.popup() + } + + onClosed: { + headerMenu.clickedHeader = -1 + } + + StudioControls.MenuItem { + text: qsTr("Edit") + onTriggered: editProperyDialog.editProperty(headerMenu.clickedHeader) + } + + StudioControls.MenuItem { + text: qsTr("Delete") + onTriggered: deleteColumnDialog.popUp(headerMenu.clickedHeader) + } + } } - StudioControls.Menu { - id: headerMenu + VerticalHeaderView { + id: rowIdView - property int clickedHeader: -1 + syncView: tableView + clip: true - function popIndex(clickedIndex) - { - headerMenu.clickedHeader = clickedIndex - headerMenu.popup() + Layout.fillHeight: true + + delegate: Rectangle { + color: StudioTheme.Values.themeControlBackground + border.color: StudioTheme.Values.themeControlOutline + border.width: 2 + implicitWidth: idText.width + + Text { + id: idText + text: display + leftPadding: 5 + rightPadding: 5 + topPadding: 5 + color: StudioTheme.Values.themeTextColor + font: headerTextMetrics.font + } } + } - onClosed: { - headerMenu.clickedHeader = -1 - } + TableView { + id: tableView - StudioControls.MenuItem { - text: qsTr("Edit") - onTriggered: editProperyDialog.editProperty(headerMenu.clickedHeader) - } + model: root.model + clip: true - StudioControls.MenuItem { - text: qsTr("Delete") - onTriggered: deleteColumnDialog.popUp(headerMenu.clickedHeader) + Layout.fillWidth: true + Layout.fillHeight: true + + delegate: Rectangle { + id: itemCell + implicitWidth: 100 + implicitHeight: itemText.height + border.width: 1 + border.color: StudioTheme.Values.themeControlOutline + + Text { + id: itemText + + text: display ? display : "" + + width: parent.width + leftPadding: 5 + topPadding: 3 + bottomPadding: 3 + font.pixelSize: StudioTheme.Values.baseFontSize + horizontalAlignment: Text.AlignLeft + verticalAlignment: Text.AlignVCenter + elide: Text.ElideRight + } + + states: [ + State { + name: "default" + when: !itemSelected + + PropertyChanges { + target: itemCell + color: StudioTheme.Values.themeControlBackground + } + + PropertyChanges { + target: itemText + color: StudioTheme.Values.themeTextColor + } + }, + State { + name: "selected" + when: itemSelected + + PropertyChanges { + target: itemCell + color: StudioTheme.Values.themeControlBackgroundInteraction + } + + PropertyChanges { + target: itemText + color: StudioTheme.Values.themeInteraction + } + } + ] } } } } - TableView { - id: tableView + TextMetrics { + id: headerTextMetrics - anchors { - top: topRow.bottom - left: parent.left - right: parent.right - bottom: parent.bottom - leftMargin: root.leftPadding - rightMargin: root.rightPadding - } - - model: root.model - - delegate: Rectangle { - id: itemCell - implicitWidth: 100 - implicitHeight: itemText.height - border.width: 1 - border.color: StudioTheme.Values.themeControlOutline - - Text { - id: itemText - - text: display ? display : "" - - width: parent.width - leftPadding: 5 - topPadding: 3 - bottomPadding: 3 - font.pixelSize: StudioTheme.Values.baseFontSize - horizontalAlignment: Text.AlignLeft - verticalAlignment: Text.AlignVCenter - elide: Text.ElideRight - } - - states: [ - State { - name: "default" - when: !itemSelected - - PropertyChanges { - target: itemCell - color: StudioTheme.Values.themeControlBackground - } - - PropertyChanges { - target: itemText - color: StudioTheme.Values.themeTextColor - } - }, - State { - name: "selected" - when: itemSelected - - PropertyChanges { - target: itemCell - color: StudioTheme.Values.themeControlBackgroundInteraction - } - - PropertyChanges { - target: itemText - color: StudioTheme.Values.themeInteraction - } - } - ] - } + font.pixelSize: StudioTheme.Values.baseFontSize + text: "Xq" } EditPropertyDialog { diff --git a/src/plugins/qmldesigner/components/collectioneditor/singlecollectionmodel.cpp b/src/plugins/qmldesigner/components/collectioneditor/singlecollectionmodel.cpp index f7679e8917b..6fa2ac426db 100644 --- a/src/plugins/qmldesigner/components/collectioneditor/singlecollectionmodel.cpp +++ b/src/plugins/qmldesigner/components/collectioneditor/singlecollectionmodel.cpp @@ -36,7 +36,9 @@ namespace QmlDesigner { SingleCollectionModel::SingleCollectionModel(QObject *parent) : QAbstractTableModel(parent) -{} +{ + connect(this, &SingleCollectionModel::modelReset, this, &SingleCollectionModel::updateEmpty); +} QHash SingleCollectionModel::roleNames() const { @@ -117,6 +119,9 @@ QVariant SingleCollectionModel::headerData(int section, if (orientation == Qt::Horizontal) return m_currentCollection.headerAt(section); + if (orientation == Qt::Vertical) + return section + 1; + return {}; } @@ -203,6 +208,15 @@ void SingleCollectionModel::loadCollection(const ModelNode &sourceNode, const QS } } +void SingleCollectionModel::updateEmpty() +{ + bool isEmptyNow = rowCount() == 0; + if (m_isEmpty != isEmptyNow) { + m_isEmpty = isEmptyNow; + emit isEmptyChanged(m_isEmpty); + } +} + void SingleCollectionModel::switchToCollection(const CollectionReference &collection) { if (m_currentCollection.reference() == collection) diff --git a/src/plugins/qmldesigner/components/collectioneditor/singlecollectionmodel.h b/src/plugins/qmldesigner/components/collectioneditor/singlecollectionmodel.h index 9d877502bb4..95154b5c55d 100644 --- a/src/plugins/qmldesigner/components/collectioneditor/singlecollectionmodel.h +++ b/src/plugins/qmldesigner/components/collectioneditor/singlecollectionmodel.h @@ -18,6 +18,7 @@ class SingleCollectionModel : public QAbstractTableModel Q_PROPERTY(QString collectionName MEMBER m_collectionName NOTIFY collectionNameChanged) Q_PROPERTY(int selectedColumn READ selectedColumn WRITE selectColumn NOTIFY selectedColumnChanged) + Q_PROPERTY(bool isEmpty MEMBER m_isEmpty NOTIFY isEmptyChanged) public: enum DataRoles { SelectedRole = Qt::UserRole + 1 }; @@ -51,6 +52,10 @@ public: signals: void collectionNameChanged(const QString &collectionName); void selectedColumnChanged(int); + void isEmptyChanged(bool); + +private slots: + void updateEmpty(); private: void switchToCollection(const CollectionReference &collection); @@ -63,6 +68,7 @@ private: QHash m_openedCollections; CollectionDetails m_currentCollection; + bool m_isEmpty = true; int m_selectedColumn = -1; QString m_collectionName;