feedc0de/qt-creator
1
0
Fork 0
forked from qt-creator/qt-creator
Code Pull Requests Activity

QmlDesigner: Consider responsive size for the CollectionView

Browse Source 
Task-number: QDS-11037
Change-Id: Ida49ccf67e6aeb943087b2f51a168f98053c838e
Reviewed-by: Qt CI Patch Build Bot <ci_patchbuild_bot@qt.io>
Reviewed-by: Mahmoud Badri <mahmoud.badri@qt.io>
This commit is contained in:
Ali Kianian
2023-10-24 15:24:09 +03:00
parent dca7f6121c
commit eae92fd247
6 changed files with 113 additions and 96 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
share/qtcreator/qmldesigner/collectionEditorQmlSource/CollectionDetailsView.qml
View File

@@ -15,7 +15,7 @@ Rectangle {
required property var backend
required property var sortedModel
implicitWidth: 600
implicitWidth: 300
implicitHeight: 400
color: StudioTheme.Values.themeBackgroundColorAlternate

44
share/qtcreator/qmldesigner/collectionEditorQmlSource/CollectionItem.qml
View File

@@ -3,7 +3,7 @@
import QtQuick
import QtQuick.Controls
import Qt.labs.platform as PlatformWidgets
import QtQuick.Layouts
import HelperWidgets 2.0 as HelperWidgets
import StudioControls 1.0 as StudioControls
import StudioTheme as StudioTheme
@@ -12,7 +12,7 @@ Item {
id: root
implicitWidth: 300
implicitHeight: innerRect.height + 6
implicitHeight: innerRect.height + 3
property color textColor
@@ -23,7 +23,7 @@ Item {
id: boundingRect
anchors.centerIn: root
width: root.width - 24
width: parent.width
height: nameHolder.height
clip: true
@@ -47,21 +47,23 @@ Item {
anchors.fill: parent
}
Row {
width: parent.width - threeDots.width
leftPadding: 20
RowLayout {
width: parent.width
Text {
id: moveTool
property StudioTheme.ControlStyle style: StudioTheme.Values.viewBarButtonStyle
width: moveTool.style.squareControlSize.width
height: nameHolder.height
Layout.preferredWidth: moveTool.style.squareControlSize.width
Layout.preferredHeight: nameHolder.height
Layout.leftMargin: 12
Layout.alignment: Qt.AlignLeft | Qt.AlignVCenter
text: StudioTheme.Constants.dragmarks
font.family: StudioTheme.Constants.iconFont.family
font.pixelSize: moveTool.style.baseIconFontSize
color: root.textColor
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
}
@@ -69,9 +71,12 @@ Item {
Text {
id: nameHolder
Layout.fillWidth: true
Layout.alignment: Qt.AlignLeft | Qt.AlignVCenter
text: collectionName
font.pixelSize: StudioTheme.Values.baseFontSize
color: textColor
color: root.textColor
leftPadding: 5
topPadding: 8
rightPadding: 8
@@ -79,43 +84,42 @@ Item {
elide: Text.ElideMiddle
verticalAlignment: Text.AlignVCenter
}
}
Text {
id: threeDots
Layout.alignment: Qt.AlignRight | Qt.AlignVCenter
text: StudioTheme.Constants.more_medium
font.family: StudioTheme.Constants.iconFont.family
font.pixelSize: StudioTheme.Values.baseIconFontSize
color: textColor
anchors.right: boundingRect.right
anchors.verticalCenter: parent.verticalCenter
color: root.textColor
rightPadding: 12
topPadding: nameHolder.topPadding
bottomPadding: nameHolder.bottomPadding
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
MouseArea {
anchors.fill: parent
acceptedButtons: Qt.RightButton + Qt.LeftButton
onClicked: (event) => {
collectionMenu.open()
event.accepted = true
acceptedButtons: Qt.RightButton | Qt.LeftButton
onClicked: collectionMenu.popup()
}
}
}
}
PlatformWidgets.Menu {
StudioControls.Menu {
id: collectionMenu
PlatformWidgets.MenuItem {
closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutside
StudioControls.MenuItem {
text: qsTr("Delete")
shortcut: StandardKey.Delete
onTriggered: deleteDialog.open()
}
PlatformWidgets.MenuItem {
StudioControls.MenuItem {
text: qsTr("Rename")
shortcut: StandardKey.Replace
onTriggered: renameDialog.open()

45
share/qtcreator/qmldesigner/collectionEditorQmlSource/CollectionView.qml
View File

@@ -3,6 +3,7 @@
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import QtQuickDesignerTheme 1.0
import HelperWidgets 2.0 as HelperWidgets
import StudioTheme 1.0 as StudioTheme
@@ -52,19 +53,23 @@ Item {
message: ""
}
Rectangle {
id: collectionsRect
GridLayout {
id: grid
readonly property bool isHorizontal: width >= 500
color: StudioTheme.Values.themeToolbarBackground
width: 300
height: root.height
anchors.fill: parent
columns: isHorizontal ? 2 : 1
Column {
width: parent.width
ColumnLayout {
id: collectionsSideBar
Layout.alignment: Qt.AlignTop | Qt.AlignLeft
Layout.minimumWidth: 300
Layout.fillWidth: !grid.isHorizontal
Rectangle {
width: parent.width
height: StudioTheme.Values.height + 5
Layout.fillWidth: true
Layout.preferredHeight: StudioTheme.Values.height + 5
color: StudioTheme.Values.themeToolbarBackground
Text {
@@ -100,9 +105,10 @@ Item {
}
Rectangle { // Collections
width: parent.width
Layout.fillWidth: true
color: StudioTheme.Values.themeBackgroundColorNormal
height: 330
Layout.minimumHeight: 150
Layout.preferredHeight: sourceListView.contentHeight
MouseArea {
anchors.fill: parent
@@ -116,20 +122,19 @@ Item {
ListView {
id: sourceListView
width: parent.width
height: contentHeight
anchors.fill: parent
model: root.model
delegate: ModelSourceItem {
implicitWidth: sourceListView.width
onDeleteItem: root.model.removeRow(index)
}
}
}
Rectangle {
width: parent.width
height: addCollectionButton.height
Layout.fillWidth: true
Layout.preferredHeight: addCollectionButton.height
color: StudioTheme.Values.themeBackgroundColorNormal
IconTextButton {
@@ -142,17 +147,13 @@ Item {
}
}
}
}
CollectionDetailsView {
model: root.collectionDetailsModel
backend: root.model
sortedModel: root.collectionDetailsSortFilterModel
anchors {
left: collectionsRect.right
right: parent.right
top: parent.top
bottom: parent.bottom
Layout.fillHeight: true
Layout.fillWidth: true
}
}
}

57
share/qtcreator/qmldesigner/collectionEditorQmlSource/ModelSourceItem.qml
View File

@@ -3,6 +3,7 @@
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import HelperWidgets 2.0 as HelperWidgets
import StudioControls 1.0 as StudioControls
import StudioTheme as StudioTheme
@@ -11,7 +12,7 @@ Item {
id: root
implicitWidth: 300
implicitHeight: wholeColumn.height + 6
implicitHeight: wholeColumn.height
property color textColor
property var collectionModel
@@ -26,15 +27,17 @@ Item {
root.expanded = !root.expanded || sourceIsSelected;
}
Column {
ColumnLayout {
id: wholeColumn
width: parent.width
spacing: 0
Item {
id: boundingRect
anchors.centerIn: root
width: root.width - 24
height: nameHolder.height
Layout.fillWidth: true
Layout.preferredHeight: nameHolder.height
Layout.leftMargin: 6
clip: true
MouseArea {
@@ -62,17 +65,17 @@ Item {
anchors.fill: parent
}
Row {
width: parent.width - threeDots.width
leftPadding: 20
RowLayout {
width: parent.width
Text {
id: expandButton
property StudioTheme.ControlStyle style: StudioTheme.Values.viewBarButtonStyle
width: expandButton.style.squareControlSize.width
height: nameHolder.height
Layout.preferredWidth: expandButton.style.squareControlSize.width
Layout.preferredHeight: nameHolder.height
Layout.alignment: Qt.AlignLeft | Qt.AlignVCenter
text: StudioTheme.Constants.startNode
font.family: StudioTheme.Constants.iconFont.family
@@ -90,17 +93,17 @@ Item {
MouseArea {
anchors.fill: parent
acceptedButtons: Qt.RightButton + Qt.LeftButton
onClicked: (event) => {
root.toggleExpanded()
event.accepted = true
}
acceptedButtons: Qt.RightButton | Qt.LeftButton
onClicked: root.toggleExpanded()
}
}
Text {
id: nameHolder
Layout.fillWidth: true
Layout.alignment: Qt.AlignLeft | Qt.AlignVCenter
text: sourceName
font.pixelSize: StudioTheme.Values.baseFontSize
color: textColor
@@ -109,30 +112,29 @@ Item {
rightPadding: 8
bottomPadding: 8
elide: Text.ElideMiddle
horizontalAlignment: Text.AlignLeft
verticalAlignment: Text.AlignVCenter
}
}
Text {
id: threeDots
Layout.alignment: Qt.AlignRight | Qt.AlignVCenter
text: StudioTheme.Constants.more_medium
font.family: StudioTheme.Constants.iconFont.family
font.pixelSize: StudioTheme.Values.baseIconFontSize
color: textColor
anchors.right: boundingRect.right
anchors.verticalCenter: parent.verticalCenter
rightPadding: 12
topPadding: nameHolder.topPadding
bottomPadding: nameHolder.bottomPadding
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
MouseArea {
anchors.fill: parent
acceptedButtons: Qt.RightButton + Qt.LeftButton
onClicked: (event) => {
collectionMenu.popup()
event.accepted = true
acceptedButtons: Qt.RightButton | Qt.LeftButton
onClicked: collectionMenu.popup()
}
}
}
@@ -141,17 +143,18 @@ Item {
ListView {
id: collectionListView
width: parent.width
height: root.expanded ? contentHeight : 0
Layout.fillWidth: true
Layout.preferredHeight: root.expanded ? contentHeight : 0
Layout.leftMargin: 6
model: collections
clip: true
Behavior on height {
Behavior on Layout.preferredHeight {
NumberAnimation {duration: 500}
}
delegate: CollectionItem {
width: parent.width
width: collectionListView.width
onDeleteItem: root.model.removeRow(index)
}
}
@@ -160,6 +163,8 @@ Item {
StudioControls.Menu {
id: collectionMenu
closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutside
StudioControls.MenuItem {
text: qsTr("Delete")
shortcut: StandardKey.Delete

5
src/plugins/qmldesigner/components/collectioneditor/collectionwidget.cpp
View File

@@ -129,6 +129,11 @@ void CollectionWidget::reloadQmlSource()
m_quickWidget->setSource(QUrl::fromLocalFile(collectionViewQmlPath));
}
QSize CollectionWidget::minimumSizeHint() const
{
return {300, 400};
}
bool CollectionWidget::loadJsonFile(const QString &jsonFileAddress)
{
if (!isJsonFile(jsonFileAddress))

2
src/plugins/qmldesigner/components/collectioneditor/collectionwidget.h
View File

@@ -30,6 +30,8 @@ public:
void reloadQmlSource();
virtual QSize minimumSizeHint() const;
Q_INVOKABLE bool loadJsonFile(const QString &jsonFileAddress);
Q_INVOKABLE bool loadCsvFile(const QString &collectionName, const QString &csvFileAddress);
Q_INVOKABLE bool isJsonFile(const QString &jsonFileAddress) const;