Cmo crear hojas y

objetos para Dia

http://dia-
installer.de/howto/create_s
hape/index.html
Introduccin

Este documento describe, paso por paso, cmo agregar hojas y objetos personalizados al editor de
diagramas Dia. Para obtener ms informacin sobre el programa, visite la pgina principal,
http://live.gnome.org/Dia, o si desea obtener una versin para Windows, visite http://dia-
installer.de.

Adems de las hojas y objetos incluidas por defecto en la instalacin de Dia, pueden agregarse
otros creados por el usuario. Algunas caractersticas de las hojas y objetos personalizados son las
siguientes:

o Pueden llegar a lucir como las hojas y objetos incluidos en el programa.

o Sus propiedades pueden ser modificadas, como por ejemplo tamao, grosor de linea y
colores de linea y de relleno.
o Pueden invertirse horizontal y verticalmente.
o Pueden integrarse fcilmente con otros objetos mediante conectores.
o Pueden seleccionarse desde el cuadro de herramientas del programa.

Hay que tener en cuenta que, en caso de tener que compartir un diagrama que contenga objetos
personalizados, ser necesario compartir tambin las hojas y objetos utilizados en l, e indicar a la
persona que reciba los archivos cmo instalarlos en su sistema operativo.

El procedimiento de creacin de objetos, en resumen, consiste en dibujar la forma del objeto

como si se tratase de un diagrama de Dia usando las herramientas del programa (lineas, curvas,
rectngulos, elipses, polgonos, etc.), luego se exporta usando la extensin SHAPE, y se hacen
ligeras modificaciones del cdigo XML del archivo exportado.

Las dos imgenes mostradas a continuacin permiten identificar las diferencias que pueden
presentarse para objetos con o sin modificaciones del cdigo XML. La primera muestra lo que
ocurre con un objeto creado exclusivamente con curvas o polgonos abiertos, y en la segunda se
muestra un objeto que combina curvas y polgonos abiertos y cerrados.

1
2
Cmo crear una hoja

Para este ejemplo se crear una hoja llamada Prueba.

En el cuadro de herramientas de Dia para GNU/Linux, o en la ventana de Dia para Windows, haga
clic en Archivo Hojas y Objetos.

En la ventana Hojas y objetos haga clic en el botn Nuevo.

3
Aparece el cuadro de dialogo Nuevo. Elija la opcin Nombre de la hoja y asigne un nombre, y si lo
desea puede asignar una descripcin a la hoja. Para este ejemplo se escogi el nombre Prueba.
Para terminar haga clic en el botn Aceptar.

Para que los cambios tengan efecto, haga clic en el botn Aplicar de la ventana Hojas y objetos. El
procedimiento para aadir objetos a la hoja se presenta ms adelante, en Cmo aadir un objeto
a una hoja. Para terminar, haga clic en el botn Cerrar de la ventana Hojas y objetos.

Cmo crear un objeto (sin modificar el cdigo XML)

El procedimiento de modificacin del cdigo XML se incluye ms adelante, en Cmo modificar el

cdigo XML de un objeto. El procedimiento presentado a continuacin es equivalente para los
objetos con o sin modificaciones del cdigo XML.

4
Para este ejemplo se crear el objeto Box mostrado en la introduccin de esta nota (Figura 2,
Ventajas de modificar el cdigo XML, ejemplo 2.).

Dibuje la forma del objeto en un nuevo documento de Dia, colocando especial atencin en el
tamao y la ubicacin. Box por ejemplo es una cuadrado de 1 cm de lado, y todos sus bordes son
de 0.05 cm de espesor.

Para facilitar el posicionamiento de las entidades se sugiere activar el ajuste a la rejilla, desactivar
el ajuste entre objetos, y colocar el objeto en su totalidad en la parte positiva de los ejes horizontal
y vertical. Ntese que el eje vertical es positivo hacia abajo.

Guarde el archivo al terminar de disear la forma del objeto. Para este caso el archivo se guard
con el nombre Box.dia, en una carpeta llamada Prueba.

