如何僅將ScrollView剪輯垂直放置？

Question

ScrollView將其所有內容剪輯到其大小。是否有可能使其只能用於頂部和底部，但允許孩子從右邊和左邊的父母的框架中走出？

Answer 1

我只能想象一個理由，爲什麼你不把ScrollView的寬度設置爲更高的值（contentItem的寬度）。

爲了能夠這樣做，而不是約束ScrollView在它的寬度，你可以使用一個簡單的一招：

Item { 
    id: limitedWidthItemToAnchorTo 
    width: 200 // the width the ScrollView was supposed to have 
    height: 400 

    ScrollView { 
     width: contentItem.width + __verticalScrollBar.width// Don't limit the width. 
     height: 400 // Limit only the height. 
     horizontalScrollBarPolicy: Qt.ScrollBarAlwaysOff // You don't need them. 
     contentItem: Rectangle { 
      width: 700 // This will set the ScrollViews width. 
      height: 600 // The height will be clipped by the ScrollView. 
         // You can scroll though. 

      gradient: Gradient { 
       GradientStop { position: 0; color: 'red' } 
       GradientStop { position: 1; color: 'blue' } 
      } 
      border.width: 10 
     } 
    } 
} 

你敷在Item，錨這一點，你」會很好。 或者你可以使用口罩，但這會更復雜。

本身不可能僅剪切水平或垂直，因爲剪裁是使用Item的邊界框完成的。

Answer 2

如果你想要的只是向一個方向滾動，那麼只需使用屬性綁定將內容項的寬度/高度設置爲ScrollView的寬度/高度（因爲ScrollView內的項目會重新映射到ScrollView.contentItem ）。下面的例子只會垂直滾動。我已經測試過它，如果你需要確認它確實有效。

Item { 
    ScrollView { 
     id: scrollview1 
     anchors.fill: parent 
     anchors.margins: 20 
     clip: true 

     ColumnLayout { 
      width: scrollview1.width 
     } 
    } 
}