MANUAL. GENEXUS Web Panels. versión 7.0

Transcripción

1 MANUAL GENEXUS Web Panels versión 7.0 Setiembre,2000 1

2 Editor html de web panels 7 Introducción 7 Descripción 7 Diseño 8 Font default para Web Panels 8 Formateo de texto 9 Insertar controles y sus propiedades 9 Design VS. Source 10 Form 11 Propiedades del form en diseño 11 Propiedades del form en tiempo de ejecución 12 Atributos y Variables 13 Picture de dates y datetimes 13 Propiedades del control edit en diseño 13 Appearance 14 Propiedades control edit en tiempo de ejecución 15 Propiedades de variables de tipo bitmap en diseño 15 Propiedades variables bitmap en tiempo de ejecución 16 PROPIEDADES SEGÚN EL TIPO DE CONTROL 16 METODOS DE LOS CONTROLES EDIT 17 Imágenes 18 Base path for relative images 18 Como asignar un evento a una imagen 18 Propiedades de las imágenes 19 Propiedades De Las Imágenes En Tiempo De Ejecución 19 CONTROLES TEXT BLOCK 21 Propiedades Text Block en diseño 21 Propiedades Text Block en ejecución 21 Botones 22 Propiedades de botones 22 Cómo asignar un evento a un botón 23 Función LINK 24 Comando LINK 24 CALL s VS LINK s 24 Tablas 26 Propiedades de las tablas 26 Propiedades de las filas de una tabla 27 Propiedades de las celdas de una tabla 28 SUBFILES 29 Cómo desplegar datos en un subfile 29 Cómo aceptar datos en un subfile 29 Cómo asociar eventos a una línea de un subfile 29 Propiedades del Subfile 30 LineColor, LineFont 31 2

3 Table 31 Propiedades modificables en ejecución 31 Propiedades de las columnas del subfile 31 Propiedades de columnas en tiempo de ejecución 32 Subfile Freestyle 34 Propiedades del subfile Freestyle 35 Propiedades modificables en ejecución 35 Múltiples subfiles en web panels 36 Introducción 36 Descripción 36 SUBFILES ANIDADOS 39 Determinación de tablas bases 39 Disparo de Eventos 39 Comparación entre Web Panels y Work Panels 41 Tabla Base 41 Esquema de trabajo en Internet 41 Eventos 41 Variables 42 Gatillado de fórmulas stand alone 42 Reglas más importantes 42 Propiedades 43 Comandos soportados por los Web Panels 44 Link 44 Load 44 Refresh 44 Return 44 FUNCIONES browserid. browser version 46 BrowserID 46 BrowserVersion 46 Preferences a considerar en el desarrollo de Web panels 47 Preferences generales 47 Preferences a nivel del Generador 48 Preferences de Java 50 Servlet Directory 50 SSP base URL 50 Static content base URL 50 Static Content Directory seen by Client 51 Auto compress web pages 51 FUNCIONES de cookies 52 Introducción 52 Que son las cookies? 52 Descripción 53 Ejemplos 54 smart static Panels 56 Introducción 56 3

4 Descripción 56 Generación de SSP 56 Generación de SSP a partir de la línea de comandos 57 Generación de SSP a partir de otro objeto GeneXus 59 Consideraciones 60 Ejecución desde el browser 60 FAQ Preguntas frecuentes 60 Limitaciones 61 Cómo agregar código HTML a un Web Panel 62 Editar código HTML generado 62 Asignar HTML a una variable o text block 63 Código HTML y JavaScripts 64 Plataformas y alternativas 65 Requerimientos VB (CGI) 66 Requerimientos para desarrollo 66 Requerimientos en producción 66 Requerimientos VB (ASP) 68 Requerimientos para desarrollo 68 Requerimientos en producción 68 Requerimientos C/SQL 71 Requerimientos para desarrollo 71 Requerimientos en producción 74 Requerimientos JAVA 77 Requerimientos para el desarrollo 77 Requerimientos en el servidor 78 Requerimientos en producción 79 Propiedades de ejecución VB 80 Visual Basic 5.0 o Visual Basic 6.0 Path: 80 Execution Mode 80 Compile & Execute 80 Execute from interpreter. 80 Web Panels Settings (Solo para Web Panels generados como CGI) 80 CGI-BIN Path 80 Start URL 81 Propiedades de ejecución C/SQL 82 Transfer 82 Submit Mode 83 Propiedades de e jecución de JAVA 84 Java Options 84 Glosario de propiedades de controles 88 Active Link Color: 88 Align 88 Alternate text 88 Attribute 89 Auto Resize: 89 Back Color 89 BackcolorStyle: 89 4

