Enables the user to navigate pages by swiping sideways. 更多...
import 语句: | import QtQuick.Controls |
继承: | 容器 |
SwipeView provides a swipe-based navigation model.
SwipeView is populated with a set of pages. One page is visible at a time. The user can navigate between the pages by swiping sideways. Notice that SwipeView itself is entirely non-visual. It is recommended to combine it with PageIndicator , to give the user a visual clue that there are multiple pages.
SwipeView { id: view currentIndex: 1 anchors.fill: parent Item { id: firstPage } Item { id: secondPage } Item { id: thirdPage } } PageIndicator { id: indicator count: view.count currentIndex: view.currentIndex anchors.bottom: view.bottom anchors.horizontalCenter: parent.horizontalCenter }
As shown above, SwipeView is typically populated with a static set of pages that are defined inline as children of the view. It is also possible to add , insert , move ,和 remove pages dynamically at run time.
When SwipeView is paired with another container such as
TabBar
, it is necessary to make a two-way binding between the
currentIndex
property of each control. To do this without breaking bindings, avoid setting
currentIndex
directly, and instead use
setCurrentIndex
(), for example. See
Managing the Current Index
了解更多信息。
To perform an action when
currentIndex
changes, use the
onCurrentIndexChanged
property change signal handler
:
onCurrentIndexChanged: { print("currentIndex changed to", currentIndex) // ... }
It is generally not advisable to add excessive amounts of pages to a SwipeView. However, when the amount of pages grows larger, or individual pages are relatively complex, it may be desirable to free up resources by unloading pages that are outside the immediate reach of the user. The following example presents how to use Loader to keep a maximum of three pages simultaneously instantiated.
SwipeView { Repeater { model: 6 Loader { active: SwipeView.isCurrentItem || SwipeView.isNextItem || SwipeView.isPreviousItem sourceComponent: Text { text: index Component.onCompleted: console.log("created:", index) Component.onDestruction: console.log("destroyed:", index) } } } }
注意:
SwipeView takes over the geometry management of items added to the view. Using anchors on the items is not supported, and any
width
or
height
assignment will be overridden by the view. Notice that this only applies to the root of the item. Specifying width and height, or using anchors for its children works as expected.
另请参阅 TabBar , PageIndicator , Customizing SwipeView , 导航控件 , 容器控件 ,和 Focus Management in Qt Quick Controls .
[read-only, since QtQuick.Controls 2.3 (Qt 5.10)] horizontal : bool |
This property holds whether the swipe view is horizontal.
该特性在 QtQuick.Controls 2.3 (Qt 5.10) 引入。
另请参阅 orientation .
[since QtQuick.Controls 2.1 (Qt 5.8)] interactive : bool |
This property describes whether the user can interact with the SwipeView . The user cannot swipe a view that is not interactive.
默认值为
true
.
该特性在 QtQuick.Controls 2.1 (Qt 5.8) 引入。
[since QtQuick.Controls 2.2 (Qt 5.9)] orientation : enumeration |
This property holds the orientation.
可能的值:
常量 | 描述 |
---|---|
Qt.Horizontal
|
Horizontal (default) |
Qt.Vertical
|
Vertical |
This property was introduced in QtQuick.Controls 2.2 (Qt 5.9).
另请参阅 horizontal and vertical .
[read-only, since QtQuick.Controls 2.3 (Qt 5.10)] vertical : bool |
This property holds whether the swipe view is vertical.
该特性在 QtQuick.Controls 2.3 (Qt 5.10) 引入。
另请参阅 orientation .
[read-only] SwipeView.index : int |
This attached property holds the index of each child item in the SwipeView .
It is attached to each child item of the SwipeView .
[read-only] SwipeView.isCurrentItem : bool |
This attached property is
true
if this child is the current item.
It is attached to each child item of the SwipeView .
[read-only, since QtQuick.Controls 2.1 (Qt 5.8)] SwipeView.isNextItem : bool |
This attached property is
true
if this child is the next item.
It is attached to each child item of the SwipeView .
该特性在 QtQuick.Controls 2.1 (Qt 5.8) 引入。
[read-only, since QtQuick.Controls 2.1 (Qt 5.8)] SwipeView.isPreviousItem : bool |
This attached property is
true
if this child is the previous item.
It is attached to each child item of the SwipeView .
该特性在 QtQuick.Controls 2.1 (Qt 5.8) 引入。
[read-only] SwipeView.view : SwipeView |
This attached property holds the view that manages this child item.
It is attached to each child item of the SwipeView .