サーバー側からアニメーションを変更する (VB)

作成者: Christian Wenz

PDF のダウンロード

ASP.NET AJAX Control Toolkit の Animation コントロールは、単なるコントロールではなく、コントロールにアニメーションを追加するためのフレームワーク全体です。 アニメーションは、サーバー側でも変更できます

概要

ASP.NET AJAX Control Toolkit の Animation コントロールは、単なるコントロールではなく、コントロールにアニメーションを追加するためのフレームワーク全体です。 アニメーションは、サーバー側でも変更できます

手順

まず、ページに ScriptManager を含めます。これにより、ASP.NET AJAX ライブラリが読み込まれ、Control Toolkit を使用できるようになります。

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

アニメーションは、次のようなテキストのパネルに適用されます。

<asp:Panel ID="panelShadow" runat="server" CssClass="panelClass">
 ASP.NET AJAX is a free framework for quickly creating a new generation of more 
 efficient, more interactive and highly-personalized Web experiences that work 
 across all the most popular browsers.<br />
 ASP.NET AJAX is a free framework for quickly creating a new generation of more 
 efficient, more interactive and highly-personalized Web experiences that work 
 across all the most popular browsers.<br />
 ASP.NET AJAX is a free framework for quickly creating a new generation of more 
 efficient, more interactive and highly-personalized Web experiences that work 
 across all the most popular browsers.<br />
</asp:Panel>

パネルに関連付けられている CSS クラスで、適切な背景色を定義し、パネルの固定幅も設定します。

<style type="text/css">
 .panelClass {background-color: lime; width: 300px;}
</style>

残りのコードはサーバー側で実行され、マークアップは使用されません。代わりに、コードを使用して AnimationExtender コントロールを作成します。

<script runat="server">
Sub Page_Load()
 Dim ae As New AjaxControlToolkit.AnimationExtender()
 ae.TargetControlID = "Panel1"

ただし、現在、Control Toolkit では、個々のアニメーションを作成するための API アクセスは提供されていません。 しかし、アニメーションを宣言的に割り当てるときに使用される XML マークアップを含む文字列に、AnimationExtender のアニメーション プロパティを設定することは可能です。 <Animations> 要素を含めてはならない XML を作成するには、.NET Framework の XML サポートを使用するか、次のコードのように文字列を指定するだけです。

ae.Animations = "<OnLoad><Parallel><FadeOut Duration=""1.5""
 Fps=""24"" /><Resize Width=""1000""
 Height=""150"" Unit=""px"" /></Parallel></OnLoad>"

最後に、AnimationExtender コントロールを現在のページの <form runat="server"> 要素内に追加し、アニメーションが含まれて実行されることを確認します。

form1.Controls.Add(ae)
End Sub
</script>

アニメーションは、サーバー側の C#/VB コードを使用して作成されます (クリックしてフルサイズの画像を表示します)