Tumbler QML Type

可旋转的物品选择轮。更多...

• 所有成员的列表，包括继承的成员

属性

• count : int
• currentIndex : int
• currentItem : Item
• delegate : Component
• flickDeceleration : int
• model : variant
• moving : bool (since QtQuick.Controls 2.2 (Qt 5.9))
• visibleItemCount : int
• wrap : bool (since QtQuick.Controls 2.1 (Qt 5.8))

关联属性

• displacement : real
• tumbler : Tumbler

方法

• void positionViewAtIndex(int index, PositionMode mode) (since QtQuick.Controls 2.5 (Qt 5.12))

详细说明

Tumbler {
    model: 5
    // ...
}

Tumbler 允许用户从一个可旋转的“轮盘”中选择一项选项。 当选项过多（例如RadioButton ）但又不足以使用可编辑下拉列表（SpinBox ）时，该组件非常实用。其便利之处在于无需使用键盘操作，且当项目数量庞大时，选项会在两端循环显示。

其 API 与ListView 和PathView 等视图类似；可以设置model 和delegate ，而count 和currentItem 属性则提供对视图信息的只读访问。若要将视图定位到特定索引处，请使用positionViewAtIndex()。

然而，与PathView 和ListView 等视图不同，它始终存在一个当前项目（当模型不为空时）。这意味着当count 等于0 时，currentIndex 将等于-1 。在所有其他情况下，它将大于或等于0 。

默认情况下，当 Tumblerwraps 到达顶部或底部时，只要模型中的项目数量多于可见项目数量，即当count 大于visibleItemCount 时：

import QtQuick
import QtQuick.Window
import QtQuick.Controls

Rectangle {
    width: frame.implicitWidth + 10
    height: frame.implicitHeight + 10

    FontMetrics {
        id: fontMetrics
    }

    Component {
        id: delegateComponent

        Label {
            text: formatText(Tumbler.tumbler.count, modelData)
            opacity: 1.0 - Math.abs(Tumbler.displacement) / (Tumbler.tumbler.visibleItemCount / 2)
            horizontalAlignment: Text.AlignHCenter
            verticalAlignment: Text.AlignVCenter
            font.pixelSize: fontMetrics.font.pixelSize * 1.25

            function formatText(count, modelData) {
                var data = count === 12 ? modelData + 1 : modelData;
                return data.toString().length < 2 ? "0" + data : data;
            }
        }
    }

    Frame {
        id: frame
        padding: 0
        anchors.centerIn: parent

        Row {
            id: row

            Tumbler {
                id: hoursTumbler
                model: 12
                delegate: delegateComponent
            }

            Tumbler {
                id: minutesTumbler
                model: 60
                delegate: delegateComponent
            }

            Tumbler {
                id: amPmTumbler
                model: ["AM", "PM"]
                delegate: delegateComponent
            }
        }
    }
}

另请参阅 《自定义 Tumbler 和输入控件》。

属性文档

count : int [read-only]

该属性存储了模型中的项目数量。

currentIndex : int

该属性存储当前项的索引。

当 `count ` 等于 `0` 时，该属性的值为 `-1 `。在所有其他情况下，其值将大于或等于 `0`。

另请参阅 currentItem 和positionViewAtIndex()。

currentItem : Item [read-only]

该属性存储了当前索引处的项。

另请参阅 ` currentIndex ` 和 `positionViewAtIndex()`。

delegate : Component

该属性保存用于显示每个项目的委托。

Tumbler 不会拥有该委托。

flickDeceleration : int

该属性控制轻扫动作的减速速率：数值越高，当用户停止触摸轻扫时，减速速度就越快。例如，0.0001 几乎“无阻力”，而10000 则感觉相当“粘滞”。

当 `wrap ` 为 `true`（默认值）时，默认的 `flickDeceleration` 值为 `100`。否则，该值取决于平台。若要覆盖此行为，请显式设置此属性的值。若要恢复默认行为，请将此属性设置为 `undefined`。不允许设置为零或负数。

model : variant

该属性保存了为本转盘提供数据的模型。

moving : bool [since QtQuick.Controls 2.2 (Qt 5.9)]

该属性描述了转盘当前是否正在移动，这是由于用户拖动或轻扫它所致。

该属性于 QtQuick.Controls 2.2（Qt 5.9）中引入。

visibleItemCount : int

该属性存储滚动条中可见的项目数量。该数值必须为奇数，因为当前项目始终位于垂直居中位置。

wrap : bool [since QtQuick.Controls 2.1 (Qt 5.8)]

此属性决定转盘在到达顶部或底部时是否循环。

当 `count ` 小于 `visibleItemCount` 时，默认值为 `false `，因为当项目数量较少时，与不自动换行的 Tumbler 交互更为简单。若要覆盖此行为，请显式设置此属性的值。若要恢复默认行为，请将此属性设置为 `undefined`。

该属性在 QtQuick.Controls 2.1（Qt 5.8）中引入。

附加属性文档

Tumbler.displacement : real [read-only attached]

此附加属性取值范围为-visibleItemCount / 2 至visibleItemCount / 2 ，表示该项距离成为当前项还有多远，其中0 表示完全当前。

例如，下方的项目在非当前项目时不透明度为 40%，当其成为当前项目时，不透明度将过渡到 100%：

delegate: Text {
    text: modelData
    opacity: 0.4 + Math.max(0, 1 - Math.abs(Tumbler.displacement)) * 0.6
}

Tumbler.tumbler : Tumbler [read-only attached]

此附加属性用于存储转盘。该属性可附加到转盘委托上。如果该项不是转盘委托，则其值为null 。

方法文档

[since QtQuick.Controls 2.5 (Qt 5.12)] void positionViewAtIndex(int index, PositionMode mode)

将视图定位至index 位于mode 所指定的位置。

例如：

positionViewAtIndex(10, Tumbler.Center)

如果wrap 为true（默认值），则PathView 的positionViewAtIndex()函数所支持的模式可用；否则，ListView 的positionViewAtIndex()函数所支持的模式可用。

该方法在 QtQuick.Controls 2.5（Qt 5.12）中引入。

另请参阅 currentIndex 。