Wyłączanie akcji podczas animacji (C#)

  • Artykuł

Autor: Christian Wenz

Pobierz plik PDF

Kontrolka Animacja w zestawie narzędzi kontroli AJAX ASP.NET to nie tylko kontrolka, ale cała struktura umożliwiająca dodawanie animacji do kontrolki. Obsługuje również akcje, takie jak kliknięcia myszą. Jednak po kliknięciu myszą rozpoczyna animację, pożądane jest wyłączenie kliknięć myszą podczas animacji.

Omówienie

Kontrolka Animacja w zestawie narzędzi kontroli AJAX ASP.NET to nie tylko kontrolka, ale cała struktura umożliwiająca dodawanie animacji do kontrolki. Obsługuje również akcje, takie jak kliknięcia myszą. Jednak po kliknięciu myszą rozpoczyna animację, pożądane jest wyłączenie kliknięć myszą podczas animacji.

Kroki

Najpierw dołącz element ScriptManager na stronie, a następnie załadowano bibliotekę ASP.NET AJAX, umożliwiając korzystanie z zestawu narzędzi Control Toolkit:

<asp:ScriptManager ID="asm" runat="server" />

Animacja zostanie zastosowana do przycisku HTML w następujący sposób:

<input type="button" ID="Button1" runat="server" Value="Launch Animation" />

Należy pamiętać, że kontrolka HTML jest używana zamiast kontrolki sieci Web, ponieważ nie chcemy, aby przycisk tworzył ogłaszanie zwrotne; po prostu uruchomi dla nas animację po stronie klienta.

Następnie dodaj element AnimationExtender do strony, podając IDatrybut , TargetControlID i obowiązkowy element runat="server":

<ajaxToolkit:AnimationExtender ID="ae" runat="server" TargetControlID="Button1">

W węźle <Animations> znajduje się odpowiedni element do <OnClick> obsługi kliknięcia myszą. Można jednak kliknąć przycisk podczas animacji. Element <EnableAction> może się tym zająć. Ustawienie Enabled="false" wyłącza przycisk w ramach animacji. Ponieważ używamy kilku pojedynczych animacji (wyłączenie przycisku i rzeczywistych animacji), <Parallel> element jest wymagany do sklejania pojedynczych animacji w jeden. Oto pełna adiustacja dla elementu 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>

Po animacji można również ponownie włączyć przycisk , używając następującego elementu XML na końcu listy:

<EnableAction Enabled="true" />

Jednak w danym scenariuszu byłoby to bezużyteczne, ponieważ przycisk zanika i nie jest widoczny na końcu animacji.

Przycisk jest wyłączony natychmiast po uruchomieniu animacji

Przycisk jest wyłączony natychmiast po uruchomieniu animacji (kliknij, aby wyświetlić obraz pełnowymiarowy)

WsteczDalej