5 Background 89 Background Properties 90 Backstyle 90 Bitmap 90 BorderColor 90 Borderwidth 90 Bottom Margin 90 Caption 90 CellPadding 91 CellSpacing 91 Col span 91 Cols 91 Control Name 91 Control Type 91 Enabled 91 Fill 92 Font 92 FontBold 92 FontItalic 92 FontName 92 FontSize 92 FontStrikeThru 92 FontUnderline 93 ForeColor 93 Format 93 Height 93 Horizontal Space 93 IsPassword 93 Left Margin 93 LineColor 94 LineFont 94 Link 94 LinkTarget 94 Low resource 94 Not Visited Link Color 94 On Click Event 95 Position 95 Read Only 95 Right Margin 95 Row span 95 Rows 95 Rules 96 Source 96 Text Color 96 Title 96 TitleBackStyle 96 TitleFont 96 TitleFontBold 96 TitleFontItalic 96 TitleFontName 97 TitleFontSize 97 TitleFontStrikeThru 97 TitleFontUnderline 97 TitleForeColor 97 TitleFormat 97 5

6 ToolTipText 97 Top Margin 97 UseMap 97 Vertical Align 98 Vertical space 98 Visible 98 Visited Link Color 98 Width 98 Word Wrap 99 Dudas Frecuentes 100 En que objetos se puede usar? 100 Cuál es la diferencia entre el editor anterior y este? 100 Hay compatibilidad? 100 Qué es una tabla, por qué conviene usarlas? 100 Puedo hacer un subfile con líneas de distintos colores alternadas? 100 Para qué sirven los subfiles Freestyle? 101 Lo que se ve en diseño es lo mismo que se ve en ejecución?. 102 Por qué en ejecución los controles se mueven cuando se cambia el tamaño de la ventana? 102 Las Pictures de los controles, sirven para entrada o sólo para salida?_102 Cómo se puede agregar o modificar el código HTML de un Web Panel? 103 Cómo cambiar el interlineado en el nuevo editor HTML? 103 Cómo oculto los bordes de las tablas? 103 Conversión de Web Panels 104 Introducción 104 Descripción 104 Requisitos 104 Cómo se realiza la conversión? 104 Limitaciones 105 Ejemplos 106 6

7 EDITOR HTML DE WEB PANELS Introducción La finalidad de este editor es potenciar y simplificar la edición del form de los web panels permitiendo crear fácilmente web sites vistosos y potentes. Este editor es del tipo "WYSIWYG" (What you see is what you get) lo que permite al desarrollador visualizar en diseño la página web que se va a publicar. Para esto se licenció un editor similar al Front Page de Microsoft, que fue diseñado siguiendo el estándar de las herramientas Microsoft Office, lo que permite que los usuarios puedan utilizarlo rápidamente y en forma intuitiva. La diferencia fundamental existente con respecto al editor que se disponía en versiones anteriores a la 7.0, es que este editor está orientado a páginas, lo que significa que la posición de los controles que se encuentran dentro del form en diseño es relativa al tamaño de la ventana que contenga la página. Descripción El uso de este editor es muy sencillo, de forma que todo el diseño realizado se puede visualizar en ejecución sin necesidad de incluir código HTML en el Form o utilizar las Web Properties (*). A modo de ejemplo, si se desea modificar el tamaño de font utilizada en el Web Panel, simplemente se selecciona el texto, se selecciona el tamaño deseado. El editor facilita el formateo de textos (tamaño de letra, tipo de letra, color, etc.), permite la inserción de controles GeneXus (Controles edit, subfile, botones, etc.). Una de las mejoras importantes en el diseño que provee el editor es el manejo de tablas (sin necesidad de usar Web properties (*)), característica fundamental a la hora de diseñar páginas web. Esta facilidad habilita al usuario a diseñar mejores páginas, así como le permite tener el control de la alineación de los controles dentro del Web Panel. (*) Las Web Properties son una facilidad existente en el editor de las versiones anteriores a GeneXus 7.0 para poder incluir tags HTML en los objetos. 7

