ControlStateStyle QML Type

指定された状態でのコントロールのスタイルを記述します。詳細...

• 継承されたメンバを含む、すべてのメンバの一覧

プロパティ

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

詳細説明

ControlStateStyle は、特定の状態におけるコントロールのスタイルを記述します。ControlStyle は、通常の状態を表すため、ControlStateStyle を継承します。ControlStyle に直接設定されたプロパティは、他の状態がアクティブでないときにコントロールがどのように見えるかを記述します。状態固有のオーバーライドは、pressed 、hovered 、checked などの入れ子状態によって設定されます。

ネストされた状態は相互に排他的ではありません。複数の状態を同時にアクティブにすることができます。例えば、ボタンはホバーされた状態と押された状態の両方を同時にアクティブにすることができます。複数のステートがアクティブな場合、一致するすべてのステートのオーバーライドが適用されます。同じプロパティが複数のアクティブなステートに設定されている場合、競合は次の優先順位を使用して解決されます：pressed hovered,highlighted,focused,checked,vertical 。したがって、たとえばコントロールがpressed とchecked の両方である場合、pressed.background.color がchecked.background.color より優先されます。

disabled 状態は例外である。無効化されたコントロールは対話できないので、pressed 、hovered 、highlighted 、focused 状態は適用されない。しかし、disabled は、checked やvertical のような状態と組み合わせることができます。

状態が深くネストされているほど、その資格は高くなる。たとえば、hovered とpressed の両方がアクティブな場合、hovered.pressed.background.color はhovered.background.color より優先される。入れ子の順序は問題ではない。hovered.pressed とpressed.hovered は等価である。しかし、両方のフォームが同時に使用された場合、どちらが勝つかは未定義である。

状態のより深い入れ子は、競合を解決するために使用することもできる。hovered とchecked の両方に同じプロパティが設定されている場合、優先順位はhovered の値が勝つことを意味します。チェックされた値を優先したい場合、またはそのような状況でまったく異なる値を使用したい場合は、hovered.checked のプロパティをオーバーライドすることができます。

次のスニペットは、ボタンの状態によってスタイルを変える方法を示しています：

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

ControlStyle,DelegateStyle,FallbackStyle Referenceも参照してください 。

プロパティのドキュメント

checked : ControlStateStyle

コントロールがchecked のときに適用されるスタイル・オーバーライド。

pressed,hovered,highlighted,focused,vertical,disabled,StyleReader.checkedも参照してください 。

disabled : ControlStateStyle

コントロールが無効なときに適用されるスタイル・オーバーライド。

無効化されたコントロールは操作できないため、pressed 、hovered 、highlighted 、focused は無効化と同時に適用されません。

pressed,hovered,highlighted,focused,checked,vertical, StyleReader.disabledも参照してください 。

focused : ControlStateStyle

コントロールがfocused のときに適用されるスタイル・オーバーライド。

pressed,hovered,highlighted,checked,vertical,disabled,StyleReader.focusedも参照してください 。

highlighted : ControlStateStyle

コントロールがhighlighted のときに適用されるスタイル・オーバーライド。

pressed,hovered,focused,checked,vertical,disabled,StyleReader.highlightedも参照してください 。

hovered : ControlStateStyle

コントロールがhovered のときに適用されるスタイル・オーバーライド。

pressed,highlighted,focused,checked,vertical,disabled,StyleReader.hoveredも参照してください 。

pressed : ControlStateStyle

コントロールがpressed のときに適用されるスタイル・オーバーライド。

hovered,highlighted,focused,checked,vertical,disabled,StyleReader.pressedも参照してください 。

vertical : ControlStateStyle

コントロールがvertical の場合に適用されるスタイルオーバーライド（例：縦書きSlider またはScrollBar ）。

pressed,hovered,highlighted,focused,checked,disabled,StyleReader.verticalも参照してください 。