Deshabilitar las acciones durante la animación (VB)
por Christian Wenz
El control Animation del Kit de herramientas de control de ASP.NET AJAX no es solo un control, sino un marco completo para agregar animaciones a un control. También admite acciones, como clics del mouse. Sin embargo, cuando un clic del mouse inicia una animación, es conveniente deshabilitar los clics del mouse durante la animación.
Información general
El control Animation del Kit de herramientas de control de ASP.NET AJAX no es solo un control, sino un marco completo para agregar animaciones a un control. También admite acciones, como clics del mouse. Sin embargo, cuando un clic del mouse inicia una animación, es conveniente deshabilitar los clics del mouse durante la animación.
Pasos
En primer lugar, incluya el elemento ScriptManager en la página; a continuación, se carga la biblioteca ASP.NET AJAX, lo que permite usar el Kit de herramientas de control:
<asp:ScriptManager ID="asm" runat="server" />
La animación se aplicará a un botón HTML como este:
<input type="button" ID="Button1" runat="server" Value="Launch Animation" />
Observe que se usa un control HTML en lugar de un control web, ya que no queremos que el botón cree un postback; simplemente iniciará la animación del lado cliente para nosotros.
A continuación, agregue el elemento AnimationExtender a la página, y proporcione un valor ID, el atributo TargetControlID y el elemento runat="server" obligatorio:
<ajaxToolkit:AnimationExtender ID="ae" runat="server" TargetControlID="Button1">
Dentro del nodo <Animations>, <OnClick> es el elemento derecho para controlar el clic del mouse. Sin embargo, también se podría hacer clic en el botón durante la animación. El elemento <EnableAction> puede ocuparse de ello. El valor Enabled="false" deshabilita el botón como parte de la animación. Puesto que estamos usando varias animaciones individuales (deshabilitando el botón y las animaciones reales), el elemento <Parallel> es necesario para consolidar las animaciones individuales en una sola. Este es el marcado completo de AnimationExtender:
<ajaxToolkit:AnimationExtender ID="ae" runat="server" TargetControlID="Button1">
<Animations>
<OnClick>
<Parallel>
<EnableAction Enabled="false" />
<FadeOut Duration="1.5" Fps="24" />
<Resize Width="1000" Height="150" Unit="px" />
</Parallel>
</OnClick>
</Animations>
</ajaxToolkit:AnimationExtender>
También sería posible volver a habilitar el botón después de la animación, mediante el siguiente elemento XML al final de la lista:
<EnableAction Enabled="true" />
Sin embargo, en el escenario dado no sería útil, ya que el botón se desvanece y no está visible al final de la animación.
El botón se deshabilita en cuanto se ejecuta la animación (haga clic para ver la imagen a tamaño completo).