8 Diseño A continuación se documentan las características más importantes para el diseño de Web Panels. En los Web Panels se dispone de dos barras de herramientas, una habilita las funcionalidades del nuevo editor, mientras que la otra permite la inserción de los controles. A continuación se documentan las operaciones que se pueden realizar con cada una de ellas, así como las características de los controles disponibles en Web Panels. Font default para Web Panels Se puede configurar el tipo de letra que se utilizará al insertar atributos / variables y columnas de subfile dentro del form. Para hacerlo deben realizar los siguientes pasos: 1. Seleccionar la opción File/KB Preferences. 2. A continuación se visualizará el siguiente diálogo: 3. Al presionar el botón Change se desplegará el siguiente diálogo, permitiéndole definir el tipo de letra que se utilizará por defecto para atributos / variables y columnas de subfiles. 8

9 NOTA: 1. El tipo de letra por defecto de los Texto y los Text Block es el que se tenga seteado en el PC como el tipo de letra por defecto del browser (usualmente Times New Roman). La modificación del tipo de letra por defecto del browser se puede realizar desde el Panel de control ingresando a la configuración de las Opciones de Internet. 2. Si ya se definieron Web Panels y se modifica el tipo de letra por defecto del modelo, el nuevo valor no aplica a los controles ya existentes dentro de los mismos. Formateo de texto La barra de herramientas disponible para realizar estas operaciones es la siguiente: Las operaciones que se pueden realizar son las estándares de edición y formateo de texto. La opción destacable relacionada con Web Panels es, que permite visualizar los bordes de las tablas cuya propiedad Border esté con valor 0. De esta forma, se pueden ver en diseño los bordes de las tablas aún cuando éstos no se vean en ejecución. Insertar controles y sus propiedades Los controles que se pueden utilizar dentro de los Web Panels podemos clasificarlos en dos grupos: 1. Aquellos que pueden ser usados en todos los objetos GeneXus: 9

10 Atributos Variables Botones 2. Los que son propios de los Web Objects, o tienen un comportamiento diferente que en el resto de los objetos. Imagenes Subfile Texto Text Block Tabla Subfile Free Style Para insertar controles en el form del web panel se puede utilizar la opción Insert del menú de GeneXus o la siguiente barra de herramientas. Más adelante se detallan los controles disponibles, así como las opciones disponibles en dicha barra de herramientas. Design VS. Source En el borde inferior de la pantalla cuando se visualiza el form de un Web Panel, se pueden observar dos secciones: Design y Source. Por defecto, se trabaja en la sección Design que es donde se insertan los controles y se visualiza el aspecto que va a tener en ejecución el Web Panel. Si se selecciona Source, se puede visualizar el código HTML correspondiente al diseño realizado. Esto permite que el usuario modifique el código HTML generado como se verá más adelante. 10

11 Form Al form de los web panels se le pueden asignar propiedades en tiempo de diseño y algunas de ellas pueden modificarse en tiempo de ejecución (mediante eventos). Propiedades del form en diseño Las propiedades para el form son las siguientes: La última columna del diálogo indica si el valor asignado a la propiedad es el valor por defecto o no. El asterisco de color negro significa que es el valor por defecto, el gris es que fue modificado. 1. BackColor 2. TextColor 3. Background 4. Background Properties 5. TooltipText 6. Word Wrap 7. Active Link Color 8. Visited Link Color 9. Not Visited Link Color 10. Top Margin 11

