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 中的值将占上风。如果你希望 checked 状态下的值占上风，或者在这种情况下使用完全不同的值，可以在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 、StyleKit 属性解析以及FallbackStyle 参考文档。

属性文档

checked : ControlStateStyle

当控件处于checked 状态时，将应用样式覆盖。

另请参阅 pressed 、hovered 、highlighted 、focused 、vertical 、disabled 以及StyleReader.checked 。

disabled : ControlStateStyle

当控件被禁用时，将应用样式覆盖。

禁用状态的控件无法进行交互，因此pressed 、hovered 、highlighted 和focused 不会在控件处于禁用状态时同时应用。

另请参阅 pressed 、hovered 、highlighted 、focused 、checked 、vertical 以及StyleReader.enabled 。

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 。