Definición del comportamiento de una vista

Cambie a Comportamiento para definir la funcionalidad y el aspecto de la vista:

• Añada estilos dinámicos para controlar el aspecto de la vista.
  El estilo dinámico combina una hoja de estilo Less con definiciones de estilo establecidas en el padre, que suele ser la automatización del flujo de trabajo. Para obtener información sobre el lenguaje Less, consulte http://lesscss.org/ . La combinación de la hoja de estilo Less y la definición de estilo genera archivos CSS en tiempo de ejecución. Los archivos CSS en tiempo de ejecución se utilizan para mostrar las instancias de vista en la automatización del flujo de trabajo. Al definir los valores de la definición en el nivel de contenedor, las instancias de vista del contenedor pueden tener un estilo coherente. Además, los cambios globales en ese estilo se pueden realizar desde una ubicación.
• Añada archivos de script y de hoja de estilo contenidos en la biblioteca utilizando scripts incluidos.
  Generalmente, estos archivos son archivos .js y .css reutilizables. Puede añadir estos archivos a la biblioteca como archivos web individuales o empaquetarlos en un archivo .zip y añadir ese archivo como archivo web. El empaquetamiento de los archivos en un archivo .zip significa que éstos mantienen sus relaciones relativas. Por ejemplo, si empaqueta un archivo .css e incluye las imágenes a las que hace referencia utilizando enlaces relativos, el sistema encontrará las imágenes. Sin embargo, el sistema no encontrará las imágenes si empaqueta un archivo .css en un archivo .zip y empaqueta las imágenes a las que hace referencia en un archivo .zip diferente.

  Si añade archivos .css como archivos web individuales, puede editarlos en el diseñador. Sin embargo, no puede editar los archivos .css que están empaquetados en un archivo .zip . En su lugar, debe editarlos externamente, volverlos a empaquetar y, a continuación, sustituir el archivo web .zip por el archivo .zip actualizado.

• Haga un prototipo de la CSS necesaria para dar estilo a la vista usando CSS en línea. Después de haber desarrollado el CSS, cópielo en un archivo .css e importe dicho archivo como un script incluido.
  Dado que los nombres de clase en una CSS en línea son globales, podría haber conflictos de nombres que den como resultado que sólo se aplique la última definición en el estilo. Por este motivo, utilice CSS en línea como un lugar temporal para desarrollar los estilos CSS de la vista.

  Si está apuntando a un archivo de imagen en un archivo .zip, utilice el siguiente formato para el URL : file.zip! ruta / archivo. extensión.

  Nota: La notación '!' para hacer referencia a un archivo dentro de un archivador sólo está soportada en el comportamiento CSS en línea.

  Cuando se trabaja en Designer, los estilos de vista especificados en archivos .css y las CSS en línea se aplican a la vista en las propiedades de Diseño, lo que permite ver cómo aparecerá la vista de coach en el tiempo de ejecución sin tener que ejecutarla ni probarla. Existen algunas restricciones para este soporte de estilo de tiempo de diseño:

  • Si utiliza sentencias de consulta de medio en su CSS, sólo se analizan las consultas de medio con un tipo de medio screen y sólo se aplican las especificaciones max-width y min-width en el tiempo de diseño. Este estilo de tiempo de diseño sólo admite una sintaxis simple, por ejemplo, las siguientes sentencias de tipo de medio se procesan en el tiempo de diseño:

    @media screen ….
    	@media all
    	@media (min-width: 520 px ) 

    Sin embargo, las siguientes sentencias no se procesan en el tiempo de diseño:

    @media not screen
    @media not print
    @media not (tty and screen)

  • Las importaciones que se encuentran dentro de scripts incluidos y CSS en línea sólo se procesarán en un nivel de inclusión. Por ejemplo, si tiene CSS en línea que incluye la sentencia @import url('File1.css'), el css dentro de File1 se refleja en el tiempo de diseño, pero las sentencias de importación dentro de File1 no se reflejan en el tiempo de diseño.

  Si tiene vistas y coaches grandes o complejos, la aplicación de estilos de tiempo de diseño podría provocar algunos problemas de rendimiento. Para inhabilitar el estilo de tiempo de diseño para la sesión actual, vaya a Diseño, pulse con el botón derecho del ratón en cualquier punto del lienzo y seleccione Inhabilitar estilo de tiempo de diseño. Para el resto de la sesión, no se aplicarán los estilos de vista especificados. Para volver a activar el estilo de diseño para la sesión, pulse con el botón derecho del ratón en el lienzo y seleccione Habilitar estilo de tiempo de diseño.

• Añada estilo condicional para manejar las diferencias entre los navegadores y tipos de medios.
  El estilo condicional altera temporalmente los estilos predeterminados cuando se aplica la condición.
  Por ejemplo, puede aplicar un archivo .css para Microsoft Internet Explorer y un archivo .css diferente para otros navegadores. Utilice el estilo condicional para aplicar el archivo apropiado.
  Para añadir estilo condicional:
  1. Añada un estilo específico de tamaño de pantalla o un estilo específico de navegador a un archivo .css .
     Por ejemplo, puede añadir estilos para que las tabletas utilicen un font más pequeño para las etiquetas y se reduzca el relleno.
  2. Añada el archivo .css como un script incluido.
  3. En los campos Condición de IE o Soporte , añada la condición que aplica los estilos en el archivo .css .
     Por ejemplo, si el archivo .css contiene estilos para una presentación de tableta, añada una condición como screen and (max-width: 600px) en el campo Soporte. Si la pantalla del usuario tiene 600 píxeles o menos de ancho, la vista utiliza los estilos del archivo .css, en lugar de los valores predeterminados.
  También puede añadir estilo condicional añadiendo JavaScript en línea y CSS en línea.

  Nota: Cualquier estilo JavaScript en línea y cualquier condición de estilo especificada en los campos Condición de IE y Soporte sólo se procesan en tiempo de ejecución y no se reflejan en tiempo de diseño.
• Defina variables y funciones comunes para los manejadores de sucesos de la vista utilizando JavaScripten línea.
  Para obtener información sobre cómo acceder a partes del DOM, consulte Acceso a una vista hijo utilizando un ID de control. El editor contiene un fragmento de código. El editor no muestra mensajes de validación para fragmentos de código.
• Defina variables que identifiquen manejadores de sucesos definidos por el usuario. Para obtener más información, consulte el tema Sucesos definidos por el usuario.
• Para insertar código como etiquetas <meta> en la cabecera de la vista, utilice HTML de cabecera.
• Si fuese necesario, defina las funciones que utiliza la vista en los manejadores de sucesos correspondientes.
  Para obtener más información, consulte Manejadores de sucesos para el objeto de vista. Si ha seleccionado Puede activar un suceso límite en las propiedades de Visión general, añada código para activar los sucesos de límite. Para desencadenar el suceso, añada código JavaScript para invocar this.context.trigger(callback) en el momento adecuado.