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항목도 참조하십시오 .