Ning Zhang Blog

Einführung

Dies ist Teil der Reihe über Design-Zeit-Funktion Implementierung in Silverlight-Toolkit . Dieser Beitrag verwendet das Diagramm Standardinitialisierung zu veranschaulichen, wie die Standard-Initialisierung für Silverlight-Steuerelemente implementieren, und erklären Sie das zugrunde liegende Modell Editing Architektur.

Erfahrung

Bei der Installation von Silverlight 3 Toolkit im März 2009 Veröffentlichung , können Sie den Chart-Steuerelement von Blend-Asset-Bibliothek per Drag & Drop auf Designer-Oberfläche, und Sie haben eine Tabelle initialisiert und schön gemacht:

Sie können mehr darüber in vorherigen Beitrag gelesen März 2009 Release Update: Silverlight Toolkit Design Time Funktionen .

Architektur

DefaultInitializer

Es ist eigentlich ziemlich einfach, um einen Standard-Initialisierung für ein Silverlight-Steuerelement bieten:

• Implementierung einer Unterklasse von DefaultInitializer , und überschreiben ihre InitializeDefaults Funktion
• assoziieren die Standardinitialisierung Klasse mit der Control-Klasse über eine FeatureAttribute

Unten Screenshot zeigt die Umsetzung der DefaultInitializer abstrakte Basisklasse, und andere Klassen im Namespace Microsoft.Windows.Design.Model, die kurz diskutiert werden:

Die Initialisierung erfolgt in InitializeDefaults Override getan, und das Ergebnis wird in XAML serialisiert. Der erste Schritt bei der Durchführung einer Standard-Initialisierung ist, um die gewünschte XAML zu definieren, erzeugt werden.

Bearbeiten von Modell

Sobald das Ergebnis XAML definiert ist, ich wünschte, es gibt eine höhere Abstraktion / Methode, die nur nehmen würde, die XAML. Aber leider müssen wir einen viel niedrigeren Niveau (und damit flexibler und leistungsfähiger) Imperativ API namens Bearbeiten Modell, das von Klassen wie aus nutzen ModelItem , ModelProperty , ModelEvent , ModelFactory und ModelService . Die MSDN-Seite Bearbeiten von Model Architecture gibt einen grundlegenden Überblick:

Ihre Design-Time-Umsetzung interagiert mit run-time Kontrollen obwohl eine Programmierschnittstelle namens Editing-Modell. Die Objekte so gestaltet werden als bearbeitbare Objekte.

Ihre Kontrollen sind in Extensible Application Markup Language (XAML) definiert. Sie aktualisieren die XAML für die Steuerelemente programmgesteuert mithilfe der Bearbeitung Modell.

Modell, Wrapper, und View

Die Redaktion besteht aus drei funktionellen Untereinheiten: ein Modell, eine öffentliche Wrapper, die das Modell abstrahiert, und einer Ansicht, die die Benutzeroberfläche (UI) des Modells darstellt. Das Modell und der Ausblick sind getrennt, aber das Deckblatt und das Modell sind eng miteinander verwandt. Die folgende Abbildung zeigt die Beziehung zwischen den drei Untereinheiten.

Die Design-Umgebung nutzt die ModelItem Typ, mit dem zugrunde liegenden Modell zu kommunizieren. Alle Änderungen werden auf die gemacht ModelItem -Wrapper, der das zugrunde liegende Modell beeinflussen. Dies ermöglicht das Modell einfach zu sein. Die ModelItem Wrapper Designer mit komplexen Funktionen wie Transaktionsunterstützung, rückgängig Nachverfolgung und Benachrichtigungen über Änderungen.

Im Folgenden Klassendiagramm kann erklären helfen, Interaktionen zwischen Kern-Klassen der Bearbeitung Modell:

Verwenden Sie unter XAML als Beispiel:

