ControlStateStyle QML Type

Décrit le style d'un contrôle dans un état donné. En savoir plus...

Ce type est en préversion technologique et est susceptible d'être modifié.

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

Propriétés

• checked : ControlStateStyle
• disabled : ControlStateStyle
• focused : ControlStateStyle
• highlighted : ControlStateStyle
• hovered : ControlStateStyle
• pressed : ControlStateStyle
• vertical : ControlStateStyle

Description détaillée

ControlStateStyle décrit le style d’un contrôle dans un état particulier. Une instance de type « ControlStyle » hérite de ControlStateStyle, puisqu’elle représente l’état normal: les propriétés définies directement sur une instance de type « ControlStyle » décrivent l’apparence du contrôle lorsqu’aucun autre état n’est actif. Les remplacements spécifiques à un état sont ensuite définis via des états imbriqués tels que « pressed », « hovered » et « checked ».

Les états imbriqués ne s’excluent pas mutuellement. Plusieurs états peuvent être actifs en même temps — par exemple, un bouton peut être à la fois survolé et enfoncé simultanément. Lorsque plusieurs états sont actifs, toutes les règles de remplacement correspondantes sont appliquées. Si la même propriété est définie dans plusieurs états actifs, les conflits sont résolus selon l’ordre de priorité suivant : pressed, hovered, highlighted, focused, checked, vertical. Ainsi, par exemple, pressed.background.color l’emporte sur checked.background.color si le contrôle est à la fois pressed et checked.

L’état « disabled » constitue une exception : il est impossible d’interagir avec un contrôle désactivé ; par conséquent, les états « pressed », « hovered », « highlighted » et « focused » ne s’appliquent pas. Cependant, « disabled » peut toujours être combiné avec des états tels que « checked » et « vertical ».

Plus un état est imbriqué en profondeur, plus il est qualifié. Par exemple, hovered.pressed.background.color a priorité sur hovered.background.color lorsque hovered et pressed sont tous deux actifs. L’ordre d’imbrication n’a pas d’importance : hovered.pressed et pressed.hovered sont équivalents. Cependant, si les deux formes sont utilisées simultanément, celle qui l’emporte n’est pas définie.

Un imbrication plus profonde des états peut également être utilisée pour résoudre les conflits. Si la même propriété est définie à la fois dans hovered et checked, l’ordre de priorité fait que la valeur de hovered prévaut. Si vous préférez que la valeur « checked » prévale, ou si vous souhaitez utiliser une valeur totalement différente dans cette situation, vous pouvez redéfinir la propriété dans hovered.checked, qui prendra alors le pas sur les deux autres.

L'extrait de code suivant montre comment appliquer un style différent à un bouton en fonction de son état :

button {
    text.color: "white"
    background.color: "cornflowerblue"

    pressed.background.color: "cadetblue"
    hovered.background.color: "dodgerblue"
    highlighted.background.color: "lightblue"
    focused.background.color: "lightskyblue"
    checked.background.color: "darkseagreen"
    disabled.background.color: "gray"

    // hovered.checked takes precedence over both hovered and checked
    hovered.checked.background.color: "mediumseagreen"

    hovered.checked {
        // Nested states are grouped properties, so you can use the compact
        // per-property form above, or structure them hierarchically for
        // better readability. Both forms are functionally equivalent.
        pressed {
            // hovered.checked.pressed takes precedence over hovered.checked
            background {
                color: "mediumaquamarine"
                scale: 0.95
            }
            text {
                bold: true
            }
        }
    }
}

Voir également ControlStyle, DelegateStyle, Résolution des propriétés StyleKit et Référence FallbackStyle.

Documentation sur les propriétés

checked : ControlStateStyle

Les règles de style prioritaires sont appliquées lorsque le contrôle est de type « checked ».

Voir également pressed, hovered, highlighted, focused, vertical, disabled et StyleReader.checked.

disabled : ControlStateStyle

Les règles de style prioritaires s'appliquent lorsque le contrôle est désactivé.

Un contrôle désactivé ne peut pas faire l'objet d'une interaction ; par conséquent, les propriétés pressed, hovered, highlighted et focused ne seront pas appliquées en même temps que la désactivation.

Voir également pressed, hovered, highlighted, focused, checked, vertical et StyleReader.enabled.

focused : ControlStateStyle

Les règles de style prioritaires sont appliquées lorsque le contrôle est en mode « focused ».

Voir également pressed, hovered, highlighted, checked, vertical, disabled et StyleReader.focused.

highlighted : ControlStateStyle

Les règles de style prioritaires sont appliquées lorsque le contrôle est de type « highlighted ».

Voir également pressed, hovered, focused, checked, vertical, disabled et StyleReader.highlighted.

hovered : ControlStateStyle

Les règles de style prioritaires s'appliquent lorsque le contrôle est de type « hovered ».

Voir également pressed, highlighted, focused, checked, vertical, disabled et StyleReader.hovered.

pressed : ControlStateStyle

Les règles de style prioritaires sont appliquées lorsque le contrôle est de type « pressed ».

Voir également hovered, highlighted, focused, checked, vertical, disabled et StyleReader.pressed.

vertical : ControlStateStyle

Les règles de style prioritaires s'appliquent lorsque le contrôle est en mode « vertical » (par exemple, une liste verticale Slider ou ScrollBar).

Voir également pressed, hovered, highlighted, focused, checked, disabled et StyleReader.vertical.