Zhang Ning blog

Introducción

Esto es parte de la serie en función de la aplicación en tiempo de diseño de Silverlight Toolkit . Este artículo utiliza el inicializador por defecto para gráficos para ilustrar la forma de aplicar inicializador por defecto para los controles de Silverlight, y explicar la arquitectura de edición de modelo subyacente.

Experiencia

Si instala Silverlight Toolkit 3 de marzo 2009 de lanzamiento , puede arrastrar el control gráfico de la mezcla de activos de Bibliotecas y colóquelo en la superficie de diseño, y usted tiene un gráfico muy bien inicializado y prestados:

Puede leer más sobre él en anteriores post Silverlight Toolkit tiempo de diseño Características: Marzo 2009 Lanzamiento de actualización .

Arquitectura

DefaultInitializer

En realidad es bastante simple para proporcionar un inicializador por defecto para un control de Silverlight:

• poner en práctica una subclase de DefaultInitializer , e invalidar su InitializeDefaults función
• asociar a la clase de inicialización por defecto con la clase de control a través de un FeatureAttribute

pantalla de abajo muestra la implementación de la clase base abstracta DefaultInitializer, y otras clases de espacio de nombres Microsoft.Windows.Design.Model que veremos más adelante:

Inicialización se hace en InitializeDefaults aumento al presupuesto, y el resultado se serializa en XAML. El primer paso en la aplicación de un inicializador por defecto es definir el XAML que desee que se producirán.

Edición de Modelo

Una vez que el resultado se define xaml, me gustaría que es una abstracción de alto nivel o el método que acaba de tomar el XAML. Pero, por desgracia tenemos que usar un nivel mucho menor (por tanto, más flexible y potente) llamado imperativo de edición de modelo de API que consiste en clases como ModelItem , ModelProperty , ModelEvent , ModelFactory y ModelService . La página de MSDN Edición de modelo de arquitectura ofrece una visión general básica:

Su aplicación en tiempo de diseño interactúa con los controles en tiempo de ejecución a través de una interfaz de programación denominada modelo de edición. La fase de diseño de objetos se denominan objetos editables.

Los controles se definen en el lenguaje extensible de marcado de aplicaciones (XAML). Actualiza el XAML para los controles mediante programación utilizando el modelo de edición.

Modelo, Wrapper y Ver

El modelo de edición consta de tres subunidades funcionales: un modelo, un contenedor público que abstrae el modelo, y una vista que representa la interfaz de usuario (UI) del modelo. El modelo y la vista son distintos, pero el envoltorio y el modelo están estrechamente relacionados. La ilustración siguiente muestra la relación entre las tres subunidades.

El entorno de diseño utiliza el ModelItem tipo para comunicarse con el modelo subyacente. Todos los cambios se hacen a la ModelItem envolturas, que afectan al modelo subyacente. Esto permite que el modelo sea simple. El ModelItem envoltorios de manejar las complejas características de diseño, como el soporte de transacciones, deshacer el seguimiento y notificaciones de cambios.

A continuación el diagrama de clase puede ayudar a explicar las interacciones entre las clases fundamentales del modelo de edición:

La utilización por debajo XAML como un ejemplo:

  <UserControl
     xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation"
     xmlns: x = "http://schemas.microsoft.com/winfx/2006/xaml"
     Width ="640" Height ="480" > x: Class = "ModelTest.Page" width = "640" height = "480">
     x:Name ="LayoutRoot" Background ="White" > Grid <x: Nombre = "LayoutRoot" Background = "White">
         x:Name ="Button" > Button <x: Nombre = "Botón">
             x:Name ="Rectangle" /> Rectángulo <x: Nombre = "Rectángulo" />
         > </> Botón
     > </> Cuadrícula
 > </> UserControl 

• ModelItem: asumir la variable es el tema ModelItem para el control Button anterior,
  • El nombre es persistido como x: atributo Name en XAML: item.Name = "Botón" persiste en su xaml como x: Nombre = "Button".
  • ItemType es el tipo de objeto del control subyacente, y decide la etiqueta utilizada en XAML: == item.PropertyType tyepof (Button), y la etiqueta es xaml <button />.
  • Propiedades de la colección de propiedades, envuelto en el tipo ModelProperty, del control subyacente. Por ejemplo: [tema "ClickMode"] = ClickMode.Release se persistió en XAML como ClickMode = "Release".
  • Contenido representa la propiedad de contenido se define en ContentControl (y heredado por sus subclases): es el item.Content ModelItem que representa el objeto Rectangle.
  • Fuente: cuando un ModelItem representa un elemento que es una propiedad de otro elemento, de origen es el envoltorio ModelProperty de esa propiedad. Por ejemplo, item.Content.Value.Source item.Content == / / El Rectángulo.
  • Eventos representa la colección de eventos del control subyacente, envuelto en ModelEvent tipo. Desde mi experiencia de depuración, siempre es nula, por lo que parece Eventos propiedad aún no está apoyada por Blend3 para Silverlight3 todavía.
  • Padre es el padre de la lógica del control subyacente, envuelto en ModelItem tipo. por ejemplo: Item.Parent es el ModelItem para Grid.
  • Raíz es la envoltura de la raíz ModelItem visual, por ejemplo: item.Root representa el UserControl.