12 11. Bottom Margin 12. Left Margin 13. Right Margin Propiedades del form en tiempo de ejecución En ejecución se pueden modificar las siguientes propiedades del Form: 1. BackColor 2. Background 3. Caption: El caption del form se transforma en el título de la ventana. Por defecto, tiene el nombre del web panel. Esta propiedad solamente puede modificarse en tiempo de ejecución. 12

13 Atributos y Variables Si en el diálogo de seleccionar atributos o en el diálogo de seleccionar variables se seleccionan varios a la vez, éstos se insertan en el formulario dentro de una tabla, simplificando la tarea de alineación de los mismos. Al seleccionar un control y presionar el botón derecho del mouse aparecen las propiedades del control para ser editadas. Estas propiedades se detallan a continuación. También existe la opción View Source que permite ver el fuente HTML generado. Para modificar las propiedades de estos controles en ejecución (es decir en algún evento del objeto), es necesario programarlo (ejemplo: &pwd.ispassword = 1) Picture de dates y datetimes Se formatea lo digitado por el usuario en campos de tipo date y datetime. Esto permite, por ejemplo, que el usuario final digite una fecha / hora sin los separadores ('/', ':', Etc.) y se mejore la "visualización". El formateo ocurre cuando el usuario "sale" del campo y controla únicamente que el formato sea correcto. No se controla que la fecha y/o hora sea válida: esto lo siguen haciendo los programas. En caso que el formato no sea correcto, se emite un mensaje de error (una ventana con el 'Date or time format is not correct') y se vuelve el foco al campo incorrecto. Propiedades del control edit en diseño Las variables y atributos son controles de tipo Edit, que tienen las siguientes propiedades: 13

14 1. Attribute 2. Control Type: Las propiedades que aplican sobre los controles Edit, dependen del tipo de control que se seleccione. (Ver propiedades según el tipo de control). Appearance Dentro del grupo Appearance se encuentran todas las propiedades que aplican al aspecto del control. Las mismas se detallan a continuación: 1. Read Only 2. Auto Resize: Esta propiedad aplica a controles edit que NO tengan la propiedad Read-Only con el valor True, ya que en este caso se ignora el ancho especificado. 3. Width: para controles edit debe ingresarse en pixels. 4. Fill 5. BackColor 6. ForeColor 7. Font 8. Format 14

15 Propiedades control edit en tiempo de ejecución Además de las propiedades vistas anteriormente, existen otras que permiten modificar en tiempo de ejecución los controles de tipo edit. Las propiedades son: 1. Enabled 2. BackStyle 3. FontBold 4. FontItalic 5. FontName 6. FontSize 7. FontStrikethru 8. FontUnderline 9. ForeColor 10. IsPassword 11. Link 12. LinkTarget 13. Visible Propiedades de variables de tipo bitmap en diseño Las propiedades que se detallan a continuación aplican únicamente a variables de tipo bitmap. 15

16 1. Borderwidth 2. Alternate Text 3. Tooltiptext 4. Align 5. HorizontalSpace 6. VerticalSpace Propiedades variables bitmap en tiempo de ejecución A las variables de tipo bitmap se le pueden modificar las siguientes propiedades en tiempo de ejecución: 1. Alternate Text 2. Borderwidth 3. Link 4. LinkTarget 5. Enabled 6. TooltipText 7. Visible NOTA: La propiedad Enabled de Runtime permite habilitar (Enabled=1)/deshabilitar (Enabled=0) la ejecución del evento asociado a la variable bitmap. PROPIEDADES SEGÚN EL TIPO DE CONTROL COMBO BOX Las propiedades a nivel de diseño que aplican son: 1. Attribute 2. Backcolor 3. Forecolor 4. Fill 5. Font 6. Read Only Las propiedades a nivel de ejecución son: 1. Backcolor 2. Backstyle 3. Enabled 16