• ModelItem: annehmen, variable Element ist die ModelItem für das Button-Steuerelement oben
  • Name wird als x beharrte: Name-Attribut in XAML: item.Name = "Button" wird in XAML beharrte als x: Name = "Button".
  • ItemType ist das Type-Objekt des zugrundeliegenden Kontrolle, und beschließt den Tag in XAML verwendet: item.PropertyType == tyepof (Button), und der XAML-Tag ist <Button />.
  • Eigenschaften ist die Auflistung von Eigenschaften, in ModelProperty Art gewickelt, der zugrunde liegenden Kontrolle. Zum Beispiel: item ["ClickMode"] = ClickMode.Release wird in XAML beibehalten werden wie ClickMode = "Release".
  • Inhalt stellt die Content-Eigenschaft in ContentControl (und vererbt von ihrer Unterklassen) definiert: item.Content ist die ModelItem Vertreter des Rectangle-Objekts.
  • Quelle: wenn ein ModelItem ein Element, das eine Eigenschaft eines anderen Elements darstellt, ist die Quelle ModelProperty Wrapper dieser Eigenschaft. Zum Beispiel, item.Content.Value.Source == item.Content / / Rechteck.
  • Veranstaltungen stellt die Auflistung der Ereignisse des zugrunde liegenden Kontrolle, in ModelEvent Art gewickelt. Aus meiner Erfahrung Debugging, es ist immer null, so scheint es Events-Eigenschaft noch nicht von Blend3 für Silverlight3 noch nicht unterstützt.
  • Eltern ist die Logik der Muttergesellschaft des zugrunde liegenden Kontrolle, in ModelItem Art gewickelt. ex: item.Parent ist die ModelItem für Grid.
  • Wurzel ist die Wurzel ModelItem Wrapper für visuelle, ex: item.Root stellt das UserControl.
• ModelProperty: Variable übernehmen prop ist das ModelProperty für Button.Content, dh prop = item.Content,
  • Name ist der Name der Eigenschaft des zugrunde liegenden Kontrolle. Es wird in XAML beharrte als Attributnamen. ex: prop.Name == "Inhalt".
  • PropertyType ist das Type-Objekt der Eigenschaft des zugrunde liegenden Kontrolle dieser ModelProperty Objekt darstellt. ex: prop.PropertyType = typeof (Objekt).
  • AttachedOwnerType ist das Type-Objekt des Steuerelements, das erste definiert die Eigenschaft dieses ModelProperty Objekt darstellt. ex: prop.AttachedOwnerType == typeof (ContentControl) / / Hinweis: Nicht Button.
  • Value ist der Wert der Eigenschaft des zugrunde liegenden Kontrolle, in ModelItem Art gewickelt. ex: prop.Value ist die ModelItem Vertreter des Rectangle-Objekts.
  • Eltern ist die Steuerung, in ModelItem Typ, von dem die Immobilie gehört gewickelt. ex: prop.Parent == Element.
• ModelEvent: wie oben erwähnt, ist item.Events immer null, so scheint es nicht, dass ModelEvent in Blend3 ist für Silverlight3 noch nicht unterstützt. Aber davon ausgehen, dass es funktioniert, und variable evt ist die ModelEvent für Button.Click, dh EVT = item.Events ["Click"],
  • Ist der Name des Ereignisses. ex: evt.Name == "Klicken".
  • EventType ist die Art der Veranstaltung delegieren, ex: evt.EventType == typeof (RoutedEventHandler).
  • Handler ist der String Sammlung von Event-Handler, ex: evt.Handlers = new String [] {"Button_Click"} wird als Click = "Button_Click" beibehalten werden. Hinweis: dies ist reine Spekulation, da ModelEvent wird noch nicht unterstützt, und ich weiß nicht, ob / wann / wie es für Silverlight unterstützt werden.
  • Eltern ist die Steuerung, in ModelItem Typ, von dem dieses Ereignis gehört zu eingewickelt. ex: evt.Parent == Element.

Implementierung

Der Chart Standardinitialisierung ChartDefaultInitializer Klasse wird in ChartDefaultInitializer.cs implementiert und registriert in ChartMetadata.cs. Beide Dateien sind in der Controls.DataVisualization.Toolkit.Design.csproj Silverlight.Controls.Design.sln. Bitte lesen Sie vor post Design Time Feature-Implementierung in Silverlight-Toolkit für weitere Informationen.

Ergebnis XAML

Als ersten Schritt, das Ergebnis bestimmen xaml durch ChartDefaultInitializer hergestellt werden:

 Title ="Chart <Charting: Chart Title = "Chart 

Anmeldung

Geschehen in ChartMetadata.cs mit folgenden Code:

  (ChartDefaultInitializer))); b.AddCustomAttributes (neue FeatureAttribute (typeof (ChartDefaultInitializer))); 

