이 페이지에서

Theme QML Type

색 구성표에 대한 색상 및 스타일 오버라이드를 정의합니다. 더 보기...

Import Statement: import Qt.labs.StyleKit
Inherits:

AbstractStyle

상세 설명

테마는 특정 색 구성표에 대해 뚜렷한 시각적 모양을 제공하기 위해 Style 에 정의된 속성을 재정의합니다. 스타일은 일반적으로 암시적 크기, 패딩 및 반경과 같은 구조적 속성을 구성하는 반면 테마는 색상, 그림자 및 기타 시각적 속성을 지정합니다. 그러나 이는 제한이 아니며 테마는 스타일이 설정할 수 있는 모든 속성을 재정의할 수 있습니다.

스타일은 lightdark 테마를 제공할 수 있습니다. themeName"System" (기본값)으로 설정된 경우 활성 테마는 operating system's color scheme 를 따릅니다. 런타임에 CustomThemeswitch between them 를 사용하여 추가 테마를 만들 수도 있습니다.

테마에 설정되지 않은 속성은 Style 에 정의된 속성으로 돌아갑니다.

다음 예에서는 밝게, 어둡게 및 고대비 테마를 정의하여 각각 컨트롤에 서로 다른 색상을 제공합니다:

Style {
    light: Theme {
        control {
            text.color: "#202020"
            background.color: "#f0f0f0"
            background.border.color: "#d0d0d0"
            background.shadow.color: "#c0c0c0"
            hovered.background.color: "#e0e0e0"
        }
        applicationWindow.background.color: "gainsboro"
        button.hovered.background.color: "#4a90d9"
        radioButton.indicator.foreground.color: "#d0d0d0"
        switchControl.indicator.foreground.color: "lightslategray"
        switchControl.handle.color: "white"
    }

    dark: Theme {
        control {
            text.color: "#e0e0e0"
            background.color: "#404040"
            background.border.color: "#606060"
            background.shadow.color: "#222222"
            hovered.background.color: "#505050"
        }
        applicationWindow.background.color: "#2b2b2b"
        button.hovered.background.color: "#6ab0f9"
        radioButton.indicator.foreground.color: "#606060"
        switchControl.indicator.foreground.color: "#505050"
        switchControl.handle.color: "#808080"
    }

    CustomTheme {
        name: "HighContrast"
        theme: Theme {
            control {
                text.color: "black"
                text.bold: true
                background.color: "white"
                background.border.color: "black"
                background.border.width: 3
                background.shadow.visible: false
                hovered.background.border.width: 5
            }
            applicationWindow.background.color: "white"
            itemDelegate.hovered.text.color: "white"
            itemDelegate.hovered.background.color: "black"
            itemDelegate.background.border.width: 0
            button.hovered.background.color: "black"
            button.hovered.text.color: "white"
            radioButton.indicator.foreground.color: "white"
            radioButton.checked.indicator.foreground.color: "black"
            switchControl.indicator.foreground.color: "white"
            switchControl.handle.color: "white"
            switchControl.handle.border.color: "black"
            switchControl.handle.border.width: 2
            switchControl.checked.handle.color: "black"
        }
    }
}

테마가 실제로 작동하는 전체 예제를 보려면 StyleKit 예제를 참조하십시오.

참고: Qt.labs 모듈의 유형은 향후 버전에서 호환성이 유지된다는 보장이 없습니다.

StyleCustomTheme참조하세요 .

© 2026 The Qt Company Ltd. Documentation contributions included herein are the copyrights of their respective owners. The documentation provided herein is licensed under the terms of the GNU Free Documentation License version 1.3 as published by the Free Software Foundation. Qt and respective logos are trademarks of The Qt Company Ltd. in Finland and/or other countries worldwide. All other trademarks are property of their respective owners.