Una vez creado el archivo con la forma puede exportarse a formato Shape. Esto puede hacerse
desde la opcin Exportar, ubicada en Archivo Exportar... de la ventana de trabajo de Dia.

5
6
Al aceptar la exportacin a shape, Dia le preguntar las dimensiones en pxeles para el icono del
objeto. Se recomienda usar una altura de 22 pxeles, lo cual es un estndar para los dems iconos
de Dia. El ancho se modifica automticamente de forma proporcional al cambio en la altura. Al
aceptar se crea una imagen llamada Box.png en la carpeta Prueba.

Sugerencia

De forma opcional puede modificar el archivo png a su gusto.

Hasta este punto se ha creado un archivo shape correspondiente al objeto, y un archivo png para
el icono del objeto. En la siguiente seccin se explica cmo puede modificarse el cdigo XML del
archivo shape.

Cmo modificar el cdigo XML de un objeto

El siguiente procedimiento no requiere experiencias previas con cdigo XML.

Abra el archivo de extensin shape (para este ejemplo Box.shape) en un editor de cdigo XML o
un editor de texto que soporte codificacin UTF-8, como por ejemplo Wordpad en Windows. En
este ejemplo se utiliz se utiliz el editor de texto gedit, tambin disponible para Windows.

7
Observe con atencin la estructura del archivo, en particular las partes marcadas como
connections, aspectratio y svg:

connections contiene los puntos de conexin del objeto, es decir, lo que permite que los objetos
se puedan unir unos con otros.

aspectratio le informa a Dia si las proporciones del objeto son fijas, libres o admiten un rango de
deformacin.

svg contiene las instrucciones de forma del objeto.

Observe adems que los valores numricos de los puntos de conexin y las formas dibujadas
coinciden con las coordenadas de la figura dibujada en Dia.

Modifique los puntos de conexin a la medida de sus necesidades. Puede aadir tantos como
quiera. Utilice como gua para las coordenadas el archivo dia creado previamente. En este ejemplo
solo se colocarn 5 puntos de conexin, uno en el punto medio de cada lado del cuadrado, y uno
en el punto central de la figura, el cual ser definido como el punto de conexin principal. Observe
como quedara el cdigo XML:

<connections>

<point x="0" y="0.5"/>

8
<point x="1" y="0.5"/>

<point x="0.5" y="1.0"/>

<point x="0.5" y="0"/>

<point x="0.5" y="0" main="yes"/>

</connections>

Escoja la opcin de proporcionalidad que ms se acomode a sus necesidades. Existen tres

opciones de proporcionalidad del objeto: fixed, free y range. A continuacin colocar una linea de
cdigo de ejemplo para cada una. Para el ejemplo, Box conservar las proporciones fijas.

Proporciones fijas:

<aspectratio type="fixed"/>

Proporciones variables:

<aspectratio type="free"/>

Proporciones con un rango de deformacin de, por ejemplo, 1 a 1.5 veces de un lado horizontal
o vertical con respecto al otro:

<aspectratio type="range" min="1" min="1.5"/>

Identifique la informacin de estilo de las entidades del objeto que requieran modificaciones, y
modifique segn sus necesidades. Con esto se hace referencia al cdigo SVG contenido dentro del
archivo shape. La informacin de forma incluye el tipo de entidades utilizadas para crear el objeto,
las coordenadas de posicin y tamao de dichas entidades, los colores de lineas y rellenos, entre
otros.

El objeto de ejemplo estaba formado por tres elementos: un par de lineas rectas y un rectngulo,
con borde negro y relleno blanco, pero el cdigo dice que el objeto est formado por cuatro
elementos, dos rectngulos y dos lineas. Esto se debe a que, en el caso del rectngulo, y de las
curvas y polgonos cerrados en general, se interpretan el borde y el relleno como dos elementos
diferentes.

Observe de nuevo la imagen con el cdigo y ver las cuatro lineas que comienzan con el texto
<svg:, y a continuacin el texto que identifica el tipo de entidad, como rect para rectngulo o line
para lnea. Mas adelante est la informacin de estilo (style), que ser la que nos ayudar a
identificar qu cambiar y cmo hacerlo.

