Howto set property for delegate
-
I'm a Qt (C++) vet, but new to QML. I'm displaying a simple model in a TableView. Some of my columns use custom delegates, and I'd like to set some properties on them:
Delegate:
Component { id: buttonDelegate Item { anchors.fill: parent Button { id: actionButton anchors.centerIn: parent width: parent.width * 0.9 height: parent.height - 2 } } }
Use of delegate:
TableViewColumn { id: startButtonColumn title: "someTitle" movable: false resizable: false width: tableView.width * 0.15 delegate: buttonDelegate // I would like to set the text to the delegate }
As per the comment, I'd like to set the text for the button within the delegate from the TableViewColumn, because I use the same delegate for multiple columns (and the button needs different texts).
Preferably, I'd like to set the text as a top-level property of the delegate, something like:buttonDelegate { buttonText: "SomeText" }
I have found a couple of posts on similar topics (e.g. on stackoverflow), but frankly, without the necessary background, I don't understand them, and they don't simply work for me through copy-paste.
-
hi, @Asperamanca
I haven't jet touch a TableView myself, but I try to explain the principles, as I understand them, on a very simply
ListView
lets asume an array/List of strings as your model:
ListView{ model: ["Item1", "Item2", "Item3"] }
and a custom delegate that as a
text
-property you want to set to the correlating item: You can access the current model-item viamodelData
ListView{ model: ["Item1", "Item2", "Item3"] delegate: FancyViewItem{ text:modelData } }
A bit more complex example:
Lets asume you create a QList<QObjects> in a cpp BackEnd and you want to create a Listview based on that List. Also let's asume QObject is a QObject derived class with theQ_PROPERTY
sfilePath
,fileName
andcreatedAt
ListView{ model: cppBackEnd.fileModel//fileModel == Q_PROPERTY(QVariant fileModel READ .... WRITE.... NOTIFY....) delegate: FancyViewItem{ textPath: modelData.filePath textFileName: modelData.fileName timeStamp: modelData.createdAt } }
-
@J.Hilk said in Howto set property for delegate:
FancyViewItem
Thanks for your reply.
Could I re-use FancyViewItem in multiple columns? I want to avoid defining a lengthy delegate multiple times, with 90 % identical definition, and only one or two properties that differ by column. -
@Asperamanca said in Howto set property for delegate:
Could I re-use FancyViewItem in multiple columns? I want to avoid defining a lengthy delegate multiple times, with 90 % identical definition, and only one or two properties that differ by column.
sure, thats what I usually do.
I create an "external" .qml file with the name
FancyViewItem
//FancyViewItem.qml import QtQuick 2.9 Item{ property text: "This is a text property" ..... }
as long as your qml file is in the same directory as the main file you can simply write
FancyViewItem{ }
to create a new "instance" of that item
if its in a different directory, you'll have to import that directory
import "qrc:/qml/FancyViewItemDir"
make sure you use a Capital letter in the beginning of your *.qml file!!!!
-
Thanks again.
Does the filename have to match the item name? Because that runs counter to the naming conventions I follow. Or is there a way I define the the name 'FancyViewItem' somewhere within the file, and still import and use it? -
@Asperamanca said in Howto set property for delegate:
Thanks again.
Does the filename have to match the item name? Because that runs counter to the naming conventions I follow. Or is there a way I define the the name 'FancyViewItem' somewhere within the file, and still import and use it?Ok, here's where my knowledge ends x)
But, as far as I know:
- Filename = Itemname (-.qml)
and
- you would have to copy&past the definition everytime if you do it inside a single file.
-
So I solved the initial problem:
Delegate in separate file lpad_buttondelegate.qml:
Item { anchors.fill: parent Button { id: actionButton anchors.centerIn: parent width: parent.width * 0.9 text: buttonText } }
Use of delegate:
TableViewColumn { id: startButtonColumn title: "SomeTitle" movable: false resizable: false width: tableView.width * 0.15 delegate: Loader { property string buttonText: "Start" source: "lpad_buttondelegate.qml" } }
New problems abound...but not in this thread.
-
@Asperamanca
great, keep on coding! and good luck ;-)Because I noticed increased reminders about this, don't forget to set the topic to solved :)