17 4. FontBold 5. FontItalic 6. FontName 7. FontSize 8. FontStrikethru 9. FontUnderline 10. ForeColor 11. Visible NOTA : Alineación de un combo/dyncombo en subfiles. Siempre se alinea a la izquierda independientemente del tipo de datos. Esto se hace así porque aun cuando el combo sea sobre un atributo numérico los valores que se muestran en el combo son de tipo carácter. RADIO BUTTON, CHECK BOX Las propiedades a nivel de diseño que aplican son: 1. Attribute 2. Backcolor 3. Forecolor 4. Fill 5. Font. Los radio button tienen también la propiedad Radio Direction que permite indicar si las opciones del radio se desplegarán en forma vertical u horizontal. Las propiedades a nivel de ejecución son: 1. Backcolor 2. Backstyle 3. Enabled 4. FontBold 5. FontItalic 6. FontName 7. FontSize 8. FontStrikethru 9. FontUnderline 10. ForeColor 11. Visible Para los radio buttons no aplican las propiedades Enabled ni ReadOnly. METODOS DE LOS CONTROLES EDIT Los métodos que aplican a los controles edit de tipo combo box, dynamic combo box, listbox y radio button son: AddItem RemoveItem Clear 17

18 Imágenes Cuando se trabaja con Web Panels se pueden distinguir dos ambientes muy diferentes: el de diseño y el de ejecución. Por ambiente de diseño, nos referimos al ambiente en que se desarrollan los web panels y por ambiente de ejecución a la ejecución propiamente dicha de los web panels. En particular esto es muy importante al trabajar con imágenes, ya que en diseño las mismas se buscan en el camino ingresado (Ej. : c:\modelo\imagenes\img.gif), pero en ejecución es necesario referenciar el camino virtual donde se encuentran las mismas normalmente en el Servidor Web -(Ej.: /imagenes/img.gif). Hay que recordar que el servidor web tiene acceso únicamente a aquellos directorios definidos en el software de administración del mismo. Es por esta razón que se dispone de una preference a nivel de diseño denominada Base path for relative images. Base path for relative images En esta preference del modelo de diseño, se puede ingresar el path absoluto que se va a utilizar mientras se trabaja en diseño (siguiendo con el ejemplo anterior: c:\modelo). Luego en el Web Panel, para insertar una imagen se debe seleccionar el botón de la barra de controles disponibles, y en el diálogo para ingresar el origen de la imagen se debe ingresar el path relativo (ej: /imágenes/img.gif). De esta forma la imagen seleccionada se va a visualizar tanto en diseño como en ejecución. Como asignar un evento a una imagen Para poder asociar un evento a una imagen se debe dar un nombre a la misma (por ej: img) y luego en los eventos, agregar Event img.click con el código deseado. De la misma forma, es posible asociar a una variable de tipo bitmap un evento. Notas: Si la imagen tiene asociado un link, pierde el mismo al quedar asociada a un evento. También se puede asignar un evento a una imagen que se encuentre dentro de un subfile. En el caso de las variables tipo bitmap actúan como botones y funciona además la propiedad Enabled ( que por defecto esta en 1 - true- ) y permite deshabilitar el botón en ejecución (runtime). 18

19 Propiedades de las imágenes A continuación se detallan las propiedades disponibles para las imágenes en tiempo de diseño. 1. Control Name 2. Source 3. LowResSource 4. Height 5. Width 6. Borderwidth 7. Alternate Text 8. Tooltip Text 9. Horizontal Space 10. Vertical Space 11. Align 12. UseMap Propiedades De Las Imágenes En Tiempo De Ejecución Las propiedades de las imágenes que pueden modificarse en tiempo de ejecución son: 1. Borderwidth 2. TooltipText 19

