|
|
前のページ 1 2 3 次のページ
|
|
DragOverlayExtenderコントロールを使ってみる
|
ツールボックスにコントロールを追加できましたので、実際に使ってみましょう。まずはASP.NET AJAX Futures January CTPからDragOverayExtenderコントロールを使ってみます。
図10のようにDragOverayExtenderコントロールとASP.NET標準のコントロールであるPanelコントロールを貼り付けます。
図10:DragOverayExtenderコントロールの貼り付け (画像をクリックすると別ウィンドウに拡大図を表示します)
次に表2のように、各コントロールのプロパティを設定します。
コントロール |
プロパティ |
設定値 |
DragOverayExtender |
TargetControlID |
Panel1 |
Enabled |
TRUE |
Panel |
BackColor |
Aqua |
表2:コントロールのプロパティ設定値
これで完成です。ここまででコードは1行も書いていません。実行してみるとパネルをドラッグで移動できることが確認できます。
図11:実行結果 (画像をクリックすると別ウィンドウに拡大図を表示します)
|
Extenderコントロールとは
|
DragOverayExtenderコントロールやASP.NET AJAX Control Toolkitに含まれるコントロールの基本的な考え方は、既存のコントロールに機能を付加するというものです。
図11のサンプルでは、ドラッグで動くのはPanelコントロールになります。Panelコントロール自体ではこのような機能は持っていないため、DragOverayExtenderコントロールを貼り付けることによって実現しています。
これはDragOverayExtenderコントロールがPanelコントロールの機能を拡張する(extend)という考え方の元にコントロールが作られているためです。
|
Panelコントロールの状態の保持
|
ここで、図11のサンプルでPanelコントロールを移動させた状態で、Webブラウザの更新ボタンをクリックしてみましょう。すると、動かしたはずのPanelコントロールが初期表示位置に戻ってしまいます。
では、動かした位置を覚えさせるにはどうすればいいのでしょうか。
実はASP.NET 2.0にはパーソナライズを実現するためのプロファイル機能が備わっています。これを容易に使えるようにするProfileServiceコントロールもASP.NET AJAX Futures January CTPに含まれています。次はプロファイル機能を使って、移動位置を覚えさせるサンプルに修正してみましょう。
まずは、ASP.NET 2.0のプロファイル機能を利用可能とするためのWeb.Configファイルを設定しましょう。下記のコードをWeb.Configファイルの<system.web>セクションに追加してください。
<!--匿名ユーザの識別を行うように設定-->
<anonymousIdentification enabled="true"/>
<!--プロファイルに保存するプロパティの設定-->
<profile>
<properties>
<add name="PanelPos" allowAnonymous="true" type="String"/>
</properties>
</profile>
次にProfileServiceコントロールで、ここで作成したプロファイルプロパティにアクセスできるように設定を行います。下記のコードをWeb.Configファイルの<system.web.extensions> - <scripting> - <webServices>セクションに追加してください。
<profileService enabled="true" readAccessProperties="PanelPos" writeAccessProperties="PanelPos" />
これでWeb.Configファイルの設定は完了です。次に、DragOverayExtenderコントロールを貼り付けたページにProfileServiceコントロールを図12のように貼り付けます。
図12:ProfileServiceコントロールの貼り付け (画像をクリックすると別ウィンドウに拡大図を表示します)
次に表3のように、各コントロールのプロパティを設定します。
コントロール |
プロパティ |
設定値 |
ProfileService |
AutoSave |
TRUE |
DragOverlayExtender |
ProfileServiceID |
ProfileService1 |
ProfileProperty |
PanelPos |
表3:コントロールのプロパティ設定値
これで完成です。先ほどと同じようにパネルをドラッグで移動できることが確認できると思います。さらに、今回はパネル移動後にWebブラウザの更新を行ってもパネル位置が初期状態に戻らないことも確認できると思います。
図13:ProfileService利用時の実行結果け (画像をクリックすると別ウィンドウに拡大図を表示します)
|
WebPartZoneコントロールとWebPartManagerコントロール
|
ASP.NET 2.0ではユーザごとにページの表示状態をカスタマイズすることが可能なWebParts機能が提供されています。この機能では、WebPartの移動や最小化などを行うたびにポストバックが発生するようになっており、使い勝手がいいとはいえません。
この動作をAjax的に変更するために準備されたのがASP.NET AJAX Futures January CTPの「WebPartZoneコントロール」と「WebPartManagerコントロール」です。
このコントロールはUpdatePanelコントロールと組み合わせて利用する点がポイントとなります。使い方についてはASP.NET 2.0のWebParts機能と変わらないため、今回は詳細な利用方法についての解説は割愛します。
|
前のページ 1 2 3 次のページ
|
|
|
|
|
|