提供一個較小的視窗,顯示一個較大的內容,內容可在這個小視窗中進行拖動.
Flickable
width: height:
指明可供瀏覽的視窗大小
contentWidth: contentHeight:
指明瞭內容的大小
由於一個實現的細節，放置在Flickable裏面的項不能用id來anchor，而用parent代替
Flickable提供一個較小的視窗來顯示一個較大的內容給用戶，並且用戶可以對改內容進行拖拽和輕拂。
接下來爲大家說明一下Flickable 的一些常用屬性
contentX : real
contentY : real
這個屬性返回內容被輕拂時，x,y方向（相對視窗左上角那個點）的位移。
例如，如果你把圖片垂直挪動100像素點，則contentY的值將變爲100
flicking : bool
flickingHorizontally : bool
flickingVertically : bool
這三個爲只讀屬性，返回當前視窗下，內容是否被輕拂（輕彈），如果有，flicking返回true，
如果是沿豎直方向對內容操作，則 flickingVertically 返回true， flickingHorizontally 返回false
如果是沿水平方向對內容操作，則 flickingHorizontally 返回true， flickingVertically 返回false
horizontalVelocity : real
verticalVelocity : real
這兩個是隻讀屬性，放回當前視窗下，內容被輕拂（輕彈）時，x，y方向的速度，單位是秒每像素點
maximumFlickVelocity : real
這個屬性可以限定當前視窗下，內容被輕拂的最大速度，由實現平臺限定默認值
moving : bool
movingHorizontally : bool
movingVertically : bool
這三個爲只讀屬性，返回當前視窗下，內容是否被拖動，如果有， moving 返回true，
如果是沿豎直方向對內容操作，則 movingVertically 返回true， movingHorizontally 返回false
如果是沿水平方向對內容操作，則 movingHorizontally 返回true， movingVertically 返回false
用來做滾動條的
visibleArea.heightRatio : real
visibleArea.widthRatio : real
visibleArea.xPosition : real
visibleArea.yPosition : real
這四個爲只讀屬性
這些屬性描述的是當前視窗下，內容的區域的位置和大小
visibleArea.heightRatio = height / contenHeight 比例
visibleArea.widthRatio = width / contentWidth 比例
visibleArea.xPosition =
visibleArea.yPosition =
還是看個實例吧
[javascript] view plain copy
在CODE上查看代碼片派生到我的代碼片
Rectangle {
width: 200; height: 200
Flickable {
id: flickable
...
}
Rectangle {
id: scrollbar
anchors.right: flickable.right
y: flickable.visibleArea.yPosition * flickable.height
width: 10
height: flickable.visibleArea.heightRatio * flickable.height
color: "black"
}
}
atXBeginning : bool
atXEnd : bool
atYBeginning : bool
atYEnd : bool
這些屬性都爲真，如果視窗的內容剛好與視窗大小相符
These properties are true if the flickable view is positioned at the beginning, or end respecively.
flickDeceleration : real
讓輕拂或拖動的速率減慢
flickableDirection : enumeration
這個屬性決定當前視窗的內容可以被操作的方向
This property determines which directions the view can be flicked.
Flickable.AutoFlickDirection (default) - 自動確定
Flickable.HorizontalFlick - 只允許水平操作
Flickable.VerticalFlick - 只允許垂直操作
Flickable.HorizontalAndVerticalFlick - 運行水平和垂直方向的操作
pressDelay : int
這個屬性設置一個毫秒來延遲一個按鈕到達視窗內的子項
This property holds the time to delay (ms) delivering a press to children of the Flickable.
這可能是有用的,反應前的新聞一閃的行動有着不良的影響。
This can be useful where reacting to a press before a flicking action has undesirable effects.
這可能是有用的，因爲在響應一個按鈕之前，一個輕拂動作會導致不良的效果
interactive : bool
這個屬性描述用戶能否與當前視窗進行交互。當視窗不能進行交互（屬性值爲false），用戶不能拖或者輕彈視窗內容
通常，這個屬性的值爲真
boundsBehavior : enumeration
這個屬性記錄了當前視窗內容的大小超過了視窗的邊界還是輕拂時越過視窗邊界。
這使得邊界實現羽化和柔和
boundsBehavior 可能是下面其中一個
Flickable.StopAtBounds - 內容不能被拖出視窗邊界，輕拂時內容也不會超出視窗邊界
Flickable.DragOverBounds - 內容能被拖出視窗邊界，輕拂時內容也不會超出視窗邊界
Flickable.DragAndOvershootBounds (default) - 內容能被拖出視窗邊界，輕拂時內容會超出視窗邊界
contentItem : Item
交互項被包含進視窗，能被操作移動
交互項被聲明爲視窗的子，被自動添加到視窗的contentItem屬性中去
Items created dynamically need to be explicitly parented to the contentItem:
[javascript] view plain copy
在CODE上查看代碼片派生到我的代碼片
Flickable {
id: myFlickable
function addItem(file) {
var component = Qt.createComponent(file)
component.createObject(myFlickable.contentItem);
}
}
信號處理器
onFlickEnded
當視窗內容被輕拂後停止，觸發
This handler is called when the view stops moving due to a flick.
onFlickStarted
當視窗內容剛被被輕拂時，觸發
This handler is called when the view is flicked.
A flick starts from the point that the mouse or touch is released, while still in motion.
onFlickStarted
onMovementEnded
當視窗內容停止移動時，觸發
This handler is called when the view stops moving due to user interaction.
如果是輕拂，則這個信號處理器將在 輕拂之後停止滑動 被觸發
If a flick was generated, this handler will be triggered once the flick stops.
如果不是輕拂，當用戶停止拖拽時被觸發
If a flick was not generated, the handler will be triggered when the user stops dragging - i.e. a mouse or touch release.
onMovementStarted
視窗內容剛被操作時觸發
This handler is called when the view begins moving due to user interaction.
This documentation is under development and is subject to change.
方法文檔
Flickable::resizeContent ( real width, real height, QPointF center )
用於重置視窗內容尺寸
重置視窗內容尺寸會導致內容超過視窗的邊界，使用returnToBounds() 函數可以修復內容的邊界到一個合法的範圍
Flickable::returnToBounds ()
使用returnToBounds() 函數可以修復內容的邊界到一個合法的範圍