のアーカイブ

"コントロール"タグ付きの投稿

Silverlightコントロールの編集モデルとデフォルトの初期化

第11回、2009年5月 4コメントは、

はじめ

これは、デザイン時の機能の実装上のシリーズの一部であるSilverlightのツールキット 。 この記事は、Silverlightコントロールのデフォルトの初期化を実装し、基礎となる編集モデルのアーキテクチャを説明する方法を説明するためにチャートのデフォルトの初期化子を使用しています。

の経験

がインストールされていればSilverlight 3のツールキットをで2009年3月リリースには、ブレンドのアセットライブラリからChartコントロールをドラッグしてデザイナ画面にドロップし、きれいに初期化し、レンダリングされたチャートを持つことができます。

Chart default initializer

あなたが前の記事でそれについての詳細を読むことができます2009年3月リリースのアップデート：Silverlightツールキットのデザインタイム機能 。

アーキテクチャ

DefaultInitializer

それは、実際にSilverlightコントロールのデフォルトの初期化を提供する非常に単純です。

スクリーンショットの下にDefaultInitializer抽象基底クラスの実装を示しており、まもなく議論されるMicrosoft.Windows.Design.Modelの名前空間内の他のクラス：

DefaultInitializer

初期化はInitializeDefaultsのオーバーライドで行われ、その結果がXAMLにシリアライズされます。 ので、デフォルトの初期化子を実装する最初のステップは、必要なXAMLが生成されるために定義することです。

モデルの編集

結果はXAMLが定義されると、私はXAMLを取ると、より高いレベルの抽象化/メソッドが存在したい。 しかし残念ながら我々ははるかに低いレベル（したがって、より柔軟で強力な）必須APIを使用する必要があることのようなクラスから構成されるモデルの編集と呼ばModelItem 、 ModelProperty 、 ModelEvent 、 ModelFactoryとModelServiceを 。 MSDNのページの編集モデルのアーキテクチャは、基本的な概要を示します。

デザイン時の実装では、編集モデルと呼ばれるプログラミングインターフェースも、実行時のコントロールと対話します。 設計されているオブジェクトは、編集可能なオブジェクトと呼ばれます。

あなたのコントロールは、拡張可能アプリケーションマークアップ言語（XAML）で定義されています。 あなたが編集モデルを使用してプログラムしてコントロールのXAMLを更新。

モデル、ラッパー、およびビュー

モデル、モデルを抽象化するパブリックラッパー、およびモデルのユーザーインターフェイス（UI）を表すビュー：編集モデルは、3つの機能ユニットで構成されています。 モデルとビューが分離されていますが、ラッパーとモデルは密接に関係しています。 次の図は、3つのサブユニット間の関係を示します。

モデル、ModelItem、およびビューの関係

設計環境は、使用してModelItem基礎となるモデルと通信するための型を。 すべての変更が行われているModelItemの基になるモデルに影響を与えるラッパー、。 これは、モデルがシンプルにすることができます。 ModelItemのラッパーは、トランザクションサポートなどの複雑なデザイナ機能を、処理、追跡を取り消し、および変更通知。

クラスダイアグラムの下に編集モデルのコアクラス間の相互作用を説明することが：

Editing Model Class Diagram

