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

QmlDesigner: Add support for adding an extra button to EditableListView

Browse Source 
Will be used to add a button to open material editor from material rows
in a Quick3DModel properties sheet. But can be utilized for more
future usecases.

Task-number: QDS-9408
Change-Id: I540479cc1a88cdfe287f244efd7cd65c895db467
Reviewed-by: Miikka Heikkinen <miikka.heikkinen@qt.io>
Reviewed-by: Henning Gründl <henning.gruendl@qt.io>
This commit is contained in:
Mahmoud Badri
2023-03-15 20:21:44 +02:00
parent 0e4e82d7aa
commit 315abe7e9c
1 changed files with 39 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

66
share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/EditableListView.qml
View File

@@ -7,11 +7,11 @@ import StudioControls 1.0 as StudioControls
import StudioTheme 1.0 as StudioTheme
Item {
id: editableListView
id: root
ExtendedFunctionLogic {
id: extFuncLogic
backendValue: editableListView.backendValue
backendValue: root.backendValue
}
property var backendValue
@@ -29,6 +29,10 @@ Item {
property bool delegateHover: false
property string extraButtonIcon: "" // setting this will show an extra button
property string extraButtonToolTip: ""
signal extraButtonClicked(int idx)
signal add(string value)
signal remove(int idx)
signal replace(int idx, string value)
@@ -50,10 +54,10 @@ Item {
validator: RegExpValidator { regExp: /(^[a-z_]\w*|^[A-Z]\w*\.{1}([a-z_]\w*\.?)+)/ }
actionIndicatorVisible: false
typeFilter: editableListView.typeFilter
typeFilter: root.typeFilter
initialModelData: modelData
textRole: editableListView.textRole
valueRole: editableListView.valueRole
textRole: root.textRole
valueRole: root.valueRole
implicitWidth: StudioTheme.Values.singleControlColumnWidth
width: implicitWidth
@@ -64,26 +68,34 @@ Item {
var curValue = itemFilterComboBox.availableValue()
if (itemFilterComboBox.empty && curValue !== "") {
myRepeater.dirty = false
editableListView.add(curValue)
root.add(curValue)
}
}
onCompressedActivated: function(index, reason) {
editableListView.activatedReason = reason
root.activatedReason = reason
var curValue = itemFilterComboBox.availableValue()
if (itemFilterComboBox.empty && curValue) {
myRepeater.dirty = false
editableListView.add(curValue)
root.add(curValue)
} else {
editableListView.replace(itemFilterComboBox.myIndex, curValue)
root.replace(itemFilterComboBox.myIndex, curValue)
}
}
onHoverChanged: editableListView.delegateHover = itemFilterComboBox.hover
onHoverChanged: root.delegateHover = itemFilterComboBox.hover
}
Spacer { implicitWidth: StudioTheme.Values.twoControlColumnGap }
Spacer { implicitWidth: extraButton.visible ? 5 : StudioTheme.Values.twoControlColumnGap }
IconIndicator {
id: extraButton
icon: root.extraButtonIcon
tooltip: root.extraButtonToolTip
onClicked: root.extraButtonClicked(index)
visible: root.extraButtonIcon !== ""
}
IconIndicator {
id: closeIndicator
@@ -95,12 +107,12 @@ Item {
myRepeater.dirty = false
myRepeater.model = myRepeater.localModel // trigger on change handler
} else {
editableListView.remove(index)
root.remove(index)
}
if (!lastItem)
myColumn.currentIndex = index - 1
}
onHoveredChanged: editableListView.delegateHover = closeIndicator.hovered
onHoveredChanged: root.delegateHover = closeIndicator.hovered
}
}
}
@@ -108,7 +120,7 @@ Item {
Row {
ActionIndicator {
id: actionIndicator
icon.visible: editableListView.delegateHover
icon.visible: root.delegateHover
icon.color: extFuncLogic.color
icon.text: extFuncLogic.glyph
onClicked: extFuncLogic.show()
@@ -146,7 +158,7 @@ Item {
myColumn.currentIndex = -1
myRepeater.localModel = []
editableListView.model.forEach(function(item) {
root.model.forEach(function(item) {
myRepeater.localModel.push(item)
});
@@ -163,7 +175,7 @@ Item {
else
myColumn.currentIndex = myRepeater.localModel.length - 1
if (editableListView.activatedReason === ComboBox.ActivatedReason.Other
if (root.activatedReason === ComboBox.ActivatedReason.Other
&& myColumn.currentItem !== null)
myColumn.currentItem.forceActiveFocus()
}
@@ -174,36 +186,36 @@ Item {
visible: myRepeater.count === 0
validator: RegExpValidator { regExp: /(^[a-z_]\w*|^[A-Z]\w*\.{1}([a-z_]\w*\.?)+)/ }
actionIndicatorVisible: false
typeFilter: editableListView.typeFilter
textRole: editableListView.textRole
valueRole: editableListView.valueRole
typeFilter: root.typeFilter
textRole: root.textRole
valueRole: root.valueRole
implicitWidth: StudioTheme.Values.singleControlColumnWidth
width: implicitWidth
onFocusChanged: {
var curValue = dummyComboBox.availableValue()
if (curValue !== "")
editableListView.add(curValue)
root.add(curValue)
}
onCompressedActivated: {
editableListView.activatedReason = reason
root.activatedReason = reason
var curValue = dummyComboBox.availableValue()
if (curValue !== "")
editableListView.add(curValue)
root.add(curValue)
else
editableListView.replace(dummyComboBox.myIndex, curValue)
root.replace(dummyComboBox.myIndex, curValue)
}
onHoverChanged: editableListView.delegateHover = dummyComboBox.hover
onHoverChanged: root.delegateHover = dummyComboBox.hover
}
StudioControls.AbstractButton {
id: plusButton
buttonIcon: StudioTheme.Constants.plus
enabled: !myRepeater.dirty && !(editableListView.backendValue.isInModel
&& !editableListView.backendValue.isIdList)
enabled: !myRepeater.dirty && !(root.backendValue.isInModel
&& !root.backendValue.isIdList)
onClicked: {
var idx = myRepeater.localModel.push("") - 1
myRepeater.model = myRepeater.localModel // trigger on change handler
@@ -212,7 +224,7 @@ Item {
myColumn.currentItem.forceActiveFocus()
}
onHoveredChanged: editableListView.delegateHover = plusButton.hovered
onHoveredChanged: root.delegateHover = plusButton.hovered
}
}
}