Overlapping Delegate in listview
-
I have a list of items, onClicking each item a rectangle with its associated properties open. When I click the second item the rectangle of the second item opens up overlapping the first. I don't want this to happen, the second rectangle should open only when first is closed (OR) on clicking second item it should automatically close the first rectangle. The list is an xml list, and the delegate has the common property to all its list element.
I tried to change the
opacity - didnt work
visibility - didnt work
MouseArea- enabled: false didnt work.
tried to access the particular index by xmlmodel.get(index)- didnt work.Anyone who has an idea on how to deal with it, kindly drop in your suggestion. Thanks for your time.
-
you could :
give an id to your ListView like @id : idLV@
replace your onClicked: if(shortview.state.....
by
@state : index==idLV.isCurrentItem ? 'Details' : 'shortview' @In the initial code the state of the first clicked element is not updated when you clicked on a another one.
Edit
obviously :)
@ onClicked: state = idLV.isCurrentItem ? 'Details' : 'shortview'@ -
The code you gave as an example is too long for people to read and reply. If I have understood correctly thge problem indicated in the first comment, then here is a simple solution. However, I admit this could be done in multiple ways.
@
import QtQuick 2.0Rectangle{
id:mainRect
width:400; height:widthfunction showActionList(mousX, mousY){ if(actionList.opacity>0){ console.log("visible"); mainRect.hideActionList(); } actionList.x = mousX; actionList.y = mousY; actionList.opacity = 1; } function hideActionList(){ actionList.opacity = 0; } Timer { interval: 50; running: false; repeat: false onTriggered: mainRect.hideActionList(); } ListModel{ id: mainlistModel ListElement{ title:"One";pubDate:"Aug"; param:" 2010" } ListElement{ title:"Two";pubDate:"Sep"; param:" 2011" } ListElement{ title:"Three";pubDate:"Oct"; param:" 2012" } } ListView{ id:mainListView anchors.fill: parent model: mainlistModel delegate: Rectangle{ width: parent.width; height: 40; Text {id:txt; anchors.centerIn: parent; text:title+ ": " + pubDate+param } Rectangle{ anchors{ top:txt.bottom; horizontalCenter: parent.Center }width: parent.width - 2; height: 1; color: "black"} MouseArea{ anchors.fill:parent onClicked: mainRect.showActionList(mouseX,mouseY); } } } ListModel { id: listModel ListElement{action:"View"} ListElement{action:"Edit"} ListElement{action:"Delete"} } Component { id: actionDelegate Rectangle{ width: 40; height: 30; radius: 3 border{width: 2; color: "black"} Text{id:dText;anchors.centerIn: parent; text:action} } } ListView{ id: actionList model:listModel width: 180; height: 300 delegate: actionDelegate opacity: 0 }
}
@ -
http://www.2shared.com/file/-KWQrl3Z/xml_view.html
Cleaned up my code mate. Thanks. Iwill also try to do it with simple code.
-
here it is mate
@import QtQuick 1.1
Rectangle{
width:400 height:width property real ropacity:0 XmlListModel { id: xmlModel source:"example_grouping.xml" query: "/rss/channel/item" XmlRole { name: "id"; query: "id/string()" } XmlRole { name: "title"; query: "title/string()" } XmlRole { name: "pubDate"; query: "pubDate/string()" } XmlRole { name: "param"; query: "param/string()" } //onStatusChanged: if (status === XmlListModel.Ready) { console.log("XML elements read: ", count); fillListModel(); sortModel(); } } Component { id: sectionHeading Rectangle { id:rect1 width: 50 height:18 color: "lightgrey" Text { text: section font.bold: true } } } Component { id: mainDelegate Item { id: shortview property real detailsOpacity : 0 width: 100 height: 29 state : index==idLV.currentIndex ? 'details' : '' states: [ State { name: "" PropertyChanges { target: shortview; height:29;} PropertyChanges { target: tert; color:"black" } }, State { name: "details" ; PropertyChanges {target: shortview ; height:50; } PropertyChanges {target: tert ; color:"pink" } } ] Text { id:tert text:param color : "black" } MouseArea { id:marea anchors.fill:parent onClicked: idLV.currentIndex = index } } } ListView{ id:idLV model:xmlModel width: 180; height: 300 delegate: mainDelegate section.property: "param" section.criteria: ViewSection.FullString section.delegate: sectionHeading }
}@
-
The first item is always on 'Details' mode.
I have a close button on clikcing it goes back to the old state, when I click that I am unable to access the list.
Chk this if u have some time. Its the code which am working on.
http://www.2shared.com/file/d0BduoTK/xml.html"chk this":http://www.2shared.com/file/d0BduoTK/xml.html
Thanks