與列表視圖

Question

滾動頁面我有一個名爲page2.qml文件中像下面

Page { 
     id: page 

     Rectangle { 
      id: container 
      anchors.fill: parent 
      width: parent.width * 0.8 

      Rectangle { 
       id: title 
       anchors.top: parent.top 
       width: parent.width 
       height: 50 
       color: "salmon" 
      } 

      ListView { 
       id: listView 
       currentIndex: -1 
       anchors.top: title.bottom 
       anchors.bottom: parent.bottom 


       delegate: Rectangle { 
        height: 20 
        width: 100 
        border.color: "red" 
        color: "pink" 
        Text { 
         text: model.index 
        } 
       } 

       model: 100 
      } 
     } 
    } 

的結果是這樣的形象：

由於列表視圖包含100項，我怎樣才能使整個頁面可滾動？我可以讓listview可滾動，但不是整個頁面。

Answer 1

如果您不需要ListView是由本身，而是你的整個容器滾動需要，你可以使用一個Repeater，而不是把它放在Column裹在裏面Flickable：

Flickable { 
    id: container 
    contentHeight: column.implicitHeight 
    contentWidth: width 
    width: parent.width * 0.8 
    height: parent.height 

    Column { 
     id: column 
     width: parent.width 

     Rectangle { 
      id: title 
      width: parent.width 
      height: 50 
      color: "salmon" 
     } 

     Repeater { 
      id: listView 
      model: 100 

      delegate: Rectangle { 
       height: 20 
       width: 100 
       border.color: "red" 
       color: "pink" 
       Text { 
        text: model.index 
       } 
      } 
     } 
    } 
}