• ModelProperty: asumir la variable de propiedad es la de ModelProperty Button.Content, es decir, prop = item.Content,
  • Name es el nombre de la propiedad del control subyacente. Se insistió en XAML como nombre de atributo. por ejemplo: prop.Name == "Contenido".
  • PropertyType es el objeto Type de la propiedad del control se basa este objeto ModelProperty representa. por ejemplo: prop.PropertyType = typeof (objeto).
  • AttachedOwnerType es el tipo de objeto del control que primero define la propiedad de este objeto ModelProperty representa. por ejemplo: prop.AttachedOwnerType == typeof (ContentControl) / nota /: No Button.
  • El valor es el valor de la propiedad del control subyacente, envuelto en ModelItem tipo. por ejemplo: prop.Value es el ModelItem que representa el objeto Rectangle.
  • Padre es el control, envuelto en ModelItem tipo, de los cuales la propiedad pertenece. : == Prop.Parent tema antiguo.
• ModelEvent: como se mencionó anteriormente, item.Events siempre es null, por lo que no parece que se admite en ModelEvent Blend3 para Silverlight3 todavía. Pero asumamos que esto funciona, y es la variable evt ModelEvent para Button.Click, es decir, evt = item.Events [Haga "clic"],
  • Name es el nombre del evento. por ejemplo: evt.Name == "Click".
  • EventType es el tipo del delegado caso, por ejemplo: evt.EventType == typeof (RoutedEventHandler).
  • Controladores es la colección de cadenas de controladores de eventos, por ejemplo: evt.Handlers = new String [] ("Button_Click") se mantuvo como Click = "Button_Click". Nota: esto es pura especulación, ya que ModelEvent todavía no es posible, y yo no sé si / cuándo / cómo será compatible con Silverlight.
  • Padre es el control, envuelto en ModelItem tipo, de los cuales este evento pertenece. : == Evt.Parent tema antiguo.

Ejecución

El gráfico predeterminado inicializador de clase ChartDefaultInitializer se implementa en ChartDefaultInitializer.cs, e inscrita en ChartMetadata.cs. Ambos archivos se encuentran en Controls.DataVisualization.Toolkit.Design.csproj de Silverlight.Controls.Design.sln. Por favor, lea antes de post tiempo de diseño de funciones de aplicación de Silverlight Toolkit para más información.

Resultados de XAML

Como primer paso, definir el resultado xaml que deben elaborar los ChartDefaultInitializer:

  Title ="Chart Title" > <Gráficos: título de gráfico = "Título del gráfico">
     > <Gráficos:> Chart.DataContext
         > <> PointCollection
             X ="1" Y ="10" /> Point <X = "1" Y = "10" />
             X ="2" Y ="20" /> Point <X = "2" Y = "20" />
             X ="3" Y ="30" /> Point <X = "3" Y = "30" />
             X ="4" Y ="40" /> Point <X = "4" Y = "40" />
         > </> PointCollection
         > <Gráficos: Chart.Series>
             ItemsSource ="{Binding}" <Gráficos: ColumnSeries ItemsSource = "(enlace)"
                 DependentValuePath = "X"
                 IndependentValuePath = "Y" />
         > </ Gráficos: Chart.Series>
     > / Gráficos: Chart.DataContext> <
 > </ Gráficos:> Gráfico 

Registro

Realizado en ChartMetadata.cs con el siguiente código:

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

Referencias

A continuación, se captura de pantalla:

A pesar de que DefaultInitializer se define en la versión 3.5 de Microsoft.Windows.Design.Interaction.dll (en%% DevEnvDir PublicAssemblies \, es decir, c: \ Archivos de programa \ Microsoft Visual Studio 9.0 \ Common7 \ IDE \ Windows de 32 bits en PublicAssemblies), es no es compatible con Blend2 o Visual Studio 2008 para Silverlight. Se apoya en Blend3 y Visual Studio 2010, pero ambos cambiar a la versión más reciente de Microsoft.Windows.Design *. dll (3,7 por Blend 3 Preview, 4,0 para Blend 3 RTM y Visual Studio 2010), así que tenemos que enlazar con la versión más reciente de MWDs. Por favor, consulte antes de post Cómo escribir Silverlight tiempo de diseño para todos los diseñadores: Visual Studio 2008, Blend 2; Blend 3, y Visual Studio 2010 para más información.

