main.qml Example File
customitems/scrollbar/main.qml
import QtQuick 2.0
Rectangle {
width: 640
height: 480
Flickable {
id: view
anchors.fill: parent
contentWidth: picture.width
contentHeight: picture.height
Image {
id: picture
source: "pics/niagara_falls.jpg"
asynchronous: true
}
states: State {
name: "ShowBars"
when: view.movingVertically || view.movingHorizontally
PropertyChanges { target: verticalScrollBar; opacity: 1 }
PropertyChanges { target: horizontalScrollBar; opacity: 1 }
}
transitions: Transition {
NumberAnimation { properties: "opacity"; duration: 400 }
}
}
ScrollBar {
id: verticalScrollBar
width: 12; height: view.height-12
anchors.right: view.right
opacity: 0
orientation: Qt.Vertical
position: view.visibleArea.yPosition
pageSize: view.visibleArea.heightRatio
}
ScrollBar {
id: horizontalScrollBar
width: view.width-12; height: 12
anchors.bottom: view.bottom
opacity: 0
orientation: Qt.Horizontal
position: view.visibleArea.xPosition
pageSize: view.visibleArea.widthRatio
}
}