Tumbler QML Type

Roue rotative permettant de sélectionner des éléments. En savoir plus...

• Liste de tous les membres, y compris les membres hérités

Propriétés

• 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))

Propriétés associées

• displacement : real
• tumbler : Tumbler

Méthodes

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

Description détaillée

Tumbler {
    model: 5
    // ...
}

Tumbler permet à l'utilisateur de sélectionner une option parmi une « roue » d'éléments pouvant être fait tourner. Il est utile lorsque le nombre d'options est trop important pour utiliser, par exemple, une liste déroulante ( RadioButton), mais trop faible pour nécessiter l'utilisation d'un champ modifiable ( SpinBox). Il est pratique car il ne nécessite aucune utilisation du clavier et effectue une boucle à chaque extrémité lorsqu'il y a un grand nombre d'éléments.

L’API est similaire à celle de vues telles que ListView et PathView; il est possible de définir une model et une delegate, et les propriétés count et currentItem fournissent un accès en lecture seule aux informations relatives à la vue. Pour positionner la vue à un certain index, utilisez positionViewAtIndex().

Contrairement à des vues telles que PathView et ListView, il existe toutefois toujours un élément actuel (lorsque le modèle n’est pas vide). Cela signifie que lorsque count est égal à 0, currentIndex sera égal à -1. Dans tous les autres cas, il sera supérieur ou égal à 0.

Par défaut, Tumbler wraps lorsqu'il atteint le haut et le bas, tant qu'il y a plus d'éléments dans le modèle que d'éléments visibles ; c'est-à-dire lorsque count est supérieur à 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
            }
        }
    }
}

Voir également Personnalisation de Tumbler et des contrôles de saisie.

Documentation sur les propriétés

count : int [read-only]

Cette propriété contient le nombre d'éléments du modèle.

currentIndex : int

Cette propriété contient l'index de l'élément actuel.

La valeur de cette propriété est -1 lorsque count est égal à 0. Dans tous les autres cas, elle sera supérieure ou égale à 0.

Voir également currentItem et positionViewAtIndex().

currentItem : Item [read-only]

Cette propriété contient l'élément situé à l'index actuel.

Voir également currentIndex et positionViewAtIndex().

delegate : Component

Cette propriété contient le délégué utilisé pour afficher chaque élément.

Tumbler ne prend pas possession du délégué.

flickDeceleration : int

Cette propriété définit la vitesse à laquelle un mouvement rapide va ralentir : plus la valeur est élevée, plus le mouvement ralentit rapidement lorsque l'utilisateur cesse de le faire par effleurement. Par exemple, la valeur « 0.0001 » correspond à un mouvement presque « sans frottement », tandis que « 10000 » donne une sensation assez « collante ».

Lorsque wrap est défini sur true (valeur par défaut), la valeur par défaut de flickDeceleration est 100. Sinon, elle dépend de la plateforme. Pour remplacer ce comportement, définissez explicitement la valeur de cette propriété. Pour revenir au comportement par défaut, définissez cette propriété sur undefined. Les valeurs égales ou inférieures à zéro ne sont pas autorisées.

model : variant

Cette propriété contient le modèle qui fournit les données pour ce gobelet.

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

Cette propriété indique si le gobelet est actuellement en mouvement, que ce soit parce que l'utilisateur le fait glisser ou le fait basculer d'un geste rapide.

Cette propriété a été introduite dans QtQuick.Controls 2.2 (Qt 5.9).

visibleItemCount : int

Cette propriété indique le nombre d'éléments visibles dans le « tumbler ». Il doit s'agir d'un nombre impair, car l'élément actuel est toujours centré verticalement.

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

Cette propriété détermine si le tambour effectue une boucle lorsqu'il atteint le haut ou le bas.

La valeur par défaut est « false » lorsque « count » est inférieur à « visibleItemCount », car il est plus simple d’interagir avec un Tumbler sans retour à la ligne lorsqu’il ne contient que quelques éléments. Pour remplacer ce comportement, définissez explicitement la valeur de cette propriété. Pour revenir au comportement par défaut, définissez cette propriété sur « undefined ».

Cette propriété a été introduite dans QtQuick.Controls 2.1 (Qt 5.8).

Documentation sur les propriétés associées

Tumbler.displacement : real [read-only attached]

Cette propriété associée prend une valeur comprise entre -visibleItemCount / 2 et visibleItemCount / 2, qui indique dans quelle mesure cet élément est éloigné du statut d'élément actif, 0 correspondant à un élément entièrement actif.

Par exemple, l'élément ci-dessous sera opaque à 40 % lorsqu'il ne sera pas l'élément actif, puis passera à une opacité de 100 % lorsqu'il deviendra l'élément actif :

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

Tumbler.tumbler : Tumbler [read-only attached]

Cette propriété associée contient le tumbler. Elle peut être associée à un délégué tumbler. La valeur est « null » si l'élément n'est pas un délégué tumbler.

Documentation de la méthode

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

Positionne la vue de manière à ce que l'index e se trouve à l'emplacement spécifié par mode.

Par exemple :

positionViewAtIndex(10, Tumbler.Center)

Si wrap est vrai (valeur par défaut), les modes disponibles pour la fonction positionViewAtIndex() de PathView sont disponibles ; sinon, ce sont les modes disponibles pour la fonction positionViewAtIndex() de ListView qui sont disponibles.

Cette méthode a été introduite dans QtQuick.Controls 2.5 (Qt 5.12).

Voir également currentIndex.