¡Esta es una revisión vieja del documento!

Animaciones en Colecciones


A partir de la v4.8.8.6 del framework de Android y las versiones del Framework de iOs que ya estaban disponibles con anterioridad, se ha implememntado incluir animaciones a nivel de colección para cuando se entra y se sale de un objeto en edición.

Estas se implementan definiendo los atributos de colección animation-in y animation-out, que pueden tomar los valores siguientes:

Efectos Valor del Atributo animation_in/out
Transparencia “##ALPHA##” o “##FADE##”
Entrada/salida por la izquierda “##LEFT##”
Entrada/salida por la derecha “##RIGHT##”
Entrada/salida por arriba “##TOP##”
Entrada/salida por abajo “##BOTTOM##”
Efecto de zoom “##ZOOM##”
Efecto de crecer/decrecer “##GROW##”



Se pueden combinar los atributos animation-in y animation-out como se quiera.

Por ejemplo: 

<coll ... animation-in="##GROW##" animation-out="##ALPHA##" ... />


Si sólo se define uno de ellos, el que resta por definir tomará la animación por defecto del sistema operativo.


Es recomendable desactivar el cuadro de diálogo de “Cargando…” que pone la ventana cuando está pintando todavía los controles, con el atributo load-wait=“false” del nodo <app>, para evitar se observe flash al lanzar la ventana, puesto que suele ser muy rápido pintando.



Efecto de Transparencia


Atributo Valor del atributo
animation_in / animation_out “##ALPHA##” o “##FADE##”


Ejemplo: 

<coll name="Alpha" animation-in="##ALPHA##" animation-out="##ALPHA##" bgcolor="#000000" notab="true" special="true">
    <group name="General" id="1" align="center" bgcolor="#000000">
        <prop name="MAP_SALIR" type="B" title="Salir" width="80%" height="10%" visible="7" onclick="ui.getView().exit();" />
    </group>
</coll>



Entrada/salida por la izquierda


Atributo Valor del atributo
animation_in / animation_out “##LEFT##”


Ejemplo: 

<coll name="LeftInLeftOut" animation-in="##LEFT##" animation-out="##LEFT##" bgcolor="#000000" notab="true" special="false" show-toolbar="false" check-owner="false" dependent="false">
    <group name="General" id="1" align="center" bgcolor="#000000">
        <prop name="MAP_SALIR" type="B" title="Salir" width="80%" height="10%" visible="7" onclick="ui.getView().exit();" />
    </group>
</coll>


Entrada/salida por la derecha


Atributo Valor del atributo
animation_in / animation_out “##RIGHT##”


Ejemplo: 

<coll name="RightInRightOut" animation-in="##RIGHT##" animation-out="##RIGHT##" bgcolor="#000000" notab="true" special="false" show-toolbar="false" check-owner="false" dependent="false">
    <group name="General" id="1" align="center" bgcolor="#000000">
        <prop name="MAP_SALIR" type="B" title="Salir" width="80%" height="10%" visible="7" onclick="ui.getView().exit();" />
    </group>
</coll>


Entrada/salida por arriba


Atributo Valor del atributo
animation_in / animation_out “##TOP##“


Ejemplo: 

<coll name="RightInRightOut" animation-in="##TOP##" animation-out="##TOP##" bgcolor="#000000" notab="true" special="false" show-toolbar="false" check-owner="false" dependent="false">
    <group name="General" id="1" align="center" bgcolor="#000000">
        <prop name="MAP_SALIR" type="B" title="Salir" width="80%" height="10%" visible="7" onclick="ui.getView().exit();" />
    </group>
</coll>


Entrada/salida por abajo


Atributo Valor del atributo
animation_in / animation_out ”##BOTTOM##“


Ejemplo: 

<coll name="RightInRightOut" animation-in="##BOTTOM##" animation-out="##BOTTOM##" bgcolor="#000000" notab="true" special="false" show-toolbar="false" check-owner="false" dependent="false">
    <group name="General" id="1" align="center" bgcolor="#000000">
        <prop name="MAP_SALIR" type="B" title="Salir" width="80%" height="10%" visible="7" onclick="ui.getView().exit();" />
    </group>
</coll>


Efecto de crecer/decrecer


Atributo Valor del atributo
animation_in / animation_out ”##GROW##”


Ejemplo: 

<coll name="Grow" animation-in="##GROW##" animation-out="##GROW##" bgcolor="#000000" notab="true" special="false" show-toolbar="false" check-owner="false" dependent="false">
    <group name="General" id="1" align="center" bgcolor="#000000">
        <prop name="MAP_SALIR" type="B" title="Salir" width="80%" height="10%" visible="7" onclick="ui.getView().exit();" />
    </group>
</coll>

Efecto de zoom


Atributo Valor del atributo
animation_in / animation_out “##ZOOM##“


Ejemplo: 

<coll name="ZoomInZoomOut" animation-in="##ZOOM##" animation-out="##ZOOM##" bgcolor="#000000" notab="true" special="false" show-toolbar="false" check-owner="false" dependent="false">
    <group name="General" id="1" align="center" bgcolor="#000000">
        <prop name="MAP_SALIR" type="B" title="Salir" width="80%" height="10%" visible="7" onclick="ui.getView().exit();" />
    </group>
</coll>