Referenzen

Siehe unten Screenshot:

Auch wenn DefaultInitializer in Version 3.5 von Microsoft.Windows.Design.Interaction.dll definiert ist (unter DevEnvDir%% \ PublicAssemblies, zB C: \ Program Files \ Microsoft Visual Studio 9.0 \ Common7 \ IDE \ PublicAssemblies auf 32bit Windows), ist es nicht durch Blend2 oder Visual Studio 2008 für Silverlight unterstützt. Es wird von Blend3 und Visual Studio 2010 unterstützt, aber sie beide Schalter auf neuere Version von Microsoft.Windows.Design *. Dll (3,7 für Blend 3 Preview, 4,0 für Blend 3 RTM und Visual Studio 2010), also müssen wir gegen verknüpfen Die neuere Version von MWDs. Bitte lesen Sie vor posten How to Write Silverlight Design Time für alle Designer: Visual Studio 2008, Blend 2; Blend 3 und Visual Studio 2010 für weitere Informationen.

Bitte beachten Sie auch, dass der Verweis auf Silverlight System.Windows.dll Alias ​​wird, und die PointCollection wird ausdrücklich darauf hingewiesen, auf die ein Silverlight, WPF nicht das sein, genannt. Da WPF und Silverlight Aktie eine Menge von Klassen im gleichen Namespaces, ist es wichtig, dass Silverlight-Typen, nicht WPF, bei der Schaffung und ModelItem ModelProperty in Verzug Initialisierung für Silverlight-Steuerelemente verwendet werden.

Sammlungen

Bitte beachten Sie in unten Screenshot, dass, während alle anderen Eigenschaft Wert über ModelProperty.SetValue gesetzt werden können:

Chart.Series ist der Typ Sammlung (Sammlung <Series>), so dass ihr Wert muss vom ersten Anlegen eines ModelItem über ModelFactory.CreateItem für den Wert, und fügen Sie den erstellten ModelItem über ModelProperty.Collection.Add eingestellt werden. Ansonsten, auch wenn die richtige XAML erzeugt werden können, Blend wird nicht aktualisiert, um die Chart-Steuerelement korrekt darzustellen, müssen Sie die Seite neu zu laden, um es korrekt gerendert.

ChartDefaultInitializer.cs

 alias / / (C) Copyright Microsoft Corporation. / / Diese Quelle unter der Microsoft Public License (Ms-PL) ist. / / Bitte beachten Sie http://go.microsoft.com/fwlink/?LinkID=131993 für weitere Einzelheiten. / / Alle anderen Rechte vorbehalten. extern-Alias  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); = :: Silverlight System.Windows; mit SSWD = :: Silverlight System.Windows.Data; mit SSWM = :: Silverlight System.Windows.Media; Namespace System.Windows.Controls.DataVisualization.Design {/ / / <summary> / . / / Default-Initialisierung für Grafik / / / </ summary> interne Klasse ChartDefaultInitializer:. DefaultInitializer {/ / / <summary> / / / Legt die Standard-Eigenschaftswerte für Grafik / / / </ 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 . Titel); item.Properties [PropertyName] SetValue (Properties.Resources.ChartTitle);. / / <Charting:Chart.DataContext> / / <PointCollection> / / <Punkt X="1" Y="10" /> / / <Punkt X="2" Y="20" /> / / <Punkt X="3" Y="30" /> / / <Punkt X="4" Y="40" /> / / </ PointCollection> / / </ Charting: Chart.DataContext> SSWM :: PointCollection defaultItemsSource = new SSWM :: PointCollection (); for (int i = 1; i <= 4; i + +) {defaultItemsSource.Add (neue SSW: : Punkt (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);  ); propertyName = Extensions.GetMemberName<Chart>(x => x.Series); item.Properties[propertyName].Collection.Add(columnSeries); } } } propertyName = Extensions.GetMemberName <ColumnSeries> (x => x.DependentValuePath); columnSeries.Properties [PropertyName] SetValue ("X");. propertyName = Extensions.GetMemberName <ColumnSeries> (x => x.IndependentValuePath); ColumnSeries. Eigenschaften [PropertyName] SetValue ("Y");. propertyName = Extensions.GetMemberName <Chart> (x => x.Series); item.Properties [PropertyName] Collection.Add (ColumnSeries);.}}}