Qt Forum

    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search
    • Unsolved

    Solved Mouse Areas can't overlap ?

    QML and Qt Quick
    2
    3
    619
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • S
      Sillimon last edited by

      Hello there !

      Coming with a problem related to Mouse areas in a listView delegate...

      0_1516180793901_ListView.PNG

      Here is my ListView ! As you can see, there is Sectors with blocks (not always 3, depends on the bytes number of the Sector... that's why i used a repeater as i said below).

      On each block, i put a mouse area to display something in a TextArea.

      And i want to change the ListView current Index to highlight all the sector and its blocks after a click (cf Sector 0 on the image).

      The problem is :

      FIRST, i thought to change the ListView currentIndex in my blocks MouseArea.OnClicked BUT... I created my blocks Text with a repeater wich means, if i guess right, that the "index" property is actually pointing on the repeater current index. So while clicking Sector 8 block 2, the Sector 2 started to shine...

      THEN, I tried to set a Mouse Area on the Component (so the Repeater would be a child and index would point to the ListView index) and i encountered two problems :

      1. I had to put an Item{} inside the component to set the height of the child MouseArea (since a Component can't have a height property) wich means that Sectors with 14 blocks are baddly displayed and blocks are overlaping.

      2. Mouse Areas on Sectors change the highlight successfully but Mouse Areas on Blocks ain't working anymore (might be because the Sector MouseArea is kinda "above it" and disable them or take the priority...

      Does someone has an idea to solve this problem ?

      Here is the code i have for now, at the end of my " THEN try"

      ListView
                  {
                      id: listViewCardStructure
      
                      anchors.fill: parent
                      orientation: ListView.Vertical
                      spacing: 20
                      clip: true
                      boundsBehavior: Flickable.DragAndOvershootBounds
                      snapMode: ListView.NoSnap
      
                      highlight: Component {
                          Rectangle {
                              width: 200; height: 50;
                              color: "#FFFF88"
                              y: listViewCardStructure.currentItem.y;
                              Behavior on y { SpringAnimation { spring: 2; damping: 0.1 } }
                          }
                      }
                      highlightFollowsCurrentItem: false
                      focus: true
      
                      model: listModel
                      delegate: component
      
      
                      Component
                      {
                          id: component
      
                          Item
                          {
                              width: listViewCardStructure.width
                              height: 80
      
                              Column
                              {
                                  id: columnListView
      
                                  Text
                                  {
                                      id: textDelegate
                                      text: sector
                                      font.pixelSize: 13
                                      font.bold: true
                                  }
      
                                  Repeater
                                  {
                                      id: repeaterBlock
                                      model: nbrModelRepeater
      
                                      Text
                                      {
                                          text: "  block " + index
      
                                          MouseArea
                                          {
                                              anchors.fill: parent
                                              acceptedButtons: Qt.LeftButton | Qt.RightButton
      
                                              onPressed:
                                              {
                                                  parent.style = Text.Sunken
                                                  parent.color = "blue"
                                              }
      
                                              onReleased:
                                              {
                                                  parent.style = Text.Normal
                                                  parent.color = "black"
                                              }
      
                                              onClicked:
                                              {
                                                  readWrite2.setCurrentIndexSectorAndBlock(numSector, index)
                                                  textAreaReadWrite.text = readWrite2.readChip();
                                              }
                                          }
                                      }
                                  }
                              }
      
                              MouseArea
                              {
                                  anchors.fill: parent
      
                                  onClicked:
                                  {
                                      listViewCardStructure.currentIndex = index;
                                  }
                              }
                          }
                      }
                  }
      

      i know that's a real meli-melo. I somehow tried everything i found on the subject to understand all i could get on ListViews/Delegates

      Thankfull

      PS: as a non-native english speaker, i apologize for my english and would be pleased to give some more details

      1 Reply Last reply Reply Quote 0
      • L
        Leonardo last edited by Leonardo

        Add a property to your Repeater or any of its ancestors. Something like sectorIndex.

        property var sectorIndex : index
        

        Then on your block's MouseArea:

        listViewCardStructure.currentIndex = myRepeaterOrAnyAncestor.sectorIndex
        
        1 Reply Last reply Reply Quote 0
        • S
          Sillimon last edited by

          Did it with an item so i can set the height of the highlight part.

          ListView
                      {
                          id: listViewCardStructure
          
                          anchors.fill: parent
                          orientation: ListView.Vertical
                          spacing: 20
                          clip: true
                          boundsBehavior: Flickable.DragAndOvershootBounds
                          snapMode: ListView.NoSnap
          
                          highlight: Component {
                              Rectangle {
                                  width: rectangleCardStructure.width - 10; height: listViewCardStructure.currentItem.height;
                                  color: "#FFFF88"
                                  y: listViewCardStructure.currentItem.y;
                                  Behavior on y { SpringAnimation { spring: 2; damping: 0.1 } }
                              }
                          }
                          highlightFollowsCurrentItem: false
                          focus: true
          
                          model: listModel
                          delegate: component
          
          
                          Component
                          {
                              id: component
          
                              Item
                              {
                                  property int lvIndex: index
                                  height: childrenRect.height
          
                                  Column
                                  {
                                      Text
                                      {
                                          id: textDelegate
                                          text: sector
                                          font.pixelSize: 13
                                          font.bold: true
                                      }
          
                                      Repeater
                                      {
                                          id: repeaterBlock
                                          model: nbrModelRepeater
          
                                          Text
                                          {
                                              text: "  block " + index
          
                                              MouseArea
                                              {
                                                  anchors.fill: parent
                                                  acceptedButtons: Qt.LeftButton | Qt.RightButton
          
                                                  onPressed:
                                                  {
                                                      parent.style = Text.Sunken
                                                      parent.color = "blue"
                                                  }
          
                                                  onReleased:
                                                  {
                                                      parent.style = Text.Normal
                                                      parent.color = "black"
                                                  }
          
                                                  onClicked:
                                                  {
                                                      listViewCardStructure.currentIndex = lvIndex
          
                                                      readWrite2.setCurrentIndexSectorAndBlock(numSector, index)
                                                      textAreaReadWrite.text = "Sector " + lvIndex + " Block " + index + " : \n\n" + readWrite2.readChip();
                                                  }
                                              }
                                          }
                                      }
                                  }
                              }
                          }
                      }
          

          But works perfectly, thanks a lot !

          1 Reply Last reply Reply Quote 0
          • First post
            Last post