Hay dos formas de implementar un componente. Una de ellas es implementar una clase que se derivan de la clase org.zkoss.zk.ui.AbstractComponent. El otro es para ponerlo en práctica mediante el uso de otros componentes.
El primero es más flexible. Se requiere una comprensión más profunda de ZK, por lo que se hace generalmente por los desarrolladores de componentes. Se discute en la Guía de Desarrollo de Componentes.
Por otra parte, la aplicación de un nuevo componente mediante el uso de otros componentes es sencillo. Funciona como la composición, la expansión de macro o de reemplazo en línea. Por el amor de conveniencia, llamamos a este tipo de componentes como componentes macro., Mientras que los otros se llaman componentes primitivos.
Consejo: un componente macro no es diferente de un componente primitivo desde la perspectiva de un desarrollador de aplicaciones, excepto cómo se implementa.
Tres pasos para utilizar los componentes macro
Se necesitan tres pasos para utilizar los componentes macro de la siguiente manera.
1. Implementa un componente macro de una página ZUML.
2. Declarar el componente de macro en la página que se va a usar.
3. Utilice los componentes macro, que hay diferencia de que otros componentes.
Sugerencia: Además de definir un componente de macro en la página, puede poner su definición en un addon de esos idiomas todas las páginas son capaces de tener acceso al componente macro.
Paso 1. La puesta en práctica
Todo lo que necesitas hacer es preparar una página ZUML que describe lo que el componente consiste. En otras palabras, la página es una plantilla de la macro.
Por ejemplo, supongamos que queremos paquete de una etiqueta y un cuadro de texto como un componente macro. Entonces podríamos crear la página, por ejemplo / WEB-INF/macros/username.zul, según se indica.
<hbox> Username: <textbox/> </hbox> Ya está hecho! La página ZUML implementación de un componente macro es lo mismo que cualquier otra página, por lo que cualquier página ZUML puede ser utilizado como un componente macro. Paso 2. La Declaración Antes de crear instancias de un componente macro, tienes que declarar en primer lugar. Uno de manera más sencilla de declarar es utilizar las directivas de los componentes.
<?component name="username" macroURI="/WEB-INF/macros/username.zul"?> Como se muestra, usted tiene que declarar el nombre (el atributo de nombre) y la URI de la página (el atributo macroURI). Otras Propiedades En las adiciones al nombre, macroURI y la clase [1] atributos, puede especificar una lista de propiedades iniciales que se utiliza para inicializar un componente cuando se crea una instancia.
<?component name="mycomp" macroURI="/macros/mycomp.zul" myprop="myval" another="anotherval"?> Por lo tanto
<mycomp/>
Es equivalente a
<mycomp myprop="myval1" another="anotherval"/> Paso 3. El uso El uso de un componente macro no es diferente a los demás.
<window> <username/> </window> Pase Propiedades Al igual que un componente ordinario, puede especificar las propiedades (aka, atributos) cuando se utiliza un componente macro de la siguiente manera.
<?component name="username" macroURI="/WEB-INF/macros/username.zul"?> <window> <username who="John"/> </window> Todas estas propiedades especificadas se almacenan en un mapa que se pasa a la plantilla a través de una variable llamada arg. Luego, en la plantilla, se puede acceder a estas propiedades de la siguiente manera.
<hbox> Username: <textbox value="${arg.who}"/> </hbox> Nota: arg está disponible solo cuando la página macro. Para acceder en el detector de eventos, usted tiene que utilizar getDynamicProperty lugar. Consulte la sección Proporcionar métodos adicionales para obtener más detalles. arg.includer En adición a las propiedades especificadas (aka, atributos), arg.includer una propiedad llamada siempre es pasado a representar a los padres de los componentes definidos en una macro de plantilla. Si una macro regular se crea, arg.includer es el componente macro sí mismo. Si una macro en línea es creada, arg.includer es el componente principal, en su caso. Consulte la sección de macros en línea para obtener más información. En el ejemplo anterior, arg.includer representa el componente regular macro, <username who="John"/> , y es el padre de <hbox> (definido en username.zul).
Macros en línea
Hay dos tipos de componentes macro: en línea [1] y regulares. De forma predeterminada, las macros se supone regular. Para especificar macros en línea, usted tiene que especificar en línea = "true" en la directiva de los componentes.
Una macro se comporta como en línea en línea de expansión. ZK no crea un componente macro si una macro se encuentra en línea. Por el contrario, se expande en línea-los componentes definidos en la macro URI. En otras palabras, funciona como si escribe el contenido de la macro en línea directamente a la página de destino.<?component name="username" inline="true" macroURI="username.zul"?>
<grid>
<rows>
<username id="ua" name="John"/>
</rows>
</grid>
username.zul: (macro definition)
<row> Username <textbox id="${arg.id}" value="${arg.name}"/> </row> equivalente:
<grid>
<rows>
<row>
Username
<textbox id="ua" value="John"/>
</row>
</rows>
</grid>Todas las propiedades, incluyendo su identificación, se pasan a la macro en línea.
Por otra parte, ZK creará un componente real (llamado componente macro) para representar la macro regular. Es decir, el componente de macro se crea como el padre de los componentes que se definen en la macro.
macros en línea son más fáciles de integrar en páginas sofisticados. Por ejemplo, no puede utilizar componentes habituales en el ejemplo anterior desde las filas sólo acepta la fila, no con componentes macro. Es más fácil acceso a todos los componentes definidos en una macro ya que están en el mismo espacio de identificación. También significa que los desarrolladores deben ser conscientes de la ejecución para evitar conflictos de nombres.
macros regulares permiten a los desarrolladores de componentes para proporcionar una API adicional y ocultar la aplicación de los usuarios de los componentes. Cada componente macro regular es propietario del espacio de identificación, lo que no hay conflictos de nombres. Los usuarios regulares de macros normalmente suponen nada acerca de la aplicación. Por el contrario, el acceso a través de la API bien definida.
Un ejemplo
inline.zul: (la definición de macro)
<row>
<textbox value="${arg.col1}"/>
<textbox value="${arg.col2}"/>
</row>
useinline.zul: (the target page)
<?component name="myrow" macroURI="inline.zul" inline="true"?>
<window title="Test of inline macros" border="normal">
<zscript><![CDATA[
import org.zkoss.util.Pair;
List infos = new LinkedList();
for(int j = 0;j <10;++j){
infos.add(new Pair("A" + j, "B" +j));
}
]]>
</zscript>
<grid>
<rows>
<myrow col1="${each.x}" col2="${each.y}" forEach="${infos}"/>
</rows>
</grid>
</window>
Macros Regular
ZK creado un componente real (llamado componente macro) para representar la macro regular como se describe en la sección anterior.
Por el amor de conveniencia, cuando hablamos acerca de los componentes macro de esta sección, nos referimos a los componentes macro regular.Macro componentes y el Espacio ID
Al igual que la ventana, un componente macro es propietario del espacio de identificación. En otras palabras, es libre de utilizar los identificadores de lo que para identificar los componentes dentro de la página implementación de un componente macro (aka, los componentes secundarios del componente macro). No entrará en conflicto con los componentes definidos en la misma página con el componente de macro.
Por ejemplo, supongamos que tenemos un macro definido de la siguiente manera.
<hbox> Username: <textbox id="who" value="${arg.who}"/> </hbox> A continuación, los siguientes códigos funcionan correctamente.
<?component name="username" macroURI="/WEB-INF/macros/username.zul"?> <zk> <username/> <button id="who"/> <!-- no conflict because it is in a different ID space --> </zk> Sin embargo, los siguientes códigos no funcionan.
<?component name="username" macroURI="/WEB-INF/macros/username.zul"?> <username id="who"/> ¿Por qué? Al igual que cualquier propietario espacio de identificación, el componente de macro es en sí misma en el espacio mismo ID con los componentes de su hijo. Hay dos soluciones alternativas: 1. Utilice un prefijo especial para los identificadores de los componentes secundarios de un componente macro. Por ejemplo, "mc_who" en lugar de "quién".
<hbox> Username: <textbox id="mc_who" value="${arg.who}"/> </hbox> 2. Utilice el componente de la ventana para crear un espacio adicional de identificación.
<window> <hbox> Username: <textbox id="who" value="${arg.who}"/> </hbox> </window> La primera solución que se sugiere, en su caso, debido a la simplicidad.Access Components Niño Desde el Exterior Al igual que sus otros espacios de identificación, puede acceder a su componente secundario por el uso de dos llamadas a métodos o getFellow org.zkoss.zk.ui.Path. Por ejemplo, suponga que tiene un componente macro cuyo identificador es llamado "nombre de usuario", y luego podrás acceder a la caja de texto de la siguiente manera.
comp.getFellow("username").getFellow("mc_who"); new Path("/username/mc_who"); Las variables de acceso definidos en los Antepasados Macro componentes funcionan como inline-expansión. Así, al igual que otros componentes, un componente secundario (de un componente macro) puede acceder a cualquier variable definida en el espacio de identificación de los padres. Por ejemplo, el componente nombre de usuario puede tener acceso a los niños v directamente.
<zscript> String v = "something"; </zscript> <username/> Sin embargo, no se recomienda para utilizar esa visibilidad, ya que podría limitar en una macro se puede utilizar. Cambiar macroURI En el tiempo de ejecución Puede cambiar la macro URI dinámica de la siguiente manera.
<username id="ua"/>
<button onClick="ua.setMacroURI("another.zul")"/>