例として、XAMLの下に使用します。 

  •   ModelItem：変数項目は、上記のButtonコントロールのためのModelItemと仮定する、 
    •   XAMLでName属性：：item.Name ="ボタンが"xとしてXAMLで永続化される：名前="ボタン"名前は、xとして永続化されます。 
    •  アイテムタイプは、基礎となるコントロールのTypeオブジェクトであり、XAMLで使用されているタグを決定する：item.PropertyType == tyepof（ボタン）、およびXAMLタグは<Button />です。 
    •  プロパティは、基になるコントロールのModelProperty型でラップするプロパティのコレクション、、です。 たとえば、次の項目["ClickMode"] = ClickMode.ReleaseがClickMode ="リリース"のようにXAML内で永続化されます。 
    •  コンテンツは、ContentControlの（およびそのサブクラスによって継承された）で定義されているコンテンツのプロパティを表します。item.Contentは、Rectangleオブジェクトを表すModelItemです。 
    •  ソース：ModelItemが別の要素のプロパティの要素を表す場合、ソースは、そのプロパティのModelPropertyラッパーです。 たとえば、item.Content.Value.Source == item.Content / /長方形 。 
    •  イベントはModelEventの型でラップ、基になるコントロールのイベントのコレクションを表します。 私のデバッグの経験から、それは常にnullであるため、イベントのプロパティがまだまだSilverlight3のためBlend3によってサポートされていないようです。 
    •  親は、ModelItem型でラップされた基本的な制御のロジックの親、です。 例：item.ParentはグリッドのためのModelItemです。 
    •  ルートは、ルートビジュアル、EXのModelItemラッパーです。item.Rootは、UserControlを表します。 
    

  •   ModelProperty：、すなわちプロペラ= item.Content、変数propが Button.ContentためModelPropertyであると仮定 
    •  名前は、基礎となるコントロールのプロパティの名前です。 これは、属性名としてXAMLに保存されます。 例：prop.Name =="コンテンツ"。 
    •   PropertyTypeは、このModelPropertyオブジェクトが表す基になるコントロールのプロパティのTypeオブジェクトです。 例：prop.PropertyType = typeof演算（オブジェクト）。 
    •   AttachedOwnerTypeは、最初にこのModelPropertyオブジェクトが表すプロパティを定義するコントロールのTypeオブジェクトです。 例：prop.AttachedOwnerType == typeof演算（ContentControlの）/ /注：ないボタン。 
    •  値は、ModelItem型でラップ、基になるコントロールのプロパティの値です。 例：prop.Valueは、Rectangleオブジェクトを表すModelItemです。 
    •  親は、プロパティが属しているのModelItem型でラップされたコントロール、、です。 例：prop.Parent ==アイテム 。 
  •   ModelEvent：前述のように、item.Eventsは常にnullですので、そのModelEventはまだSilverlight3のためBlend3でサポートされていないようです。 しかし、それが動作すると仮定、および変数evtは、Button.Clickの、すなわち、EVT = item.Events ["をクリックして"]、のためのModelEventです。 
    •  名前は、イベントの名前です。 例：evt.Name =="をクリックして"。 
    •   EventTypeは、イベントデリゲートの型、EXです：evt.EventType == typeof演算（RoutedEventHandler）。 
    •  ハンドラは、イベントハンドラの文字列のコレクションです、例：evt.Handlers =新しい文字列[] {"Button_Clickは"}をクリックして="Button_Click"として永続化されます。 注：ModelEventはまだサポートされていないので、これは、純粋な憶測であり、私はどうか/時/どのようにそれは、Silverlightでサポートされるかわからない。 
    •  親は、このイベントが属しているのModelItem型でラップされたコントロール、、です。 例：evt.Parent ==アイテム 。 
 実装 
 チャートのデフォルトの初期化子のクラスのChartDefaultInitializerはChartDefaultInitializer.csで実装、およびChartMetadata.csに登録されています。 両方のファイルはSilverlight.Controls.Design.slnのControls.DataVisualization.Toolkit.Design.csprojしています。 前の記事をお読みくださいSilverlightツールキットの設計時の機能の実装詳細については、を。 
  XAMLをもたらす 
 最初のステップとして、ChartDefaultInitializerによって生成される結果XAMLを定義します。 
 Title ="Chart < グラフ：グラフ タイトル ="チャート 
 登録 
 次のコードでChartMetadata.csで行わ： 
  (ChartDefaultInitializer))); b.AddCustomAttributes（ 新しいFeatureAttribute（typeof演算 （ChartDefaultInitializer）））; 
 参考文献 
 スクリーンショットの下に参照してください： 
 References 
  DefaultInitializerがMicrosoft.Windows.Design.Interaction.dllのバージョン3.5で定義されているにもかかわらず、（％のdevenvdir％の下にある\ PublicAssemblies、すなわちC：32ビットWindows上の\プログラムファイル\のMicrosoft Visual Studio 9.0 \ Common7 \ IDE \にPublicAssemblies）、それはSilverlight用のBlend2またはVisual Studio 2008でサポートされていません。 それがBlend3とVisual Studio 2010でサポートされているが、それらが両方Microsoft.Windows.Design *. dllの新しいバージョン（ブレンド3.7 3プレビュー、Blend 3のRTMおよびVisual Studio 2010の4.0）に切り替えているので、我々はリンクする必要があります。 MWDsの新しいバージョン。 前の投稿を参照してください。ブレンド3、およびVisual Studio 2010のVisual Studio 2008で、ブレンド2：すべてのデザイナーのためのSilverlightのデザインタイムを作成する方法詳細については。 
  WPFのではなく、SilverlightのSystem.Windows.dllへの参照がエイリアスされる、とPointCollectionが特にSilverlightのひとつに呼ばれていること。またきますのでご注意ください  WPFとSilverlightを共有するので、同じ名前空間内のクラスの多くは、 それは、Silverlightの型ではなく、WPFのは、Silverlightコントロールのデフォルトの初期化子でModelItemとModelPropertyの作成 ​​に使用されることが重要です 。 
 コレクション 
 他のすべてのプロパティの値がModelProperty.SetValueを介して設定することができますがそのスクリーンショット以下に注意してください。 
 ChartDefaultInitializer 
  Chart.Seriesは、コレクション型（コレクション<Series>）である、その値は最初の値のModelFactory.CreateItem経由ModelItemを作成することによって設定する必要があるので、してModelProperty.Collection.Add経由で作成されたModelItemを追加。 そうでなければ、正しいXAMLが生成される場合でも、ブレンドが正しくChartコントロールをレンダリングするために更新されませんが、あなたはそれが正しくレンダリングされているためにページをリロードする必要があります。 
  ChartDefaultInitializer.cs 
 alias / /（C）著作権Microsoft Corporationの。/ /このソースは、Microsoftパブリックライセンス（Ms - PL）の対象となる。/ /詳細については、http://go.microsoft.com/fwlink/?LinkID=131993を参照してください。/ /他のすべての権利予約。externエイリアス  SSWM = Silverlight::System.Windows.Media; namespace System.Windows.Controls.DataVisualization.Design { /// <summary> /// Default initializer for chart. /// </summary> internal class ChartDefaultInitializer : DefaultInitializer { /// <summary> /// Sets the default property values for chart. /// </summary> /// <param name="item">Chart ModelItem.</param> public override void InitializeDefaults(ModelItem item) { string propertyName; // <Charting:Chart Title="Chart Title"> propertyName = Extensions.GetMemberName<Chart>(x => x.Title); item.Properties[propertyName].SetValue(Properties.Resources.ChartTitle); // <Charting:Chart.DataContext> // <PointCollection> // <Point X="1" Y="10" /> // <Point X="2" Y="20" /> // <Point X="3" Y="30" /> // <Point X="4" Y="40" /> // </PointCollection> // </Charting:Chart.DataContext> SSWM::PointCollection defaultItemsSource = new SSWM::PointCollection(); for ( int i = 1; i <= 4; i++) { defaultItemsSource.Add( new SSW::Point(i, 10 * i)); } propertyName = Extensions.GetMemberName<Chart>(x => x.DataContext); item.Properties[propertyName].SetValue(defaultItemsSource); // <Charting:Chart.Series> // <Charting:ColumnSeries ItemsSource="{Binding}" // DependentValuePath="X" // IndependentValuePath="Y" /> // </Charting:Chart.Series> ModelItem columnSeries = ModelFactory.CreateItem(item.Context, typeof (ColumnSeries)); propertyName = Extensions.GetMemberName<ColumnSeries>(x => x.ItemsSource); =シルバー：：System.Windows; SSWD = Silverlightを使用して ：：System.Windows.Data; SSWM = Silverlightを使用して ：：System.Windows.Media名前、 名前空間 System.Windows.Controls.DataVisualization.Design {/ / / <summary> /チャートのための/ /デフォルトの初期化/ / / </概要> 内部クラス ChartDefaultInitializer：。。DefaultInitializer {/ / / <summary> / / /セットのグラフのデフォルトのプロパティ値/ / / </概要> / / / <パラメータ名="項目">チャートModelItem </ PARAM> 公共オーバーライドするvoid InitializeDefaults（ModelItem項目）{ 文字列 propertyNameの、。/ / <Charting:Chart Title="Chart Title"> propertyNameの= Extensions.GetMemberName <Chart>（X => X 。タイトル）。item.Properties [propertyNameの]値の代入（Properties.Resources.ChartTitle）; / / <Charting:Chart.DataContext> / / <PointCollection> / / <point X="1" Y="10" /> / / <point X="2" Y="20" /> / / <point X="3" Y="30" /> / / <point X="4" Y="40" /> / / </ PointCollection> / / </チャート：Chart.DataContext> SSWM：：PointCollection defaultItemsSource = 新しい SSWM：：PointCollection（）; 用するfor（int i = 1;はi <= 4;私+ +）{defaultItemsSource.Add（ 新 SSW： ：点（i、10 * i）を）;} propertyNameの= Extensions.GetMemberName <Chart>（X => x.DataContext）; item.Properties [propertyNameの]値の代入（defaultItemsSource）; / / <Charting:Chart.Series>。 / / <Charting:ColumnSeries ItemsSource="{Binding}" // DependentValuePath="X" // IndependentValuePath="Y" /> / / </チャート：Chart.Series> ModelItem ColumnSeriesが= ModelFactory.CreateItem（item.Context、 typeof演算 （ColumnSeriesが））; propertyNameの= Extensions.GetMemberName <ColumnSeries>（X => x.ItemsSource）;  ); propertyName = Extensions.GetMemberName<Chart>(x => x.Series); item.Properties[propertyName].Collection.Add(columnSeries); } } } propertyNameは= Extensions.GetMemberName <ColumnSeries>（X => x.DependentValuePath）; columnSeries.Properties [propertyNameの]値の代入（"X"）;。propertyNameの= Extensions.GetMemberName <ColumnSeries>（X => x.IndependentValuePath）; ColumnSeriesが。 [プロパティ] [propertyNameの]値の代入（"Y"）;。propertyNameの= Extensions.GetMemberName <Chart>（X => x.Series）;。item.Properties [propertyNameの] Collection.addの（ColumnSeriesが）;}}} 
テクノラティ 
  Tags:  ,  ,  ,  ,  ,  カテゴリー： デザインタイム 、 シルバーの タグ：  、  、  、  、  、