20 3. AlternateText 4. Bitmap 5. Enabled: La propiedad Enabled de Runtime permite habilitar (Enabled=1)/deshabilitar (Enabled=0) la ejecución del evento asociado a la variable bitmap. 6. Link: Si se programa el evento Click de una imagen se ignora la propiedad Link. 7. LinkTarget 8. Visible 20

21 CONTROLES TEXT BLOCK Los controles Text Block pueden ser vistos como texto insertado directamente en el form, con la ventaja que en forma dinámica (en ejecución) se puede modificar el mismo. Para insertar un Text Block, se puede presionar el botón controles disponibles. de la barra de Propiedades Text Block en diseño Las propiedades de este tipo de control son: 1. Control Name 2. Format: El valor por defecto para Text Blocks es HTML. Propiedades Text Block en ejecución Además de las propiedades detalladas anteriormente, se pueden modificar las siguientes propiedades de los Text Blocks en tiempo de ejecución: 1. Visible 2. Caption 3. Link 4. Linktarget 5. Format 21

22 Botones Para insertar un botón en el formulario se puede seleccionar de la barra de controles disponibles. En los web panels pueden usarse varios botones y asociarles eventos (predefinidos de GeneXus o definidos por el usuario). Al presionar el botón derecho del mouse se visualiza el siguiente diálogo que habilita al usuario a editar las propiedades del mismo o a editar el evento que el botón tiene asociado. Propiedades de botones 1. Control Name 2. Caption 3. On Click Event 22

23 Cómo asignar un evento a un botón Para asignar un evento a un botón se puede ingresar directamente el nombre del evento (entre comillas simples) o hacer clic al botón. Al utilizar este selector de eventos se visualiza el siguiente diálogo, con los eventos disponibles, habilitando al usuario la creación un nuevo evento. 23

24 Función LINK La función LINK permite enlazar un web panel con otro web panel o URL. Esta función se puede asociar a la propiedad link de un control dentro de cualquier evento del Web Panel, teniendo como resultado que al hacer click sobre dicho control se realiza la llamada al Web Panel o URL referenciado en el link. La sintaxis de la función link es: link(objeto/url, [par1], [par2],..., [parn]) siendo Objeto/URL el Web Panel o URL a llamar y [par1]...[parn] el conjunto de parámetros a pasar a los mismos. NOTAS: 1. El Objeto debe ser seleccionado utilizando la opción Insert/Object o Ctrl+B. Ej: &var.link = link(hlogin) 2. Si se desea llamar a una URL, la URL debe ser ingresada entre (comillas simples/dobles). Ej.: &var.link = link( ). 3. Si se desea hacer un link utilizando un atributo que contiene la url o el nombre del Web Panel correspondiente, se debe utilizar la siguiente sintaxis: &var.link = link(att:apllnk), siendo AplLnk un atributo de alguna tabla. 4. El pasaje de parámetros es opcional. Comando LINK Ver Comandos/LINK. CALL s VS LINK s Para relacionar web panels dentro de una aplicación se dispone de los comandos call, link y la función link. A continuación se realiza una comparación para aclarar las diferencias entre los mismos. Desde un web panel se puede hacer CALL a: Web Panels Procedimientos (que no tengan "salida") La función y el comando LINK puede hacer referencia a: web panels Páginas HTML estáticas 24

25 NOTAS: 1. La función link se dispara cuando el usuario hace click sobre el mismo. 2. El comando link, en cambio se ejecuta en forma automática cuando se ejecuta el evento. A diferencia del call, el comando link permite redireccionar a otros sitios web o páginas dentro de otros directorios del sitio donde se está ejecutando el Web Panel. 3. La única forma de llamar a un procedimiento es con un call. 25

