Theme QML Type
Define el color y el estilo de un esquema de color. Más...
| Import Statement: | import Qt.labs.StyleKit |
| Inherits: |
Descripción detallada
Un Tema anula las propiedades definidas en Style para proporcionar una apariencia visual distinta para un esquema de color particular. Un estilo suele configurar propiedades estructurales como el tamaño implícito, el relleno y los radios, mientras que un tema especifica los colores, las sombras y otros atributos visuales. Sin embargo, esto no es una restricción: un tema puede anular cualquier propiedad que pueda establecer un estilo.
Un estilo puede proporcionar un tema light y otro dark. Cuando themeName se establece en "System" (el predeterminado), el tema activo sigue el de operating system's color scheme. También se pueden crear temas adicionales utilizando CustomTheme y switch between them en tiempo de ejecución.
Las propiedades que no se definen en el tema vuelven a las definidas en Style.
En el siguiente ejemplo se definen temas claros, oscuros y de alto contraste, cada uno de los cuales proporciona diferentes colores para los controles:
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" } } }
Para un ejemplo completo mostrando temas en acción, ver el Ejemplo StyleKit.
Nota: No se garantiza que los tipos de los módulos Qt.labs sigan siendo compatibles en futuras versiones.
Véase también Style y CustomTheme.
© 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.