Day08-2
概要
- エディタ/カタログパーツでWebパーツの設定を編集しよう!
このレッスンの狙い
- エディタ/カタログパーツを利用することで、Webパーツのプロパティ値を編集したり、一度閉じたWebパーツを再配置したりといった機能をブラウザ上に追加することが可能。
カタログパーツ
- ページがカタログモードにある場合に表示されるパーツで、ページ内に追加可能なWebパーツの一覧を表示・追加するための手段を提供する。
PageCatalogPartコントロール
- ページ内であらかじめ静的に定義されたWebパーツをカタログ表示する。
- 再配置したいWebパーツと、「追加」欄から追加先のゾーンを選択した上で、「追加」ボタンをクリックすると、Webパーツを追加することができる。
DeclarativeCatalogPartコントロール(宣言カタログ)
PageCatalogPartコントロールがデフォルト表示すべきWebパーツを管理するのに対して、DeclarativeCatalogPartコントロールはあとから追加するためのカタログである。
使用方法
DeclarativeCatalogPartコントロールを使用するには、デザインビューに配置したうえで、コンテキストメニューから[テンプレート編集] - [WebPartsTemplate]を選択する。WebPartsTemplateテンプレートの中に、カタログとして追加したいWebパーツを配置する。WebPartZoneコントロールに配置された場合と同様、GenericWebPartクラスでラッピングされますので、コードエディタから適宜、必要なプロパティ情報を設定することが可能です。
ImportCatalogPartコントロール(インポートWebパーツカタログ)
WebPartsコントロール、現在のWebパーツ設定を.webpartファイルとしてエクスポート- インポート/エクスポート機能を利用することで、あるユーザがパーソナライズした情報をエクスポートしておき、そのファイルを別のユーザ環境でインポートすることでそのまま適用する。といった用途が可能になる。
<uc3:RssReader ID="reader" runat="server"
RssFeed="http://www.wings.msn.to/redirect.php/-/A-12"
Title="サーバサイド技術の学び舎 - WINGS"
ExportMode="All" />
- また構成ファイル(web.config)に対して
<webParts>要素を追加する。
</httpModules>
<webParts enableExport="true" />
</system.web>
- これによって、該当するWebパーツのメニューから[エクスポート]コマンドが選択できる。
- エクスポートされた
.webpartファイルは、ImportCatalogPartコントロールからインポートすることが可能。
Webパーツの設定情報を編集する[エディタパーツ]
- エディタパーツは,ページが編集モードにある場合に表示されるパーツ。
-
ページ内に配置されたWebパーツの見栄えや挙動,カスタムプロパティを設定するための手段を提供する。
- エディタパーツは下記の4つのコントロールが存在する。
| コントロール名 | 説明 |
|---|---|
| AppearanceEditorPart(見栄えの設定) | Webパーツの見栄えに関するプロパティを設定するための手段を提供する。 |
| BehaviorEditorPart(挙動の設定) | Webパーツの挙動に関するプロパティを設定するための手段を提供する。 Webパーツの概要説明やタイトル/カタログアイコン,コマンドの許可/禁止などを設定可能。 |
| LayoutEditorPart(レイアウトの設定) | Webパーツのレイアウトに関するプロパティを設定するための手段を提供する。 |
| PropertyGridEditorPart(Webパーツ固有の設定) | Webパーツ固有のカスタムプロパティを設定するための手段を提供する。 |
PropertyGridEditorPart(Webパーツ固有の設定)
-
Webパーツ固有のカスタムプロパティを設定するための手段を提供する。
-
プロパティが編集可能であることを明示する必要がある。
<Personalizable(true), WebBrowsable()>
<属性(パラメータ,...) [, 属性(...)]> _
属性はメンバに対する追加情報を宣言する。
WebDiplayName,WebDescription属性などを指定することも可能
<WebDisplayName(表示名)>
<WebDescription(プロパティの説明)>
«««< HEAD «««< HEAD
- あとは,
PropertyGridEditorPartコントロールをEditorZoneコントロール内に配置するだけ。 - ブラウザから,ページを編集モードに切り替えたうえで,
RssReader.acsxの「編集」コマンドを選択する。RssFeedプロパティを編集するための,プロパティグリッドが生成されている。
データ型と入力コントロールの関係
| データ型 | 出力コントロール |
|---|---|
String, Int, Float, DateTime |
TextBoxコントロール |
Boolean |
CheckBoxコントロール |
Enum |
DropDownListコントロール |
EditorZone/CatalogZoneコントロールの主なプロパティ
EditorZone/CatalogZoneコントロールは,ゾーン全体の表示方法を管理するためのディレクティヴである。- 下記に,プロパティをまとめる。
| コントロール | プロパティ | 適用部位 |
|---|---|---|
| 共通 | EditUiStyle | 編集可能なコントロールの外観 |
| 共通 | HeaderVerbStyle | ヘッダ上のコマンドの外観 |
| 共通 | InstructionTextStyle | リード文の外観 |
| 共通 | LabelStyle | ラベル部分の外観 |
| 共通 | HeaderCloseVerb | コントロールを閉じるためのコマンドに関する設定 |
| 共通 | InstructionText | 利用手順を説明するリード文 |
| EditorZone | ApplyVerb | [適用]ボタンの設定 |
| EditorZone | CancelVerb | [キャンセル]ボタンの設定 |
| EditorZone | OkVerb | [OK]ボタンの設定 |
| CatalogZone | AddVerb | [追加]ボタンの設定 |
| CatalogZone | CloseVerb | [閉じる]ボタンの設定 |
| CatalogZone | PartLinkStyle | カタログパーツのリンク |
| CatalogZone | SelectedPartLinkStyle | 選択されたカタログパーツのリンク |
| CatalogZone | SelectTargetZoneText | 追加先ゾーンのラベルテキスト |
| CatalogZone | ShowCatalogicons | カタログアイコンを表示するか |
AutoPostBackプロパティ
- ASP.NETでは,変更系のイベント(テキストボックスの値変更等…)では,リアルタイムにポストバック処理が有効になっていない。
- 理由は,イベント処理のたびに,ポストバック(クライアント/ホストの通信)が行われてしまうと,動作が重くなるからである。
- そのため,ASP.NETでは変更系のイベントをプールし,クリック系のイベントが八背したときにまとめてサーバにポストバックする。
- 例外的に変更系のイベントでポスバックを有効にしたい場合は,
AutoPostBackプロパティをTrueにする。
まとめ
- カタログパーツを利用することで,ブラウザ上からWebパーツをページに追加することが可能になる。
- カタログパーツには,
PageCatalogPart,DeclarativeCatalogPart,ImportCatalogPartといったコントロールが用意されている。 - エディタパーツを利用することで,ブラウザ上からWebパーツの情報をカスタマイズすることが可能になる。
- エディタパーツには,
AppearanceEditorPart,BehavoirEdirotPart,LayoutEdirotPart,PropertyGridEditorPartといったコントロールが用意されている。 - ASP.NETでは,デフォルトで変更系のイベントをリアルタイムで処理しない。
- 変更系のイベントをリアルタイムで処理するためには,イベント発生元のコントロールの
AutoPostBackプロパティをTrueにする。
- 変更系のイベントをリアルタイムで処理するためには,イベント発生元のコントロールの
以上