Podemos identificar las curvas o polgonos cerrados dibujados con relleno blanco si el cdigo de
estilo se ve de la siguiente manera:

9
style="fill: #ffffff"

Para lograr que este relleno pueda modificarse segn el color escogido en Dia como relleno, puede
reemplazarse el texto anterior por cualquiera de las dos lineas siguientes:

style="fill:default; stroke:none"

style="fill:bg; stroke:none"

En algunos casos puede requerirse que una curva o poligono cerrado tenga el mismo color de
relleno que el color de linea. Si dicha entidad se dibuj en color negro, puede identificarse as:

style="fill: #000000"

Para que esta entidad conserve un color de relleno igual al color de linea definido por el usuario,
bastar reemplazar el texto anterior con el siguiente:

style="fill:fg; stroke:none"

Del mismo modo se pueden definir entidades con colores fijos, no modificables en Dia,
colocndoles un texto de estilo como el siguiente:

style="fill:#0000FF; stroke:none"

Donde #0000FF es el cdigo HTML del color azul rey. Este cdigo se obtuvo de la ventana de
seleccin de color de Dia.

Las lineas, curvas o polgonos abiertos pueden identificarse muy fcilmente. El cdigo de estilo
puede variar segn el grosor de linea que hayamos definido en el dibujo, pero debe ser semejante
a lo siguiente:

style="fill: none; fill-opacity:0; stroke-width: 0.05; stroke: #000000"

Para estos casos se sugiere borrar el texto de estilo completamente, dejando solo las instrucciones
para crear la forma.

Todo lo dicho en esta seccin se resume a dos palabras: buscar y reemplazar.

Siguiendo estas instrucciones, el cdigo correspondiente a la forma del objeto de ejemplo

quedara de la siguiente manera.

<svg:svg>

<svg:rect style="fill:default; stroke:none"

x="0" y="0" width="1" height="1"/>

<svg:rect x="0" y="0" width="1" height="1"/>

10
<svg:line x1="0.2" y1="0.2" x2="0.8" y2="0.8"/>

<svg:line x1="0.2" y1="0.8" x2="0.8" y2="0.2"/>

</svg:svg>

El cdigo completo del archivo XML puede visualizarse en la siguiente figura.

Sugerencia

Si desea obtener mayor informacin de cmo modificar el cdigo XML de los objetos de Dia,
puede consultar el Documento "How to create a new shape", de la documentacin de Dia en
gnome.org. http://projects.gnome.org/dia/custom-shapes

Cmo aadir un objeto a una hoja

Vuelva a la ventana Hojas y objetos de Dia, tal como se vi en el primer paso de Cmo crear una
hoja.

Seleccione la hoja a la cual desea aadir un objeto, y haga clic en el botn Nuevo.

11
Esta vez escoja la opcin Forma SVG, haga clic en el botn Navegar para buscar el objeto (en el
ejemplo sera Box.shape), y opcionalmente puede darle una descripcin a la forma.

No olvide dar clic en el botn Aplicar de la ventana Hojas y objetos para que los cambios tengan
efecto.

Puede repetir estos pasos en caso de que necesite agregar mas objetos a la hoja. Al terminar, haga
clic en el botn Cerrar de la ventana Hojas y objetos.

12
En la siguiente imagen se muestra una hoja completa que conserva el estilo del objeto de ejemplo,
box.

Dnde se instalan las hojas y objetos

Las hojas y objetos personalizados que se aaden a Dia quedan almacenados en una carpeta
llamada ".dia". Es necesario aclarar para los usuarios no familiarizados con GNU/Linux que el
punto que antecede al nombre de la carpeta es usado por GNU/Linux para identificar las carpetas
ocultas.

13
La carpeta .dia puede variar de ubicacin, dependiendo del nombre del usuario en el equipo y el
sistema operativo. Supngase, por ejemplo, que el nombre del usuario es NombreUsuario,
entonces la ubicacin de la carpeta .dia ser:

/home/NombreUsuario/.dia para usuarios de Ubuntu.

