El Bruno

Buenas,

más sobre escenarios especiales cuando trabajamos con las Domain Specific Language Tools; en este caso cómo hacer para que en un Shape gráfico, se cambie el aspecto del mismo dependiendo del valor de una propiedad.

Sobre el ejemplo que trabajo diariamente, en el elemento UserElement he agregado una nueva propiedad booleana llamada UserState. La idea es que dentro del diagrama visual, se cambie la apariencia del mismo, cuando el valor cambie de True -> False -> True.

Para representar el estado, he modificado el Shape que representa al usuario y le he agregado un nuevo "decorator" llamado IconState que mostrará el estado de la propiedad UserState. Cuando la propiedad sea True, se visualizará una imagen y en caso contrario no se visualizará nada.

Para lograr el efecto de mostrar/ocultar la imagen, podemos realizar la siguiente configuración dentro del panel DSL Details. En primer lugar debemos seleccionar la relación entre el elemento UserElement y UserShape. A continuación dentro de la pestaña Decorator Tabs, seleccionamos el decorator IconState y lo asociamos como muestra la siguiente imagen, asociamos su visibilidad a la propiedad UserState.

Internamente la definición del DSL ha generado el siguiente código, donde asocia la visualización del decorator IconState al valor de la propiedad UserState utilizando la función ShapeField.AssociateVisibilityWith(), como podemos ver en las líneas 20 y 21.

 1     /// <summary>
 2     /// Class containing decorator path traversal methods for UserShape.
 3     /// </summary>
 4     internal static partial class UserShapeDecoratorMap
 5     {
 6       /// <summary>
 7       /// Event handler called when decorator initialization is complete for UserShape.  Adds decorator mappings for this shape or connector.
 8       /// </summary>
 9       public static void OnDecoratorsInitialized(object sender, global::System.EventArgs e)
10       {
11         DslDiagrams::ShapeElement shape = (DslDiagrams::ShapeElement)sender;
12         DslDiagrams::AssociatedPropertyInfo propertyInfo;
13         
14         propertyInfo = new DslDiagrams::AssociatedPropertyInfo(global::ElBruno.Dsl15.UserElement.NameDomainPropertyId);
15         DslDiagrams::ShapeElement.FindDecorator(shape.Decorators, "NameDecorator").AssociateValueWith(shape.Store, propertyInfo);
16         
17         propertyInfo = new DslDiagrams::AssociatedPropertyInfo(global::ElBruno.Dsl15.UserElement.EMailDomainPropertyId);
18         DslDiagrams::ShapeElement.FindDecorator(shape.Decorators, "EMail").AssociateValueWith(shape.Store, propertyInfo);
19     
20         propertyInfo = new DslDiagrams::AssociatedPropertyInfo(global::ElBruno.Dsl15.UserElement.UserStateDomainPropertyId);
21         DslDiagrams::ShapeElement.FindDecorator(shape.Decorators, "IconState").AssociateVisibilityWith(shape.Store, propertyInfo);
22       }
23     }
24 

Luego en ejecución nuestro diagrama mostrará u ocultará la imagen, para completar un poco más el ejemplo he agregado una nueva opción a través de un menú contextual que cambia el valor de UserState desde otra ubicación. Y un video vale más que mil imágenes:

Video: DSL Tools - Custom Visibility Demo

Descarga:

Saludos @ Home

El Bruno

Share this post :