Puede
utilizar código EGL para llamar a funciones Java reconocidas por componentes JSF. De ese modo,
puede cambiar el aspecto y el comportamiento de estos componentes desde un pageHandler de
EGL. A continuación figura un ejemplo de archivo de código de página que incluye código
EGL para acceder a un componente JSF:
package pagehandlers ;
import com.ibm.egl.jsf.*;
pageHandler myPageHandler
{onPageLoadFunction = onPageLoad,
view = "myPage.jsp",
viewRootVar = "myViewRoot"}
myViewRoot UIViewRoot;
function onPageLoad()
myInputField HtmlInputText;
myInputField = myViewRoot.findComponent("form1:text1");
myInputField.setStyle("color : red");
end
end
Para acceder a un componente JSF desde un pageHandler, siga estos pasos:
- Asegúrese de que el proyecto Web EGL tiene soporte para la interfaz de componentes
JSF. Consulte la sección Añadir soporte de interfaz de componentes JSF a un proyecto
Web EGL.
- Cree un archivo Faces JSP y añádale uno o varios componentes JSF.
- Opcionalmente, puede cambiar el atributo de ID de los componentes JSF para que sea
más fácil encontrarlos desde el código EGL. Puede cambiar el atributo de ID seleccionando
el componente y especificando un nemotécnico significativo en el campo
ID de la vista Propiedades.
- En el archivo de código de página de la página, añada el siguiente código. Si ha
creado el archivo Faces JSP después de añadir soporte para la interfaz de componentes JSF
al proyecto, este código se añadirá al archivo de código de página automáticamente.
- Añada la siguiente sentencia import:
import com.ibm.egl.jsf.*
Los
paquetes importados por esta sentencia contienen una serie de componentes de interfaz, cada uno de
los cuales proporciona acceso a código
Java. No es necesario entender el
mecanismo de la interfaz, aunque se suministra una descripción del mismo en la sección
Tecnología de las interfaces de EGL.
- Dentro del pageHandler de la página, declare una variable de tipo UIViewRoot.
- Especifique el nombre de la variable UIViewRoot en la propiedad viewRootVar de
pageHandler.
- En una línea vacía de una función del pageHandler,
pulse Control+Mayús+Z.
Se abrirá la ventana Asistente de código fuente EGL, que visualizará los componentes JSF
de la página.
- En la ventana Asistente de código fuente de EGL, seleccione el componente JSF al que
desee acceder.
- Pulse Aceptar.
El asistente de código fuente EGL
añadirá dos líneas de código EGL al pageHandler:
- Utilice la variable para cambiar el componente JSF. Por ejemplo, el código que sigue
utiliza la función setStyle para cambiar el texto de un campo de entrada al color rojo:
myInputField.setStyle("color : red");
Cuando
se ejecuta este código, cambia el estilo del campo de entrada. En este ejemplo, el código
HTML visualizado por el navegador es el siguiente:
<input id="form1:text1" type="text" name="form1:text1" style="color : red" />
A continuación siguen algunas notas relativas al acceso a componentes JSF
mediante código EGL:
- Para obtener una lista completa de las funciones JSF accesibles en EGL, abra el
archivo FacesHtmlComponent.egl del paquete com.ibm.egl.jsf. Este archivo se añade al
proyecto cuando se añade soporte para la interfaz de componentes JSF. Las funciones se
describen brevemente en los comentarios de este archivo. Para obtener información más
detallada, consulte la documentación de los componentes de Faces.
- Al pasar un parámetro a una de estas funciones, asegúrese de pasar el tipo de datos
correcto. Debido a que muchos de los parámetros pasados a estas funciones se insertan en
atributos HTML, deben pasarse con variables de serie EGL, aunque el nombre de la función
sugiera que el parámetro es un valor numérico o booleano.
Por ejemplo, la función
setWidth establece la anchura de un componente en píxels o en un porcentaje de su tamaño
original si se añade el símbolo de porcentaje (%). Dado que el parámetro de esta
función es una medición, puede parecer que utiliza un tipo de datos integer (entero) como
valor. Sin embargo, esta función debe recibir una serie. Para establecer la anchura de un
componente en 300 píxels, debe pasar una variable de serie con el valor "300".
- Debido a que muchas de las funciones establecen o devuelven información desde
atributos HTML, debe conocer los atributos HTML conectados a las funciones que está
utilizando. Puede cambiar un atributo HTML necesario para que la página funcione
correctamente. Por ejemplo, si cambia la clase de estilo de un componente como se indica
en la sección Cambiar la clase de estilo de un componente JSF, esa nueva clase de
estilo del componente debe estar disponible para la página en un archivo CSS o código
style; de lo contrario, puede que el componente no se visualice correctamente. Asegúrese
de probar los cambios efectuados en las páginas Web. Los comentarios del archivo
FacesHtmlComponent.egl indican las funciones que cambian atributos HTML directamente.
- En la mayoría de los casos, los cambios efectuados en los componentes JSF no son
acumulativos.
Por ejemplo, si establece el texto de un componente en color rojo con el código
myComponent.setStyle("color: red"); y luego establece el texto del mismo
componente en negrita con el código myComponent.setStyle("font-weight:
bold");, el texto se visualizar en negrita, pero no en rojo, ya que el cambio a
negrita sobreescribe el cambio a rojo.
Para añadir varios cambios a un componente JSF,
recupere el estado actual del componente y añada los datos nuevos, prestando atención a
cómo se delimita la lista de cambios. Por ejemplo, utilice el código siguiente para
cambiar el texto de un componente a negrita y rojo, sin sobreescribir los cambios
anteriores del estilo de ese componente:
myStyleString string;
myStyleString = myComponent.getStyle() + "; color: red; font-weight: bold";
myComponent.setStyle(myStyleString);
Puede realizar gran número de cambios en los componentes
JSF. Consulte las tareas relacionadas para ver algunos ejemplos.