Por favor, también nota que la referencia a System.Windows.dll Silverlight es un alias, y el PointCollection se hizo un llamamiento específico a ser el Silverlight no, WPF. Desde WPF Silverlight y compartir una gran cantidad de clases en espacios de nombre mismo, es importante que los tipos de Silverlight no, WPF, se utilizan en la creación y ModelItem ModelProperty en el inicializador por defecto para los controles de Silverlight.

Colecciones

Por favor, tenga en cuenta en el siguiente captura de pantalla que mientras que todos los otros bienes de valor se puede establecer a través de ModelProperty.SetValue:

Chart.Series es de tipo de colección (Colección <Series>), por lo que su valor tiene que ser fijado por crear primero una ModelItem ModelFactory.CreateItem a través del valor y, a continuación añadir la creada a través de ModelItem ModelProperty.Collection.Add. De lo contrario, aunque el xaml correcta se pueden generar, de mezcla no se actualizará para representar el control cuadro de correctamente, tienes que recargar la página para que se representan correctamente.

ChartDefaultInitializer.cs

  / / (C) Copyright Microsoft Corporation.
 / / Esta fuente está sujeta a la licencia pública de Microsoft (Ms-PL).
 / / Por favor, consulte http://go.microsoft.com/fwlink/?LinkID=131993 para más detalles.
 / / Todos los demás derechos reservados.

 extern alias Silverlight;
 utilizando System.Windows.Controls.DataVisualization.Charting;
 utilizando System.Windows.Controls.Design.Common;
 utilizando Microsoft.Windows.Design.Metadata;
 utilizando Microsoft.Windows.Design.Model;
 utilizando Silverlight SSW =:: System.Windows;
 utilizando Silverlight SSWD =:: System.Windows.Data;
 utilizando Silverlight SSWM =:: System.Windows.Media;

 espacio de nombres System.Windows.Controls.DataVisualization.Design
 (
     / / / <summary>
     / / / Por defecto inicializador para gráfico.
     / / / </ Summary>
     clase internas ChartDefaultInitializer: DefaultInitializer
     (
         / / / <summary>
         / / / Define el valor de las propiedades por defecto para ver la tabla.
         / / / </ Summary>
         / / / <PARAM Name="item"> Gráfico ModelItem. </ Param>
         public void InitializeDefaults anular (tema ModelItem)
         (
             propertyName cadena;

             / / <Charting:Chart Title"> Title="Chart
             propertyName = Extensions.GetMemberName <Chart> (x => x.Title);
             item.Properties [] propertyName. SetValue (Properties.Resources.ChartTitle);

             / / <Charting:Chart.DataContext>
             / / <PointCollection>
             / / <Punto X="1" Y="10" />
             / / <Punto X="2" Y="20" />
             / / <Punto X="3" Y="30" />
             / / <Punto X="4" Y="40" />
             / / </> PointCollection
             / / </ Gráficos: Chart.DataContext>

             SSWM:: defaultItemsSource PointCollection = nueva SSWM:: PointCollection ();
             i = 1; i <= 4; i++) for (int i = 1; i <= 4; i + +)
             (
                 defaultItemsSource.Add (SSW nuevos:: Punto (i, 10 * i));
             )

             propertyName = Extensions.GetMemberName <Chart> (x => x.DataContext);
             item.Properties [] propertyName. SetValue (defaultItemsSource);

             / / <Charting:Chart.Series>
             / / <Gráficos: ColumnSeries ItemsSource = "(enlace)"
             / / DependentValuePath = "X"
             / / IndependentValuePath = "Y" />
             / / </ Gráficos: Chart.Series>

             ModelItem columnSeries = ModelFactory.CreateItem (item.Context, typeof (ColumnSeries));
             propertyName = Extensions.GetMemberName <ColumnSeries> (x => x.ItemsSource);
             columnSeries.Properties [] propertyName. (ModelFactory.CreateItem (columnSeries.Context EstablecerValor, typeof (SSWD:: Encuadernación)));
             propertyName = Extensions.GetMemberName <ColumnSeries> (x => x.DependentValuePath);
             columnSeries.Properties [] propertyName. SetValue ("X");
             propertyName = Extensions.GetMemberName <ColumnSeries> (x => x.IndependentValuePath);
             columnSeries.Properties [] propertyName. SetValue ("Y");

             propertyName = Extensions.GetMemberName <Chart> (x => x.Series);
             item.Properties [] propertyName. Collection.Add (columnSeries);
         )
     )
 )