[Qt-qml] How to access item in ListView delegate?

7,597 views
Skip to first unread message

Shawn

unread,
Sep 8, 2011, 6:18:24 AM9/8/11
to qt-...@qt.nokia.com
Hi guys,

I want to access item in ListView delegate, like below code snippet,
I want to change image's property, which is in the delegate of testView.
It doesn't work. How can I access it or am I in the wrong way?
Any suggestion could be helpful.
Thank you very much!
ListView {
id: testView
model: easyNameModel
delegate: testViewDelegate
highlight: Rectangle {color: "green"; radius: 5;
width: listview2.width; height: itemHeight
}

Keys.onPressed: {
if(event.key == Qt.Key_Down)
{
//image.scale = 2; // This doesn't work
listview2.incrementCurrentIndex();
}

}

Component{
id:testViewDelegate
Item{
width: 100
height: 30
Image {
id: image
width: 30
height: 30
source: model.contactImage
}
}
}
}


Best Regards,
Shawn

_______________________________________________
Qt-qml mailing list
Qt-...@qt.nokia.com
http://lists.qt.nokia.com/mailman/listinfo/qt-qml

Jesus Fernandez

unread,
Sep 8, 2011, 6:28:43 AM9/8/11
to Shawn, qt-...@qt.nokia.com
Hi, 

I think the correct way is to modify the model directly so the delegate will update if the bindings are correct.

You can define the delegate as something like this:

   Component{
       id:testViewDelegate
       Item{
           scale: model.isScaled ? 2 : 1

           width: 100
           height: 30
           Image {
               id: image
               width: 30
               height: 30
               source: model.contactImage
           }
       }

Best regards.

Shawn

unread,
Sep 9, 2011, 5:06:12 AM9/9/11
to Riaan Kruger, Qt-...@qt.nokia.com
Hi Riaan,

Thank you for your suggestion, I add index attribute to the model, then
it will work.
If model is from C++, I think the theory should be the same.
Rectangle {
width: 180; height: 200
ListModel {
id: model
ListElement {
name: "Bill Smith"
number: "555 3264"
index: 0
}
ListElement {
name: "John Brown"
number: "555 8426"
index: 1
}
ListElement {
name: "Sam Wise"
number: "555 0473"
index: 2
}
}

Component {
id: contactDelegate
Item {
width: 180; height: 40
scale: (view.currentIndex == index) ? 1.2 : 1
Column {
Text { text: '<b>Name:</b> ' + name }
Text { text: '<b>Number:</b> ' + number }
}
}
}

ListView {
id: view
anchors.fill: parent
model: model
delegate: contactDelegate
highlight: Rectangle { color: "lightsteelblue"; radius: 5 }
focus: true
}
}


Best Regards,
Shawn

On Thu, 2011-09-08 at 12:37 +0200, Riaan Kruger wrote:
> Are you trying to scale the current item in testView?
> If so you should probably do it in the delegate with something like:


> Image {
> id: image
> width: 30
> height: 30
> source: model.contactImage

> scale: parent.index == testview.currentIndex ? 2 :1
> }
>
> PS:Have not tested the above

Juha Turunen

unread,
Sep 9, 2011, 5:17:26 AM9/9/11
to Qt-...@qt.nokia.com
On Fri, Sep 9, 2011 at 12:06 PM, Shawn <sh...@forevertrusts.com> wrote:
> Hi Riaan,
>
> Thank you for your suggestion, I add index attribute to the model, then
> it will work.

If all you need to do is compare the index to the currentIndex, you
don't need to define that index property. The ListView attaches a
boolean property to the instantiated delegate that indicates whether
the item is the current item. So you could get rid of that index
property by changing

scale: (view.currentIndex == index) ? 1.2 : 1

to

scale: ListView.isCurrentItem ? 1.2 : 1

Note that "ListView" isn't the id of the ListView element, but it's a
prefix for the name of the attached property. Here's a link to an
example in the official docs:
http://doc.qt.nokia.com/4.7-snapshot/qml-listview.html#isCurrentItem-prop

Juha

martin...@nokia.com

unread,
Sep 9, 2011, 5:24:16 AM9/9/11
to sh...@forevertrusts.com, ria...@gmail.com, Qt-...@qt.nokia.com
Hi Shawn,

You do not need to add an index role to your model. This property is available automatically in delegates.
http://doc.qt.nokia.com/4.7-snapshot/qdeclarativemodels.html

Br,
Martin.
________________________________________
From: qt-qml-bounces+martin.jones=noki...@qt.nokia.com [qt-qml-bounces+martin.jones=noki...@qt.nokia.com] On Behalf Of ext Shawn [sh...@forevertrusts.com]
Sent: Friday, 9 September 2011 7:06 PM
To: Riaan Kruger; Qt-...@qt.nokia.com
Subject: Re: [Qt-qml] How to access item in ListView delegate?

Riaan Kruger

unread,
Sep 9, 2011, 6:08:10 AM9/9/11
to Qt-...@qt.nokia.com
Thanx Martin and Juha now I can go and clean up my own code a little :)
Riaan
Reply all
Reply to author
Forward
0 new messages