src/plugins/qmldesigner/components/itemlibrary/qml/Scrollbar.qml

   1 /**************************************************************************
   2 **
   3 ** This file is part of Qt Creator
   4 **
   5 ** Copyright (c) 2011 Nokia Corporation and/or its subsidiary(-ies).
   6 **
   7 ** Contact: Nokia Corporation (qt-info@nokia.com)
   8 **
   9 ** No Commercial Usage
  10 **
  11 ** This file contains pre-release code and may not be distributed.
  12 ** You may use this file in accordance with the terms and conditions
  13 ** contained in the Technology Preview License Agreement accompanying
  14 ** this package.
  15 **
  16 ** GNU Lesser General Public License Usage
  17 **
  18 ** Alternatively, this file may be used under the terms of the GNU Lesser
  19 ** General Public License version 2.1 as published by the Free Software
  20 ** Foundation and appearing in the file LICENSE.LGPL included in the
  21 ** packaging of this file.  Please review the following information to
  22 ** ensure the GNU Lesser General Public License version 2.1 requirements
  23 ** will be met: http://www.gnu.org/licenses/old-licenses/lgpl-2.1.html.
  24 **
  25 ** In addition, as a special exception, Nokia gives you certain additional
  26 ** rights.  These rights are described in the Nokia Qt LGPL Exception
  27 ** version 1.1, included in the file LGPL_EXCEPTION.txt in this package.
  28 **
  29 ** If you have questions regarding the use of this file, please contact
  30 ** Nokia at qt-info@nokia.com.
  31 **
  32 **************************************************************************/
  33
  34 import Qt 4.7
  35
  36 // scrollbar for the items view
  37
  38 Item {
  39     id: bar
  40
  41     // public
  42
  43     property variant flickable
  44
  45     function scroll(delta) {
  46         handle.y = Math.max(0, Math.min(scrollHeight, handle.y + delta))
  47     }
  48
  49     function reset() {
  50         handle.y = 0
  51     }
  52
  53     // internal
  54
  55     ItemsViewStyle { id: style }
  56
  57     onFlickableChanged: reset()
  58
  59     property int scrollHeight: height - handle.height
  60
  61     clip: true
  62
  63     Rectangle {
  64         anchors.top: parent.top
  65         anchors.topMargin: 2
  66         anchors.bottom: parent.bottom
  67         anchors.bottomMargin: 3
  68         anchors.horizontalCenter: parent.horizontalCenter
  69         width: 6
  70         radius: 3
  71         color: style.scrollbarColor
  72         border.width: 1
  73         border.color: style.scrollbarBorderColor
  74     }
  75
  76     function updateHandle() {
  77         handle.updateFlickable = false
  78
  79         if (flickable)
  80             handle.y = scrollHeight * Math.min(
  81                     flickable.contentY / (flickable.contentHeight - flickable.height),
  82         1)
  83             else
  84                 handle.y = 0
  85
  86         handle.updateFlickable = true
  87     }
  88
  89     onHeightChanged: updateHandle()
  90
  91     Connections {
  92         target: flickable
  93         onHeightChanged: updateHandle()
  94     }
  95
  96     Connections {
  97         target: flickable
  98         onContentHeightChanged: updateHandle()
  99     }
 100
 101     Connections {
 102         target: flickable
 103         onContentYChanged: updateHandle()
 104     }
 105
 106     MouseArea {
 107         anchors.left: parent.left
 108         anchors.right: parent.right
 109         anchors.top: parent.top
 110         anchors.bottom: handle.top
 111         onClicked: scroll(-style.scrollbarClickScrollAmount)
 112     }
 113
 114     Item {
 115         id: handle
 116
 117         anchors.left: parent.left
 118         anchors.right: parent.right
 119         height: Math.max(width, bar.height * Math.min(1, flickable.height / flickable.contentHeight))
 120
 121         property bool updateFlickable: true
 122
 123         onYChanged: {
 124             if (updateFlickable)
 125                 flickable.contentY = Math.max(0, flickable.contentHeight * y / bar.height)
 126             }
 127
 128                 Rectangle {
 129                     width: parent.height
 130                     height: parent.width
 131                     y: -height - 2
 132                     x: -2
 133
 134                     rotation: 90
 135                     transformOrigin: Item.BottomLeft
 136
 137                     border.color: style.scrollbarBorderColor
 138                     border.width: 1
 139                     radius: 3
 140
 141                     gradient: Gradient {
 142                         GradientStop { position: 0.15; color: style.scrollbarGradientStartColor }
 143                         GradientStop { position: 0.78; color: style.scrollbarGradientMiddleColor }
 144                         GradientStop { position: 0.80; color: style.scrollbarGradientEndColor }
 145                     }
 146                 }
 147
 148                 MouseArea {
 149                     anchors.fill: parent
 150                     drag.target: parent
 151                     drag.axis: "YAxis"
 152                     drag.minimumY: 0
 153                     drag.maximumY: scrollHeight
 154                 }
 155             }
 156
 157     MouseArea {
 158         anchors.left: parent.left
 159         anchors.right: parent.right
 160         anchors.top: handle.bottom
 161         anchors.bottom: parent.bottom
 162         onClicked: scroll(style.scrollbarClickScrollAmount)
 163     }
 164 }