유니버설 스타일

유니버설 스타일은 Microsoft 유니버설 디자인 가이드라인을 기반으로 합니다. 자세히...

임포트 문: import QtQuick.Controls.Universal 2.12
이후: Qt 5.7

첨부된 속성

첨부 메서드

  • 색상 색상(미리 정의된 열거형)

상세 설명

유니버설 스타일은 Microsoft 유니버설 디자인 가이드라인에 기반한 장치에 구애받지 않는 스타일입니다. 유니버설 스타일은 휴대폰, 태블릿, PC 등 모든 디바이스에서 잘 보이도록 디자인되었습니다.

유니버설 스타일의 밝은 테마.

유니버설 스타일의 어두운 테마.

유니버설 스타일로 애플리케이션을 실행하려면 Qt Quick Controls 에서 스타일 사용을 참조하세요.

참고: 유니버설 스타일은 기본 Windows 10 스타일이 아닙니다. 유니버설 스타일은 Microsoft 유니버설 디자인 가이드라인을 따르는 100% 크로스 플랫폼 Qt Quick Controls 스타일 구현입니다. 이 스타일은 모든 플랫폼에서 실행되며 모든 곳에서 어느 정도 동일하게 보입니다. 사용 가능한 시스템 글꼴 및 글꼴 렌더링 엔진의 차이로 인해 사소한 차이가 발생할 수 있습니다.

사용자 지정

유니버설 스타일에서는 테마, 액센트, 전경, 배경의 네 가지 속성을 사용자 지정할 수 있습니다.

두 속성은 모든 창 또는 항목에 지정할 수 있으며 fonts 과 같은 방식으로 하위 항목에 자동으로 전파됩니다. 다음 예에서는 창과 세 개의 라디오 버튼이 모두 보라색 강조색을 사용하여 어두운 테마로 표시됩니다:

import QtQuick 2.12
import QtQuick.Controls 2.12
import QtQuick.Controls.Universal 2.12

ApplicationWindow {
    visible: true

    Universal.theme: Universal.Dark
    Universal.accent: Universal.Violet

    Column {
        anchors.centerIn: parent

        RadioButton { text: qsTr("Small") }
        RadioButton { text: qsTr("Medium");  checked: true }
        RadioButton { text: qsTr("Large") }
    }
}

QML에서 속성을 지정하는 것 외에도 환경 변수나 구성 파일을 통해 속성을 지정할 수도 있습니다. QML에 지정된 속성은 다른 모든 방법보다 우선합니다.

구성 파일

변수설명
Theme기본 유니버설 테마를 지정합니다. 값은 사용 가능한 테마 중 하나(예: "Dark")일 수 있습니다.
Accent기본 유니버설 강조 색상을 지정합니다. 값은 color 일 수 있지만 미리 정의된 유니버설 색상 중 하나를 사용하는 것이 좋습니다(예: "Violet").
Foreground기본 범용 전경색을 지정합니다. 값은 color 또는 사전 정의된 범용 색상 중 하나(예: "Brown")를 사용할 수 있습니다.
Background기본 범용 배경색을 지정합니다. 값은 color 또는 사전 정의된 범용 색상 중 하나(예: "Steel")일 수 있습니다.

구성 파일에 대한 자세한 내용은 Qt Quick Controls 구성 파일을 참조하세요.

환경 변수

변수설명
QT_QUICK_CONTROLS_UNIVERSAL_THEME기본 유니버설 테마를 지정합니다. 값은 사용 가능한 테마 중 하나(예: "Dark")일 수 있습니다.
QT_QUICK_CONTROLS_UNIVERSAL_ACCENT기본 유니버설 강조 색상을 지정합니다. 값은 color 일 수 있지만 미리 정의된 유니버설 색상 중 하나를 사용하는 것이 좋습니다(예: "Violet").
QT_QUICK_CONTROLS_UNIVERSAL_FOREGROUND기본 범용 전경색을 지정합니다. 값은 color 또는 사전 정의된 범용 색상 중 하나(예: "Brown")를 사용할 수 있습니다.
QT_QUICK_CONTROLS_UNIVERSAL_BACKGROUND기본 범용 배경색을 지정합니다. 값은 color 또는 사전 정의된 범용 색상 중 하나(예: "Steel")일 수 있습니다.

지원되는 환경 변수의 전체 목록은 Qt Quick Controls 에서 지원되는 환경 변수를 참조하세요.

종속성

