Auf dieser Seite

Tumbler QML Type

Drehbares Rad mit auswählbaren Elementen. Mehr...

Import Statement: import QtQuick.Controls
Inherits:

Control

Eigenschaften

Beigefügte Eigenschaften

Methoden

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

Detaillierte Beschreibung

Tumbler {
    model: 5
    // ...
}

Tumbler ermöglicht es dem Benutzer, eine Option aus einem drehbaren "Rad" von Elementen auszuwählen. Es ist nützlich, wenn es zu viele Optionen gibt, um z. B. ein RadioButton zu verwenden, und zu wenige Optionen, um die Verwendung eines editierbaren SpinBox zu erfordern. Es ist insofern praktisch, als es keine Tastaturbedienung erfordert und bei einer großen Anzahl von Einträgen an jedem Ende umbricht.

Die API ähnelt der von Ansichten wie ListView und PathView; es können model und delegate gesetzt werden, und die Eigenschaften count und currentItem bieten einen Nur-Lese-Zugriff auf Informationen über die Ansicht. Um die Ansicht bei einem bestimmten Index zu positionieren, verwenden Sie positionViewAtIndex().

Im Gegensatz zu Ansichten wie PathView und ListView gibt es jedoch immer ein aktuelles Element (wenn das Modell nicht leer ist). Das heißt, wenn count gleich 0 ist, wird currentIndex zu -1. In allen anderen Fällen wird es größer oder gleich 0 sein.

Standardmäßig gibt Tumbler wraps ein, wenn es den oberen und unteren Rand des Modells erreicht, solange es mehr Elemente im Modell gibt als sichtbare Elemente, d.h. wenn count größer als visibleItemCount ist:

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

Siehe auch Anpassen von Tumbler und Input Controls.

Dokumentation der Eigenschaft

count : int [read-only]

Diese Eigenschaft enthält die Anzahl der Elemente im Modell.

currentIndex : int

Diese Eigenschaft enthält den Index des aktuellen Elements.

Der Wert dieser Eigenschaft ist -1, wenn count gleich 0 ist. In allen anderen Fällen ist er größer als oder gleich 0.

Siehe auch currentItem und positionViewAtIndex().

currentItem : Item [read-only]

Diese Eigenschaft enthält das Element mit dem aktuellen Index.

Siehe auch currentIndex und positionViewAtIndex().

delegate : Component

Diese Eigenschaft enthält den Delegaten, der verwendet wird, um jedes Element anzuzeigen.

Tumbler übernimmt keine Verantwortung für den Delegaten.

flickDeceleration : int

Diese Eigenschaft gibt die Geschwindigkeit an, mit der ein Schnippen verlangsamt wird: je höher die Zahl, desto schneller verlangsamt es sich, wenn der Benutzer das Schnippen durch Berührung beendet. Zum Beispiel ist 0.0001 fast "reibungslos", und 10000 fühlt sich ziemlich "klebrig" an.

Wenn wrap wahr ist (der Standardwert), ist die Standard-FlickDeceleration 100. Ansonsten ist sie plattformabhängig. Um dieses Verhalten außer Kraft zu setzen, setzen Sie explizit den Wert dieser Eigenschaft. Um zum Standardverhalten zurückzukehren, setzen Sie diese Eigenschaft auf undefiniert. Werte von Null oder weniger sind nicht zulässig.

model : variant

Diese Eigenschaft enthält das Modell, das die Daten für diesen Tumbler liefert.

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

Diese Eigenschaft beschreibt, ob sich der Tumbler gerade bewegt, weil der Benutzer ihn entweder zieht oder anklickt.

Diese Eigenschaft wurde in QtQuick.Controls 2.2 (Qt 5.9) eingeführt.

visibleItemCount : int

Diese Eigenschaft enthält die Anzahl der im Becher sichtbaren Elemente. Sie muss eine ungerade Zahl sein, da das aktuelle Element immer vertikal zentriert ist.

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

Diese Eigenschaft legt fest, ob der Tumbler umschlägt, wenn er den oberen oder unteren Rand erreicht.

Der Standardwert ist false, wenn count kleiner als visibleItemCount ist, da es einfacher ist, mit einem nicht umlaufenden Tumbler zu interagieren, wenn es nur ein paar Elemente gibt. Um dieses Verhalten außer Kraft zu setzen, setzen Sie explizit den Wert dieser Eigenschaft. Um zum Standardverhalten zurückzukehren, setzen Sie diese Eigenschaft auf undefined.

Diese Eigenschaft wurde in QtQuick.Controls 2.1 (Qt 5.8) eingeführt.

Dokumentation der Eigenschaft Attached

Tumbler.displacement : real [read-only]

Diese angehängte Eigenschaft enthält einen Wert von -visibleItemCount / 2 bis visibleItemCount / 2, der angibt, wie weit dieses Element davon entfernt ist, das aktuelle Element zu sein, wobei 0 vollständig aktuell ist.

Das folgende Element ist beispielsweise zu 40 % undurchsichtig, wenn es nicht das aktuelle Element ist, und wird zu 100 % undurchsichtig, wenn es das aktuelle Element wird:

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

Tumbler.tumbler : Tumbler [read-only]

Diese angehängte Eigenschaft enthält den Tumbler. Die Eigenschaft kann an einen Becher-Delegaten angehängt werden. Der Wert lautet null, wenn es sich bei dem Element nicht um einen Tumblr-Delegaten handelt.

Dokumentation der Methode

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

Positioniert die Ansicht so, dass sich die index an der durch mode angegebenen Position befindet.

Zum Beispiel:

positionViewAtIndex(10, Tumbler.Center)

Wenn wrap wahr ist (die Vorgabe), sind die Modi verfügbar, die für die Funktion PathView's positionViewAtIndex() verfügbar sind, andernfalls sind die Modi verfügbar, die für die Funktion ListView's positionViewAtIndex() verfügbar sind.

Hinweis: Es gibt die bekannte Einschränkung, dass die Verwendung von Tumbler.Beginning, wenn wrap gleich true ist, dazu führt, dass das falsche Element am oberen Rand der Ansicht positioniert wird. Um dies zu umgehen, übergeben Sie index - 1.

Diese Methode wurde in QtQuick.Controls 2.5 (Qt 5.12) eingeführt.

Siehe auch currentIndex.

© 2026 The Qt Company Ltd. Documentation contributions included herein are the copyrights of their respective owners. The documentation provided herein is licensed under the terms of the GNU Free Documentation License version 1.3 as published by the Free Software Foundation. Qt and respective logos are trademarks of The Qt Company Ltd. in Finland and/or other countries worldwide. All other trademarks are property of their respective owners.