C:\Documents and Settings\NombreUsuario\.dia para usuarios de Windows XP.

Dentro de la carpeta .dia encontraremos dos subcarpetas: una llamada shapes, en la cual
encontraremos los objetos que hayamos creado o instalado; y la carpeta sheets, donde
encontraremos un archivo de extensin sheet por cada hoja instalada en Dia de forma posterior a
la instalacin del programa.

Si usted ha seguido este tutorial, o ha instalado alguna hoja del repositorio de Dia, podr notar al
ingresar a la carpeta shapes que los objetos pueden estar dentro de una subcarpeta o pueden
estar directamente dentro de shapes.

14
En la carpeta sheets se encuentran los archivos correspondientes a las hojas. Estos tienen
extensin .sheet pero estn escritos en cdigo XML. Las hojas tienen almacenado el nombre del
objeto y la descripcin, pero no la ubicacin del objeto (ni relativa ni absoluta), lo que permite que
los objetos puedan colocarse directamente en shapes o en subcarpetas. La hoja Prueba se ve as:

15
Sugerencia

Si comete algn error al instalar un objeto o no queda satisfecho con algn resultado, puede
borrar o hacer modificaciones directamente dentro de la carpeta .dia; hagalo con precaucin,
recuerde que esta carpeta es necesaria para el correcto funcionamiento del programa.

Cmo preparar los objetos para envo

Existen muchas formas de enviar los objetos de Dia a otras personas. Puede ser tan sencillo como
adjuntar los archivos en un correo electrnico, pero se sugiere hacerlo como se indica en esta
seccin, ya que le ahorra pasos al destinatario, y genera un paquete igual a los disponibles en el
repositorio de Dia.

Organice sus objetos en una subcarpeta de la carpeta shapes con un nombre que identifique al
grupo y que no contenga espacios. La carpeta debe incluir tanto los archivos de extensin .shape
como los iconos (archivos png). Para este ejemplo la carpeta se llama Prueba.

En una carpeta aparte cree dos subcarpetas, llamadas shapes y sheets, todo en minsculas.

De las carpetas shapes y sheets que estn dentro de .dia, copie su carpeta de objetos y su
correspondiente archivo de hoja a las carpetas que acaba de crear.

16
Comprima las carpetas shapes y sheets que cre en un archivo de extensin zip. La siguiente
imagen corresponde al archivo comprimido en File Roller, un programa para GNU/Linux, pero para
esto existen en Windows programas como 7zip.

Este archivo podr instalarse fcilmente en GNU/Linux o Windows, en solo tres pasos, como
cualquier archivo del repositorio de Dia. Observe por ejemplo el archivo chemistry_lab.zip del
repositorio de Dia; luce muy similar al archivo zip del ejemplo, solo que este contiene una copia de
la licencia pblica general GNU.

17
Sugerencia

Si sus objetos pueden ayudar a otros usuarios a mejorar su experiencia con Dia, pueden enviarlos
al repositorio de Dia, y al igual que Chemistry lab, sern distribuidos libremente gracias a la
licencia publica general GNU. El repositorio se encuentra en el siguiente enlace: http://dia-
installer.de/shapes.html

Cmo instalar objetos personalizados

Smplemente debe colocarlos en sus respectivos lugares dentro de la carpeta ".dia", como se
explic en secciones anteriores. Si necesita instalar hojas y objetos personalizados almacenados en
archivos zip, como los descritos en la seccin anterior, puede seguir los siguientes pasos:

Descargue el archivo

Busque la carpeta .dia de su equipo, la cual debe aparecer dentro de su carpeta de usuario, como
se indic en la seccin Dnde se instalan las hojas y objetos.

Descomprima el archivo zip en la ubicacin de la carpeta .dia de su equipo.

Y listo, si siguen los pasos correctamente, al abrir Dia debe aparecer entre las hojas disponibles la
que acabaron de instalar. Este mismo procedimiento puede aplicarse a los objetos descargados del
repositorio de Dia.

Nota
Los objetos personalizados no podrn ser instalados mediante diashapes. Este programa se limita
solamente a los objetos del repositorio de Dia.

18