旋钮 QML 类型

可选择的项的旋转“轮”,更多...

导入语句import QtQuick.Controls
继承

Control

属性

附加属性

方法

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

详细信息

Tumbler {
    model: 5
    // ...
}

旋钮允许用户从一个可旋转的“轮”中选择一个选项。当选项太多而不能使用例如单选按钮时,或者选项太少而需要使用可编辑的微调框时,它非常有用。它方便的是它不需要键盘和当项数很多时在两端回绕。

API 类似于如 ListViewPathView 这样的视图;可以设置一个 modeldelegate,而 countcurrentItem 属性提供了对视图信息的只读访问。要定位视图到某个索引,使用 positionViewAtIndex

然而,与 PathViewListView 这样的视图不同,始终有一个当前项(当模型不为空时)。这意味着当 count 等于 0 时,currentIndex 将为 -1。在其他所有情况下,将大于或等于 0

默认情况下,Tumbler 在达到顶部和底部时会自动换行,前提是模型中的项目数量大于可视项目数量;也就是说,当 count 大于 visibleItemCount

import QtQuick
import QtQuick.Window
import QtQuick.Controls

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

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

    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
        }
    }

    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 [只读]

此属性包含模型中的项目数量。


currentIndex : int

此属性包含当前项目的索引。

count 等于 0 时,此属性的值是 -1。在其他所有情况下,它将大于或等于 0

也请参阅 currentItempositionViewAtIndex()。


currentItem : Item [只读]

此属性包含当前索引处的项目。

也请参阅 currentIndexpositionViewAtIndex()。


delegate : Component

此属性包含用于显示每个项目的代理。


model : variant

此属性包含为该 Tumbler 提供数据的模型。


moving : bool [自 QtQuick.Controls 2.2 (Qt 5.9) 以来]

此属性描述了 Tumbler 是否由于用户拖动或轻扫而导致当前正在移动。

此属性自 QtQuick.Controls 2.2 (Qt 5.9) 开始引入。


visibleItemCount : int

此属性包含 Tumbler 中可见的项目数量。它必须是奇数,因为当前项目始终垂直居中。


wrap : bool [自 QtQuick.Controls 2.1 (Qt 5.8) 以来]

此属性确定 Tumbler 在达到顶部或底部时是否换行。

count 小于 visibleItemCount 时,默认值为 false,因为当项目较少时与未换行的 Tumbler 交互更为简单。要覆盖这种行为,请显式设置此属性的值。要返回默认行为,将此属性设置为 undefined

此属性自 QtQuick.Controls 2.1 (Qt 5.8) 开始引入。


附加属性文档

Tumbler.displacement : real [只读]

此附加属性包含从 -visibleItemCount / 2visibleItemCount / 2 的值,它表示该项目与当前项目的距离,其中 0 表示完全当前。

例如,当项目不是当前项目时,下面的项目将具有 40% 的不透明度,当它成为当前项目时,过渡到 100% 透明度

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

Tumbler.tumbler : Tumbler [只读]

此附加属性包含 tumbler。该属性可以附加到 tumbler 代理。如果项目不是 tumbler 代理,则值是 null


方法文档

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

将视图置于指定的位置,使得 index 位于 mode 指定的位置。

例如

positionViewAtIndex(10, Tumbler.Center)

如果 wrap 设置为 true(默认值),则 PathViewpositionViewAtIndex() 函数可用的模式可用,否则 ListViewpositionViewAtIndex() 函数可用的模式可用。

注意: 已知限制:当 wrap 设置为 true 时,使用 Tumbler.Beginning 将会导致在视图顶部的项位置错误。作为 workaround,请传递 index - 1

此方法自 QtQuick.Controls 2.5 (Qt 5.12) 起引入。

另请参阅 currentIndex


© 2024 The Qt Company Ltd. 本文档中包含的文档贡献是各自所有者的版权。本提供的文档根据 Free Software Foundation 发布的 GNU Free Documentation License version 1.3 的条款许可。Qt 及其相应标志是 The Qt Company Ltd. 在芬兰以及全球其他国家的商标。所有其他商标均为各自所有者的财产。