Trabajo con temas de estilo
Un tema de estilo es una recopilación de propiedades de estilo que especifican el aspecto visual de los widgets y otros componentes de un mashup. Por defecto, el tema de convergencia de PTC se aplica a todos los nuevos mashups que se crean en Composer. El tema se crea utilizando los principios del sistema de diseño de PTC. Se pueden crear y utilizar temas de estilo propios para crear mashups y aplicaciones que tengan un aspecto y un funcionamiento coherentes. En los temas de estilo se incluyen estilos globales que permiten controlar los colores, las fuentes y los estilos de línea de los widgets de un mashup. Además, se pueden modificar estilos más específicos para elementos como, por ejemplo, vínculos, botones y menús, mediante el editor de la ficha Estilos de entidades de tema de estilo en Composer.
Se pueden aplicar estilos a los mashups de las siguientes maneras:
• Temas de estilo y propiedades de estilo: estilos para widgets temáticos dentro de los mashups.
• Definiciones de estilo: estilos para widgets que no son temáticos y heredados.
 |
Las definiciones de estilo se utilizan para dar estilo a los widgets temáticos cuando se aplica una entidad de definición de estado al widget.
|
• CSS personalizada: sintaxis CSS estándar.
En comparación con las definiciones de estilo, la tematización permite realizar lo siguiente:
• Escalar el diseño rápidamente aplicando temas a múltiples mashups asociados a una aplicación.
• Reutilizar los estilos comunes sin tener que aplicar las definiciones de estado a los widgets individuales en un mashup.
• Previsualizar los estilos mediante una vista previa en la ficha Estilos de una entidad de tema de estilo.
• Exportar o compartir temas de estilo para colaborar en el diseño de aplicaciones con otros usuarios.
Uso de temas de estilo y propiedades de estilo
Los temas de estilo se aplican en un nivel de mashup y las propiedades de estilo se aplican en un nivel de widget. Para sustituir un tema de estilo de mashup, edite las propiedades de estilo de widgets específicos mediante el panel Propiedades de estilo en Mashup Builder. Las propiedades de estilo permiten configurar el aspecto visual del widget en distintos estados, como activo, pulsado y pasar por encima. Los temas de estilo se pueden utilizar para definir un aspecto general para la aplicación y, a continuación, utilizar las propiedades de estilo para hacer configuraciones avanzadas de estilo en widgets individuales según sea necesario.
Creación de temas personalizados
Al crear un nuevo tema de estilo, se recomienda comenzar por la duplicación de un tema de estilo existente, como el tema de convergencia de PTC. A continuación, se puede utilizar el editor de temas de estilo para personalizar los estilos globales y de elementos dentro del tema de modo que coincidan con los requisitos de diseño.
Uso del tema de estilos heredados
El tema de convergencia por defecto aplica un diseño más moderno y accesible en comparación con las definiciones de estilo que se aplican a los widgets heredados. Para conservar el aspecto de los widgets heredados, aplique la entidad compositora Legacy Styles Theme a un mashup. Esta tarea también se puede realizar mediante el cuadro de diálogo Migración de mashup cuando se migra un mashup que contiene widgets o esquemas heredados.
Uso de CSS personalizada
Los widgets del componente Web admiten la personalización de estilos mediante temas de estilo y propiedades de estilo del widget. PTC no recomienda ni soporta la anulación de los estilos de los componentes Web mediante CSS personalizada. La estructura del DOM del componente y las clases CSS se consideran detalles de implementación internos que pueden cambiar cuando se publique una nueva versión de ThingWorx Foundation.