Universal-Stil

Der Universal Style basiert auf den Microsoft Universal Design Guidelines. Mehr...

Angehängte Eigenschaften

• accent: Farbe
• Hintergrund: Farbe
• foreground: Farbe
• Thema: Aufzählung

Angehängte Methoden

• color color(Aufzählung vordefiniert)

Detaillierte Beschreibung

Der Universal-Stil ist ein geräteunabhängiger Stil, der auf den Microsoft Universal Design Guidelines basiert. Der Universal-Stil wurde entwickelt, um auf allen Geräten gut auszusehen, von Telefonen und Tablets bis hin zu PCs.

Um eine Anwendung mit dem Universal-Stil auszuführen, siehe Verwenden von Stilen in Qt Quick Controls.

Anpassungen

Der Universal-Stil ermöglicht die Anpassung von vier Attributen: Thema, Akzent, Vordergrund und Hintergrund.

Beide Attribute können für jedes beliebige Fenster oder Element festgelegt werden und werden automatisch auf die untergeordneten Elemente übertragen, wie dies auch bei fonts der Fall ist. Im folgenden Beispiel erscheinen das Fenster und alle drei Optionsfelder im dunklen Design mit einer violetten Akzentfarbe:

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

Neben der Angabe der Attribute in QML ist es auch möglich, sie über Umgebungsvariablen oder in einer Konfigurationsdatei festzulegen. In QML angegebene Attribute haben Vorrang vor allen anderen Methoden.

Konfigurationsdatei

Weitere Informationen zur Konfigurationsdatei finden Sie unter Qt Quick Controls Konfigurationsdatei.

Umgebungsvariablen

Eine vollständige Liste der unterstützten Umgebungsvariablen finden Sie unter Unterstützte Umgebungsvariablen in Qt Quick Controls.

Abhängigkeit

Der Universal-Stil muss separat importiert werden, um Zugriff auf die Attribute zu erhalten, die für den Universal-Stil spezifisch sind. Es ist zu beachten, dass unabhängig von den Verweisen auf den Universal-Stil derselbe Anwendungscode mit jedem anderen Stil ausgeführt werden kann. Universal-spezifische Attribute wirken sich nur aus, wenn die Anwendung mit dem Universal-Stil ausgeführt wird.

Wenn der Universal-Stil in eine QML-Datei importiert wird, die immer geladen wird, muss der Universal-Stil mit der Anwendung bereitgestellt werden, damit die Anwendung unabhängig davon ausgeführt werden kann, mit welchem Stil die Anwendung ausgeführt wird. Durch die Verwendung von Datei-Selektoren können stil-spezifische Anpassungen vorgenommen werden, ohne eine feste Abhängigkeit von einem Stil zu schaffen.

Vordefinierte Universal-Farben

Verfügbare vordefinierte Farben:

Siehe auch Basic Style, Material Style

Dokumentation der angehängten Eigenschaft

Diese angehängte Eigenschaft enthält die Akzentfarbe des Themas. Die Eigenschaft kann an jedes Fenster oder Element angehängt werden. Der Wert wird an die untergeordneten Elemente weitergegeben.

Der Standardwert ist Universal.Cobalt.

Im folgenden Beispiel wird die Akzentfarbe der hervorgehobenen Schaltfläche in Universal.Orange geändert:

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

Diese angehängte Eigenschaft enthält die Hintergrundfarbe des Themas. Die Eigenschaft kann an jedes Fenster oder Element angehängt werden. Der Wert wird an die untergeordneten Elemente weitergegeben.

Der Standardwert ist themenspezifisch (hell oder dunkel).

Im folgenden Beispiel wird die Hintergrundfarbe des Fensters in Universal.Steel geändert:

Pane {
    Universal.background: Universal.Steel

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

Diese angehängte Eigenschaft enthält die Vordergrundfarbe des Themas. Die Eigenschaft kann an jedes Fenster oder Element angehängt werden. Der Wert wird an die untergeordneten Elemente weitergegeben.

Der Standardwert ist themenspezifisch (hell oder dunkel).

Im folgenden Beispiel wird die Vordergrundfarbe der Schaltfläche auf Universal.Pink festgelegt:

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

Diese angehängte Eigenschaft gibt an, ob das Thema hell oder dunkel ist. Die Eigenschaft kann an jedes Fenster oder Element angehängt werden. Der Wert wird an Kinder weitergegeben.

Verfügbare Themen:

Wenn Sie das Thema auf System setzen, wird entweder das helle oder das dunkle Thema basierend auf den Farben des Systemthemas ausgewählt. Beim Auslesen des Wertes der Eigenschaft theme wird jedoch nie der Wert System, sondern das tatsächliche Thema angezeigt.

Im folgenden Beispiel ist das Thema sowohl für den Bereich als auch für die Schaltfläche auf Universal.Dark eingestellt:

Pane {
    Universal.theme: Universal.Dark

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

Dokumentation der angehängten Methode

Diese angehängte Methode gibt den effektiven Farbwert der angegebenen vordefinierten Universalfarbe zurück.

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

Verwandte Informationen

• Gestalten Qt Quick Controls