유니버설 스타일에 특정한 속성에 액세스하려면 유니버설 스타일을 별도로 가져와야 합니다. 유니버설 스타일에 대한 참조와 관계없이 동일한 애플리케이션 코드가 다른 스타일에서도 실행된다는 점에 유의하세요. 유니버설 전용 속성은 애플리케이션이 유니버설 스타일로 실행될 때만 적용됩니다.

항상 로드되는 QML 파일에서 유니버설 스타일을 가져오는 경우, 애플리케이션이 어떤 스타일로 실행되는지에 관계없이 애플리케이션을 실행할 수 있으려면 유니버설 스타일을 애플리케이션과 함께 배포해야 합니다. 파일 선택기를 사용하면 스타일에 대한 하드 종속성을 만들지 않고 스타일별 조정을 적용할 수 있습니다.

사전 정의된 유니버설 색상

사전 정의된 색상을 사용할 수 있습니다:

상수설명
Universal.Lime
#A4C400
Universal.Green
#60A917
Universal.Emerald
#008A00
Universal.Teal
#00ABA9
Universal.Cyan
#1BA1E2
Universal.Cobalt
#3E65FF(기본 악센트)
Universal.Indigo
#6A00FF
Universal.Violet
#AA00FF
Universal.Pink
#F472D0
Universal.Magenta
#D80073
Universal.Crimson
#A20025
Universal.Red
#E51400
Universal.Orange
#FA6800
Universal.Amber
#F0A30A
Universal.Yellow
#E3C800
Universal.Brown
#825A2C
Universal.Olive
#6D8764
Universal.Steel
#647687
Universal.Mauve
#76608A
Universal.Taupe
#87794E

기본 스타일, 머티리얼 스타일참조

첨부된 프로퍼티 문서

유니버설.액센트: 색상

이 첨부 속성은 테마의 강조 색상을 보유합니다. 이 속성은 모든 창이나 항목에 첨부할 수 있습니다. 이 값은 자식에게 전파됩니다.

기본값은 Universal.Cobalt 입니다.

다음 예제에서는 강조 표시된 버튼의 강조 색상이 Universal.Orange 로 변경됩니다:

Button {
    text: qsTr("Button")
    highlighted: true
    Universal.accent: Universal.Orange
}

참고: 강조 색상은 color 을 사용할 수 있지만, 나머지 유니버설 스타일 팔레트와 잘 어울리도록 디자인된 미리 정의된 유니버설 색상 중 하나를 사용하는 것이 좋습니다.


유니버설.배경: 색상

이 첨부 속성은 테마의 배경색을 보유합니다. 이 속성은 모든 창이나 항목에 첨부할 수 있습니다. 이 값은 자식에게 전파됩니다.

기본값은 테마별(밝음 또는 어두움)입니다.

다음 예에서는 창의 배경색이 Universal.Steel 으로 변경됩니다:

Pane {
    Universal.background: Universal.Steel

    Button {
        text: qsTr("Button")
    }
}


유니버설.전경: 색상

이 첨부된 속성은 테마의 전경색을 보유합니다. 이 속성은 모든 창이나 항목에 첨부할 수 있습니다. 이 값은 자식에게 전파됩니다.

기본값은 테마별(밝음 또는 어두움)입니다.

다음 예제에서는 버튼의 전경색이 Universal.Pink 으로 설정되어 있습니다:

Button {
    text: qsTr("Button")
    Universal.foreground: Universal.Pink
}

Universal.theme: 열거형

이 첨부된 속성은 테마가 밝은지 어두운지를 보유합니다. 이 속성은 모든 창이나 항목에 첨부할 수 있습니다. 이 값은 자식에게 전파됩니다.

사용 가능한 테마:

상수설명
Universal.Light밝은 테마(기본값)
Universal.Dark어두운 테마
Universal.System시스템 테마

테마를 System 로 설정하면 시스템 테마 색상에 따라 밝은 테마 또는 어두운 테마가 선택됩니다. 그러나 테마 속성 값을 읽을 때 값은 System 이 아니라 실제 테마가 됩니다.

다음 예에서는 창과 버튼의 테마가 모두 Universal.Dark 으로 설정되어 있습니다:

Pane {
    Universal.theme: Universal.Dark

    Button {
        text: qsTr("Button")
    }
}


첨부된 메서드 문서

색상 색상( 미리 정의된열거형 )

이 첨부 메서드는 지정된 미리 정의된 유니버설 색의 유효 색 값을 반환합니다.

Rectangle {
    color: Universal.color(Universal.Red)
}

© 2025 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.