El diseño de una página (imagen siguiente) se compone de controles de página (como cuadros combinados, tablas e imágenes) que se disponen y se formatean exactamente tal y como el usuario final verá la página. Los controles se arrastran hasta el diseño desde el panel Controles. Una vez que se haya insertado un control en el diseño, puede hacer lo siguiente:
•Los controles pueden vincularse a los nodos de la fuente de página (disponibles en el panel Fuentes de página) para que los datos de dichos nodos puedan mostrarse en el diseño y procesarse. Por lo general, la asociación entre un control y un nodo de la fuente de página se define arrastrando un nodo desde su estructura de datos (en el panel Fuentes de página) hasta el control. Una asociación de nodos de este tipo se denomina vínculo con la fuente de página del control.
•Configurar acciones de control: las acciones de los controles determinan la funcionalidad que se ejecutará cuando se active un evento relacionado con el control (por ejemplo, al hacer clic en un botón). Para definir las acciones de un control, haga clic con el botón derecho sobre dicho control y seleccione Acciones de control. Las acciones de control se describen en la sección Acciones.
•Configurar las propiedades de control: las propiedades de un control definen su aspecto (incluida su posición). Por consiguiente, las propiedades de un control también definen el aspecto de la página. Para configurar las propiedades de un control selecciónelo y defina sus propiedades en el panel Estilos y propiedades. Las propiedades de cada control se describen en la subsección de esta sección.
•Cuando el control se asocia con un nodo de la fuente de datos (vínculo con la fuente de página), al pasar el cursor por el control (en la vista Diseño de páginas) aparece el nodo asociado. •Todos los vínculos con fuentes de página de la estructura de fuentes de página aparecen en negrita. Los nodos de la estructura que no son vínculos de fuente de página no están en negrita. •Al pasar el cursor por el vínculo con la fuente de página en la estructura del diseño aparece información sobre el control asociado. •Para eliminar una asociación con el nodo de la fuente de datos (y por tanto los datos del control) haga clic con el botón derecho en el control (en la vista Diseño de páginas) y haga clic en Eliminar vínculo con la fuente de la página <NombreDeNodo>. •Para restaurar un estilo o una propiedad (en el panel Estilos y propiedades), seleccione el estilo/la propiedad y haga clic en Restaurar en la barra de herramientas del panel. •Los valores de varias propiedades se pueden configurar usando expresiones XPath. Así podrá utilizar valores dinámicos, es decir, valores calculados o tomados de los nodos de la fuente de datos en tiempo de ejecución. Para crear una expresión XPath, haga clic en el botón Editar XPath de la barra de herramientas del panel Estilos y propiedades. •Para editar la expresión XPath de un estilo o de una propiedad (en el panel Estilos y propiedades), seleccione el estilo/la propiedad y haga clic en el botón Editar XPath de la barra de herramientas del panel. •Para copiar un control y pegarlo en otra ubicación del diseño, pulse Ctrl mientras arrastra el control hasta su nueva posición. •Para asignar propiedades a un control, defina clases para el control (con la propiedad Clase CSS del explorador) y después asigne reglas a las clases en un archivo CSS externo (que se elije en el cuadro de diálogo Configuración del explorador). •Las propiedades CSS de los controles se pueden definir en el panel Estilos y propiedades y en archivos CSS externos, pero las que se definan en el panel Estilos y propiedades tienen prioridad. |
Lista de controles
A continuación se incluye una lista de los controles disponibles, junto con una captura de pantalla en la que se muestran los distintos controles.
Menú contextual
Cada control de la página cuenta con un menú contextual. Los siguientes comandos relacionados con los controles son comunes a la mayoría de los menús contextuales.
Este comando está habilitado para aquellos controles que pueden asociarse a un nodo de la fuente de página y para los que existe dicha asociación. Al hacer clic en este comando se elimina la asociación entre el control y la fuente de página. Recuerda que no hay otra forma de eliminar la asociación del control con un nodo. |
|
Abre el cuadro de diálogo Variables locales del control, en el que puede añadir, editar y eliminar las variables del control. Una variable de control tiene un nombre, que es una cadena de caracteres, y un valor, que es una expresión XPath. Las variables declaradas en el cuadro de diálogo Variables locales se evaluarán cuando se invoque el control y se utilizarán con los valores correspondientes hasta que se vuelva a invocar el control. En la expresión XPath que calcula el valor de una variable se pueden utilizar parámetros. Las variables de control resultan útiles para proporcionar valores que pueden utilizarse en acciones de control. Pongamos como ejemplo un nodo Departmento que está dentro de un nodo Empresa, en el que el nombre de dominio de cada nodo Empresa (por ejemplo, altova.com o nanonull.com) se indica en un nodo secundario del nodo Empresa. Si ahora configura una variable de control para seleccionar el nodo del nombre de dominio, dicha variable podrá utilizarse en una acción del control para seleccionar dinámicamente el nombre de dominio de cada empresa en el momento en que se procese dicha empresa. Por ejemplo, las direcciones de correo electrónico de los nodos secundarios Employee de un departamento pueden generarse utilizando los elementos PrimerApellido y SegundoApellido de cada empleado, junto con la variable de control que contiene el nombre de dominio de la empresa. Las variables de control también se pueden configurar a través de la propiedad Variables de control del control (disponible en el panel Estilos y propiedades cuando se selecciona el control). Las variables de control definidas actualmente aparecen como subelementos de la propiedad Variables de control; cada variable de control se puede editar haciendo doble clic en ella. |
|
Habilitado para los controles en los que se puede introducir texto. Abre un submenú con las siguientes opciones: •Directamente: para introducir texto estático directamente como texto del control •XPath: muestra el cuadro de diálogo Editar expresión XPath/XQuery, en el que puede introducir la expresión XPath que selecciona el texto del control. •Nodo XML: hace referencia a la opción de mostrar el contenido de un nodo XML como texto del control. Al hacer clic en la opción, aparece una sugerencia que indica que se puede arrastrar un nodo de la fuente de página desde el panel Fuentes de página hasta el control. El nodo arrastrado y soltado se asociará al control, y el contenido del nodo se introducirá como texto del control |
|
Si un control contiene un archivo que se puede implementar, o si un control Imagen contiene un archivo que se puede incrustar, se activarán los subcomandos correspondientes del comando Implementar/Incrustar archivo. •En la opción de implementación de un archivo, puede seleccionar el subcomando correspondiente a la ubicación en la que desea implementar el archivo. Al implementarse, el archivo se añade a la lista Archivos que se pueden implementar del panel Archivos. •Cuando se incrusta un archivo de imagen, los datos binarios de dicho archivo (PNG, BMP, etc.) se convierten a una codificación Base64 basada en texto, y este texto se incrusta en el archivo de diseño. Al incrustarse, la propiedad Incrustar imagen del control Imagen se configura como true. Consulte la descripción del inmueble para obtener más información. |
|
Si es posible crear una plantilla de control a partir de los componentes de diseño seleccionados, el comando Crear plantilla a partir de la selección estará habilitado. Al seleccionar el comando, ocurre lo siguiente: (i) al proyecto se añade una nueva plantilla de control que contiene los componentes de diseño seleccionados (ver panel Páginas); (ii) se sustituyen los componentes de diseño seleccionados por un control Marcador de posición. Para volver al estado anterior, utilice el comando del menú contextual Remplazar marcador de posición con contenido de la plantilla (ver descripción más abajo). |
|
Abre el cuadro de diálogo Visibilidad según el tipo de dispositivo (imagen siguiente). El cuadro de diálogo contiene una lista de tipos de dispositivos cliente. Seleccione el tipo de dispositivo cliente para el que desea que el control sea visible y haga clic en Aceptar. Si el tipo de dispositivo cliente tiene un icono, éste aparecerá en el diseño, justo a la izquierda del control correspondiente (imagen siguiente). |
|