26 Tablas Como se ha mencionado anteriormente, en Web Panels se deben utilizar tablas para poder alinear los controles dentro del formulario y de esta forma mejorar el diseño de los mismos. Para insertar una tabla se debe utilizar el botón de la barra de controles. Una tabla está compuesta por filas y celdas, dentro de las que se encuentran los controles. Propiedades de las tablas Las propiedades varían dependiendo de la selección realizada, es decir que las propiedades disponibles para una celda tienen alguna variación con respecto a las disponibles para la tabla o la fila. A continuación se documentan las propiedades a nivel de tabla, fila y celda. Para editar las propiedades de una tabla se debe marcar la tabla (el puntero del mouse cambiará al posicionarse en los bordes de la misma) y presionar el botón derecho del mouse. Seleccionar la opción Properties del menú pop-up que se despliega. Otra forma de editarlas es presionando el botón derecho del mouse estando posicionado en cualquier celda de la tabla, y después ir a la sección de Table. En este caso, se podrán editar además de las propiedades de la tabla, las de la fila a la que pertenezca la celda y las propias de la celda. 26

27 1. Tooltip Text 2. Align 3. Background 4. Backcolor 5. BorderWidth: 0 indica que no tendrá borde en ejecución, pero podrá verse en diseño usando el botón defecto es BorderColor 7. Cellpadding 8. Cellspacing 9. Height 10. Width 11. Rules de la barra de herramientas. El valor por Propiedades de las filas de una tabla Como se puede observar en el diálogo de propiedades sección ROW-, se pueden asignar valores a propiedades para una fila particular dentro de las tablas. Estos valores tendrán preferencia a los asignados para la tabla en general. Las propiedades de las filas son algunas de las propiedades de las tablas y tienen además una nueva propiedad que es la que se documenta a continuación: 27

28 1. TooltipText 2. Align 3. Vertical Align 4. Background 5. Backcolor 6. BorderColor Propiedades de las celdas de una tabla Como se puede observar en el diálogo de propiedades, las celdas mantienen algunas propiedades de las tablas y tienen dos nuevas propiedades que se documentan a continuación: 1. Tooltiptext 2. Align 3. VerticalAlign 4. Background 5. Backcolor 6. Bordercolor 7. Height 8. Width 9. Colspan 10. Rowspan 28

29 SUBFILES El botón que se encuentra en la barra de controles, permite insertar el control subfile. Los subfiles permiten desplegar datos repetitivos, en atributos o variables. Las columnas de los subfiles pueden ser atributos, variables (incluyendo las de tipo bitmap). Cómo desplegar datos en un subfile Por defecto todo atributo y variable que está dentro de un subfile se despliega en ejecución como texto, es decir que son únicamente de lectura y por consiguiente no pueden ser modificados. Cómo aceptar datos en un subfile Es posible aceptar datos en las variables de un subfile dependiendo de la programación de los eventos existentes en el objeto: si dentro de un evento del Web Panel se está utilizando el comando For each line o For each line in <subfile>, todas las variables que están dentro del subfile pasan a ser de ingreso. Es posible indicar en este caso cuáles son las variables que no van a poder ser modificadas, utilizando la regla noaccept() o modificando la propiedad Read Only de la variable dentro del subfile. Cómo asociar eventos a una línea de un subfile Es posible asociar un evento a una variable de tipo bitmap que pertenezca al subfile. Por más información referirse a la sección Imágenes. 29

30 Propiedades del Subfile En este nuevo editor, se cuenta con una serie de mejoras para el diseño de los subfiles. A continuación se detallan las propiedades generales del subfile: descripción 1. Control Name 2. Auto Resize 3. Width 4. LineColor 5. LineFont 6. TitleColor 7. TitleFont 8. BackColorStyle 9. Rows NOTAS: 1. Cálculo del ancho de cada columna de un subfile. El ancho de cada columna de un subfile se especifica como un porcentaje del ancho total del subfile (que por defecto no se especifica, el browser lo calcula en función al contenido de todas las celdas). El ancho del subfile NO se deduce como la suma de los anchos de las columnas, ya que si estos se especifican en valores relativos (porcentajes), puede no corresponderse a lo deseado. 30

