Symbole in Qt Quick Controls

In „ Qt Quick Controls “ können Schaltflächen, Element-Delegaten und Menüelemente zusätzlich zu einer Textbeschriftung ein Symbol anzeigen.

Verwendung von Symbolen

AbstractButton und „ Action “ stellen die folgenden Eigenschaften bereit, über die Symbole festgelegt werden können:

• icon.name
• icon.source
• icon.width
• icon.height
• icon.color
• icon.cache

Theme-Symbole werden über einen Namen referenziert, reguläre Symbole über eine Quell-URL. Sowohl „ icon.name “ als auch „ icon.source “ können festgelegt werden, um sicherzustellen, dass immer ein Symbol gefunden wird. Wird das Symbol im Theme gefunden, wird es immer verwendet – auch wenn „ icon.source “ ebenfalls festgelegt ist. Wird das Symbol im Theme nicht gefunden, wird stattdessen „ icon.source “ verwendet.

Button {
    icon.name: "edit-cut"
    icon.source: "images/cut.png"
}

Jedes „Qt Quick Controls 2“-Design fordert gemäß seinen Richtlinien eine Standardgröße und -farbe für Symbole an, diese können jedoch durch die Einstellung der Eigenschaften „ icon.width “, „ icon.height “ und „ icon.color “ überschrieben werden.

Das Bild, das von einem Symbol geladen wird, dessen ` width ` und ` height ` nicht festgelegt sind, hängt vom verwendeten Symboltyp ab. Bei Design-Symbolen wird die am besten passende verfügbare Größe ausgewählt. Bei regulären Symbolen entspricht das Verhalten der Eigenschaft ` sourceSize ` von ` Image`.

Die Symbolfarbe wird standardmäßig so festgelegt, dass sie in verschiedenen Zuständen zur Textfarbe passt. Um ein Symbol mit den Originalfarben zu verwenden, setzen Sie die Farbe auf „ "transparent" “.

Button {
    icon.color: "transparent"
    icon.source: "images/logo.png"
}

Bei Schaltflächen kann die Eigenschaft „ display “ verwendet werden, um zu steuern, wie das Symbol und der Text innerhalb der Schaltfläche angezeigt werden.

Die Eigenschaft „ icon.cache “ steuert, ob das Symbolbild zwischengespeichert wird oder nicht. Weitere Informationen finden Sie unter cache.

Symbolthemen

Kompatible Icon-Themes müssen der Freedesktop-Spezifikation für Icon-Themes entsprechen, die hier abgerufen werden kann: http://standards.freedesktop.org/icon-theme-spec/icon-theme-spec-latest.html.

Traditionell unterstützen nur Linux und UNIX Icon-Themes auf Plattformebene, es ist jedoch möglich, ein konformes Icon-Theme in eine Anwendung zu integrieren, um themenbezogene Symbole auf jeder Plattform zu verwenden.

Die Standard- icon theme search paths en hängen von der Plattform ab. Unter Linux und UNIX wird für den Suchpfad die Umgebungsvariable ` XDG_DATA_DIRS ` verwendet, sofern diese verfügbar ist. Alle Plattformen verfügen als Fallback über das Ressourcenverzeichnis ` :/icons `. Benutzerdefinierte Suchpfade für Icon-Themes können mit ` QIcon::setThemeSearchPaths()` festgelegt werden.

Das folgende Beispiel bündelt ein Icon-Theme namens „mytheme“ mithilfe des Qt-Ressourcensystems in die Ressourcen der Anwendung.

<RCC>
    <qresource prefix="/">
        <file>icons/mytheme/index.theme</file>
        <file>icons/mytheme/32x32/myicon.png</file>
        <file>icons/mytheme/32x32@2/myicon.png</file>
    </qresource>
</RCC>

Die Datei „ index.theme “ beschreibt die allgemeinen Attribute des Icon-Themes und listet die verfügbaren Icon-Verzeichnisse des Themes auf:

[Icon Theme]
Name=mytheme
Comment=My Icon Theme

Directories=32x32,32x32@2

[32x32]
Size=32
Type=Fixed

[32x32@2]
Size=32
Scale=2
Type=Fixed

Um das eingebundene Icon-Theme zu verwenden, sollte eine Anwendung vor dem Laden der Haupt-QML-Datei die Funktion ` QIcon::setThemeName()` aufrufen:

#include <QGuiApplication>
#include <QQmlApplicationEngine>
#include <QIcon>

int main(int argc, char *argv[])
{
    QGuiApplication app(argc, argv);

    QIcon::setThemeName("mytheme"); // <--

    QQmlApplicationEngine engine;
    engine.load(QUrl(QStringLiteral("qrc:/main.qml")));
    return app.exec();
}

Nun ist es möglich, benannte Symbole aus dem gebündelten Icon-Theme zu verwenden, ohne eine Fallback-Quelle angeben zu müssen:

Button {
    icon.name: "myicon"
}

Das Beispiel „Gallery“ und die „Wearable Demo“ stellen vollständige, ausführbare Anwendungen mit einem mitgelieferten Icon-Theme bereit.