はじめに
1月24日ASP.NET AJAX V1.0が正式リリースされました。ASP.NETを使いながらAJAXをお手軽に実装する事が可能な技術なので、これからのASP.NET 2.0を用いた開発の中では様々な場所でASP.NET AJAXが利用される事が予想されます。まだASP.NET1.1での開発しかしたことがない人でも、ASP.NET AJAX V1.0のASP.NET 2.0 AJAX Extensionsは、前回の記事を見て少し勉強するだけで利用することが出来るので、ぜひ触れてみてください。バージョンはRCですが、記事で書かれている部分について、正式版では変更がされていないので、そのまま参考にすることができます。
今回は、ASP.NET AJAXの1つASP.NET AJAX Control Toolkit(以下、Control Toolkit)はASP.NET 2.0上で動作するAJAXの機能を持ったコントロール集です。現在、このコントロールは32個開発されていて、それらを利用することができます。前回の記事で利用したASP.NET 2.0 AJAX ExtensionsはMicrosoftのASP.NET開発チームが開発したツールですが、このControl ToolkitはMicrosoftのASP.NET開発チームとコミュニティによる共同開発で開発が行われました。そのため、Control Toolkitをダウンロードする際にはCodePlexというMicrosoftが運用に携わっているオープンソースコミュニティを利用することになります。
このControl Toolkitは現段階でも開発生産性の高い高度な機能を持ったコントロール集ですが、正式版がリリースされた後でもControl Toolkitのコントロールは追加され、バグフィックスなどを盛り込んだリリースが行われます。
本稿はControl Toolkitの中の1つであり、Webページにさまざまなエフェクト効果を追加するアニメーションフレームワークであるAnimationExtenderコントロールについて紹介します。AnimationExtenderコントロールが持つアニメーションは次のようになっています(図1)。
本稿では、いくつかのアニメーションを実際にサンプルを作りながら解説していきたいと思います。なお、本稿執筆時のバージョンは「ASP.NET AJAX 1.0」となっています。
対象読者
- ASP.NET 2.0を使ったことがある人
- ASP.NET AJAXに興味がある人
- AJAXに興味がある人
- AJAXに興味があるが、JavaScriptが分からない人
必要な環境と準備
- Visual Web Developer 2005 Express EditionもしくはVisual Studio 2005(以下、VS)
- ASP.NET AJAX V1.0
- ASP.NET AJAX Control Toolkit
ASP.NET AJAXの入手方法、インストール方法は前回の記事を参照してください。続いて、Control Toolkitの入手方法ですが、公式サイトにアクセスし、画面上部の[Download]という項目を選択します。選択後、[ASP.NET AJAX Control Toolkit]を選択してCodePlexのダウンロード画面に遷移します。
ページ遷移後、[Runtime Binaries]の[AjaxControlToolkit.zip]をクリックすると、ダウンロード時の利用規約画面に変わります。確認後に[I Agree]ボタンをクリックすることでControl Toolkitのファイルをダウンロードすることができます(図2)。
ダウンロード後確認することができますが、zipファイルにはASP.NET 2.0 AJAX Extensionsのようなインストーラがありません。解凍時のフォルダ内は、次のような構成になっていると思います(図3)。
ここで、AjaxControlExtenderフォルダをクリックしてください。
フォルダの中には「AjaxControlExtender.vsi」というコンテンツインストーラがあり、これを実行します。すると、次のようなインストーラが実行されます(図4)。
ここでは、AJAX Control Toolkit Extender Projectと、AJAX Control Toolkit Extender(自作のAJAX Controlを作るためのプロジェクトテンプレート)と、AJAX Control Toolkit Website(Control Toolkitを使ってWebSiteを構築するテンプレート)をインストールすることができます。VBとC#のどちらか必要な方だけチェックを付けることもできますが、基本的にはチェックを外さないで[次へ]をクリックすることをお勧めします。
以上でControl Toolkitのテンプレートのインストールは完了です。また、「SampleWebSite」フォルダはWeb上で公開されているControl ToolkitのWebサイトをそのまま含んでいます。このWebサイトでは、どのようにサイトが構築されているのかを参考にすることができるので、Control Toolkitを利用しようと考えている人にとっては必見です。そして、Control ToolkitのdllもこのWebサイト内のBinフォルダにあるので、任意の場所にコピーすることで使用可能になります。SampleWebSiteをよく参照する方は、「C:\ユーザー名\Documents\Visual Studio 2005\WebSites」内に配置するのがお勧めです。基本的にControlToolkitを利用するだけの方は「C:\Program Files\Microsoft ASP.NET」内にASP.NET 2.0 AJAX Extensions等と同じ場所に配置するのがお勧めです。