31 2. Las propiedades LineColor, LineFont, TitleColor y TitleFont aplican a todas las columnas del subfile, para modificar los valores correspondientes a una determinada columna, se deben modificar las propiedades de la misma (ver mas adelante). LineColor, LineFont Permiten indicar el color y el tipo de letra de las líneas del subfile. Table Los subfiles también tienen algunas propiedades configurables para las tablas Estas propiedades son: 1. ToolTiptext 2. Align 3. Background, 4. BorderWidth 5. Cellpadding 6. Cellspacing 7. Rules. Propiedades modificables en ejecución A continuación se detallan las propiedades que se pueden modificar a los subfiles en tiempo de ejecución: 1. Visible: si la propiedad Visible tiene el valor 0, el subfile completo desaparece del formulario. Propiedades de las columnas del subfile También es posible indicar propiedades particulares para las diferentes columnas que forman el subfile. Para esto, se debe seleccionar la opción Columns del menú que aparece al hacer clic en el subfile. En ese diálogo, seleccionando Properties sobre una columna se despliega el siguiente diálogo: 31

32 Las propiedades son: 1. ReadOnly 2. Autoresize 3. Width 4. Position 5. Title 6. TitleFormat 7. TitleFont 8. TitleForeColor 9. Visible 10. Heigth 11. BorderWidth 12. AlternateText 13. Tooltiptext 14. HorizontalSpace 15. VerticalSpace Propiedades de columnas en tiempo de ejecución En tiempo de ejecución se pueden modificar las siguientes propiedades de las columnas de un subfile: 1. Backcolor 2. Backstyle 3. Enabled 4. FontBold 5. FontItalic 32

33 6. FontName 7. FontSize 8. FontStrikeThru 9. FontUnderline 10. ForeColor 11. Format 12. IsPassword 13. Link 14. LinkTarget 15. Title 16. TitleBackcolor 17. TitleBackstyle 18. TitleFontBold 19. TitleFontItalic 20. TitleFontName 21. TitleFontSize 22. TitleFontStrikeThru 23. TitleFontUnderline 24. TitleForeColor 25. TitleFormat 26. Visible 33

34 Subfile Freestyle El subfile Freestyle permite al usuario definir el formato de los datos a desplegar de una forma menos estructurada que con el subfile tradicional. Para insertar el subfile Freestyle se debe utilizar el botón disponibles. de la barra de controles El subfile Freestyle es básicamente una tabla a la que se le pueden insertar los atributos / variables, text blocks y/o imágenes que se van a mostrar posteriormente en la pantalla. Este nuevo tipo de subfile no posee títulos para las columnas y además permite tener más de un tipo de control, atributo / variable en una misma celda, proporcionando de esta forma mayor libertad de diseño. Cabe destacar que el subfile Freestyle posee las mismas propiedades mencionadas anteriormente para el subfile tradicional. En este caso para poder visualizar las propiedades hay que seleccionar la tabla donde se encuentran los atributos / variables. El comportamiento de las variables dentro de un subfile Freestyle es análogo al que presentan dentro de un subfile, por lo tanto también quedan de ingreso si existe un For each line o For each line in <subfile> dentro de algún evento. Nuevamente este comportamiento puede modificarse, agregando la regla noaccept o cambiando la propiedad Read Only. 34

35 Propiedades del subfile Freestyle Para visualizar las propiedades de un subfile Freestyle, hay que seleccionar la tabla del subfile, presionar el botón derecho del mouse y seleccionar la opción Properties. A continuación se documentan las propiedades disponibles para el subfile Freestyle. 1. Control Name 2. BackColorStyle 3. Rows 4. Cols Propiedades modificables en ejecución En tiempo de ejecución se puede modificar la siguiente propiedad: 1. Visible: Si la propiedad Visible tiene el valor 0, el subfile free-style desaparece del formulario En el caso de tener subfiles anidados, la propiedad Visible aplicada al subfile padre, aplica también a los subfiles hijos. 35