title: Why does adding a MouseArea with anchors.fill: parent cause the rows to stack up on one another?
body: <p>Given that this <code>ListView</code> works fine:</p>
  
  <pre><code>ListView {
      id: myListView
      model: myListModel
      anchors.fill: parent
  
      delegate: Row {
          id: row
          spacing: 5
          Text {
              text: id
              width: 25
              horizontalAlignment: Text.AlignHCenter
          }
  
          Text {
              text: description
          }
      }
  }
  </code></pre>
  
  <p>Why does adding a <code>MouseArea</code> with <code>anchors.fill: parent</code> cause the rows to stack up on one another?  How do I get back the automatic vertical spacing that I had before adding <code>MouseArea</code>?  I have already tried putting the <code>Row</code> in a <code>Rectangle</code> and also in a <code>Component</code>.</p>
  
  <pre><code>ListView {
      id: myListView
      model: myListModel
      anchors.fill: parent
  
      delegate: Row {
          MouseArea {
              anchors.fill: parent
              onClicked: myListView.currentIndex = index
          }
          id: row
          spacing: 5
  
          Text {
              text: id
              width: 25
              horizontalAlignment: Text.AlignHCenter
          }
  
          Text {
              text: description
          }
      }
  }
  </code></pre>