El Bruno

[DSL] Como agregar una imagen de fondo en el editor

Buenas

Buenas

existen pocas cosas más aburridas que un hospital, tal vez las espesas reuniones de gerentes alrededor de las 19:00; pero bueno este tiempo sirve para empezar a sacar post del folder Draft y no seguir jugando con la Wii porque a las enfermeras no les cae bien.

Antes de comenzar con la generación de artefactos utilizando las Domain Specific Language Tools, me gustaría dejar un pequeño tip que permite agregar una imagen de fondo a un modelo creado con las Domain Specific Language Tools (otra de las features que pienso que falta en el SDK, pero que ya ha sido solicitado para la nueva versión)

Para comenzar parto del ejemplo que dejé en mi último post sobre DSLs, y después de completar un poco el mismo con algunos elementos nuevos quiero cambiar el siguiente editor por uno con este background.

Tutorial

1. Agregamos una imagen como un recurso a nuestro proyecto. (para simplificar un poco el código he agregado la imagen como un recurso, pero se puede implementar de varias formas diferentes)
2. Seleccionar el elemento que representa al diagrama, Dsl15Diagram y cambiar la propiedad Generate Double Derived: True.
3. Generamos el código para reflejar nuestros cambios en el modelo.
4. Agregamos una nueva clase al proyecto Dsl llamada Dsl15Diagram.partial.cs y agregamos el siguiente código a la misma. Dentro del método InitializeShapeFields() agregamos un nuevo Shape del tipo ImageField y configuramos al mismo definiendo que no pueda tomar foco ni ser seleccionado, y sus márgenes:
   
   

   using System;
   using System.Collections.Generic;
   using System.Text;
   using Microsoft.VisualStudio.Modeling.Diagrams;
   using ElBruno.Dsl15.Properties;
   
   namespace ElBruno.Dsl15
   {
     public partial class Dsl15Diagram
     {
       /// <summary>
       /// Initialize shape decorator mappings.  This is done here rather than in individual shapes because decorator maps
       /// are defined per diagram type rather than per shape type.
       /// </summary>
       /// <param name="shapeFields"></param>
       protected override void InitializeShapeFields(IList<Microsoft.VisualStudio.Modeling.Diagrams.ShapeField> shapeFields)
       {
         base.InitializeShapeFields(shapeFields);
   
         // add backgroung image to the designer
         ImageField backgroundImage = new ImageField("background", Properties.Resources.fondo);
         backgroundImage.DefaultFocusable = false;
         backgroundImage.DefaultSelectable = false;
         backgroundImage.DefaultVisibility = true;
         shapeFields.Add(backgroundImage);
   
         // define Background Image margins
         backgroundImage.AnchoringBehavior.Clear();
         backgroundImage.AnchoringBehavior.SetTopAnchor(AnchoringBehavior.Edge.Top, -1.5);
         backgroundImage.AnchoringBehavior.SetLeftAnchor(AnchoringBehavior.Edge.Left, 0);
       }
     }
   }
   

   
   
   
5. Compilamos la solución y ejecutamos nuevamente. Podremos ver el editor como lo muestra la siguiente imagen:
   
   

Tip simple pero efectivo. El código de ejemplo se puede descargar desde aquí.

Saludos @ Hospital

El Bruno

Published sábado, 22 de septiembre de 2007 18:58 by elbruno