Vertical or horizontal interactive scroll bar. 更多...
导入语句: | import QtQuick.Controls 2.2 |
Since: | Qt 5.7 |
继承: | Control |
ScrollBar is an interactive bar that can be used to scroll to a specific position. A scroll bar can be either vertical or horizontal , and can be attached to any Flickable ,譬如 ListView and GridView .
Flickable { // ... ScrollBar.vertical: ScrollBar { } }
When ScrollBar is attached vertically or horizontally to a Flickable, its geometry and the following properties are automatically set and updated as appropriate:
An attached ScrollBar re-parents itself to the target Flickable. A vertically attached ScrollBar resizes itself to the height of the Flickable, and positions itself to either side of it based on the layout direction . A horizontally attached ScrollBar resizes itself to the width of the Flickable, and positions itself to the bottom. The automatic geometry management can be disabled by specifying another parent for the attached ScrollBar. This can be useful, for example, if the ScrollBar should be placed outside a clipping Flickable. This is demonstrated by the following example:
Flickable { id: flickable clip: true // ... ScrollBar.vertical: ScrollBar { parent: flickable.parent anchors.top: flickable.top anchors.left: flickable.right anchors.bottom: flickable.bottom } }
Notice that ScrollBar does not filter key events of the Flickable it is attached to. The following example illustrates how to implement scrolling with up and down keys:
Flickable { focus: true Keys.onUpPressed: scrollBar.decrease() Keys.onDownPressed: scrollBar.increase() ScrollBar.vertical: ScrollBar { id: scrollBar } }
Horizontal and vertical scroll bars do not share the active state with each other by default. In order to keep both bars visible whilst scrolling to either direction, establish a two-way binding between the active states as presented by the following example:
Flickable { anchors.fill: parent contentWidth: parent.width * 2 contentHeight: parent.height * 2 ScrollBar.horizontal: ScrollBar { id: hbar; active: vbar.active } ScrollBar.vertical: ScrollBar { id: vbar; active: hbar.active } }
It is possible to create an instance of ScrollBar without using the attached property API. This is useful when the behavior of the attached scroll bar is not sufficient or a Flickable is not in use. In the following example, horizontal and vertical scroll bars are used to scroll over the text without using Flickable :
Rectangle { id: frame clip: true width: 160 height: 160 border.color: "black" anchors.centerIn: parent Text { id: content text: "ABC" font.pixelSize: 160 x: -hbar.position * width y: -vbar.position * height } ScrollBar { id: vbar hoverEnabled: true active: hovered || pressed orientation: Qt.Vertical size: frame.height / content.height anchors.top: parent.top anchors.right: parent.right anchors.bottom: parent.bottom } ScrollBar { id: hbar hoverEnabled: true active: hovered || pressed orientation: Qt.Horizontal size: frame.width / content.width anchors.left: parent.left anchors.right: parent.right anchors.bottom: parent.bottom } }
When using a non-attached ScrollBar, the following must be done manually:
另请参阅 ScrollIndicator , Customizing ScrollBar ,和 指示器控件 .
active : bool |
This property holds whether the scroll bar is active, i.e. when it's pressed or the attached Flickable is moving .
It is possible to keep both horizontal and vertical bars visible while scrolling in either direction.
This property is automatically set when the scroll bar is attached to a flickable .
[read-only, since QtQuick.Controls 2.3 (Qt 5.10)] horizontal : bool |
This property holds whether the scroll bar is horizontal.
该特性在 QtQuick.Controls 2.3 (Qt 5.10) 引入。
另请参阅 orientation .
[since QtQuick.Controls 2.2 (Qt 5.9)] interactive : bool |
This property holds whether the scroll bar is interactive. The default value is
true
.
A non-interactive scroll bar is visually and behaviorally similar to ScrollIndicator . This property is useful for switching between typical mouse- and touch-orientated UIs with interactive and non-interactive scroll bars, respectively.
This property was introduced in QtQuick.Controls 2.2 (Qt 5.9).
[since QtQuick.Controls 2.4 (Qt 5.11)] minimumSize : real |
This property holds the minimum size of the scroll bar, scaled to
0.0 - 1.0
.
This property was introduced in QtQuick.Controls 2.4 (Qt 5.11).
另请参阅 size , visualSize ,和 visualPosition .
orientation : enumeration |
This property holds the orientation of the scroll bar.
可能的值:
常量 | 描述 |
---|---|
Qt.Horizontal
|
Horizontal |
Qt.Vertical
|
Vertical (default) |
This property is automatically set when the scroll bar is attached to a flickable .
另请参阅 horizontal and vertical .
[since QtQuick.Controls 2.2 (Qt 5.9)] policy : enumeration |
This property holds the policy of the scroll bar. The default policy is
ScrollBar.AsNeeded
.
可能的值:
常量 | 描述 |
---|---|
ScrollBar.AsNeeded
|
The scroll bar is only shown when the content is too large to fit. |
ScrollBar.AlwaysOff
|
The scroll bar is never shown. |
ScrollBar.AlwaysOn
|
The scroll bar is always shown. |
The following example keeps the vertical scroll bar always visible:
Flickable { contentHeight: 2000 ScrollBar.vertical: ScrollBar { policy: ScrollBar.AlwaysOn } }
This property was introduced in QtQuick.Controls 2.2 (Qt 5.9).
position : real |
This property holds the position of the scroll bar, scaled to
0.0 - 1.0
.
This property is automatically set when the scroll bar is attached to a flickable .
另请参阅 Flickable::visibleArea and visualPosition .
pressed : bool |
This property holds whether the scroll bar is pressed.
size : real |
This property holds the size of the scroll bar, scaled to
0.0 - 1.0
.
This property is automatically set when the scroll bar is attached to a flickable .
另请参阅 Flickable::visibleArea , minimumSize ,和 visualSize .
[since QtQuick.Controls 2.2 (Qt 5.9)] snapMode : enumeration |
This property holds the snap mode.
可能的值:
常量 | 描述 |
---|---|
ScrollBar.NoSnap
|
The scrollbar does not snap (default). |
ScrollBar.SnapAlways
|
The scrollbar snaps while dragged. |
ScrollBar.SnapOnRelease
|
The scrollbar does not snap while being dragged, but only after released. |
In the following table, the various modes are illustrated with animations. The movement and the
stepSize
(
0.25
) are identical in each animation.
值 | 范例 |
ScrollBar.NoSnap
|
|
ScrollBar.SnapAlways
|
|
ScrollBar.SnapOnRelease
|
This property was introduced in QtQuick.Controls 2.2 (Qt 5.9).
另请参阅 stepSize .
stepSize : real |
This property holds the step size. The default value is
0.0
.
另请参阅 snapMode , increase() ,和 decrease() .
[read-only, since QtQuick.Controls 2.3 (Qt 5.10)] vertical : bool |
This property holds whether the scroll bar is vertical.
该特性在 QtQuick.Controls 2.3 (Qt 5.10) 引入。
另请参阅 orientation .
[since QtQuick.Controls 2.4 (Qt 5.11)] visualPosition : real |
This property holds the effective visual position of the scroll bar, which may be limited by the 最小大小 .
This property was introduced in QtQuick.Controls 2.4 (Qt 5.11).
另请参阅 position and minimumSize .
[since QtQuick.Controls 2.4 (Qt 5.11)] visualSize : real |
This property holds the effective visual size of the scroll bar, which may be limited by the 最小大小 .
This property was introduced in QtQuick.Controls 2.4 (Qt 5.11).
另请参阅 size and minimumSize .
ScrollBar.horizontal : ScrollBar |
This property attaches a horizontal scroll bar to a Flickable .
Flickable { contentWidth: 2000 ScrollBar.horizontal: ScrollBar { } }
另请参阅 Attaching ScrollBar to a Flickable .
ScrollBar.vertical : ScrollBar |
This property attaches a vertical scroll bar to a Flickable .
Flickable { contentHeight: 2000 ScrollBar.vertical: ScrollBar { } }
另请参阅 Attaching ScrollBar to a Flickable .
void decrease () |
Decreases the position by
stepSize
or
0.1
if
stepSize
is
0.0
.
另请参阅 stepSize .
void increase () |
Increases the position by
stepSize
or
0.1
if
stepSize
is
0.0
.
另请参阅 stepSize .