3.   Figuras y Texto:

 

3.1       Introducción:

 

La instrucción de FORMAR IMAGEN también permite la creación de figuras geométricas en una imagen, agregar otras imágenes, poner textos, ... En este capitulo se verán estas opciones que se pueden considerar como mas avanzadas y que permiten otras aplicaciones de las imágenes. Los ejemplos son:

 

·        Rutina de calendario.

 

·        Combinar varias imágenes.

 

·        Resumen.

 

Al final se tiene un resumen de lo visto.

 

3.2       Rutina de calendario:

 

El programa PSSID1 contiene una rutina para desplegar un mes del calendario y que el usuario pueda seleccionar un día de dicho mes. Sus usos pueden ser varios, un ejemplo sería en el caso de un "Sistema de reservaciones" en que mediante colores se pueda desplegar la disponibilidad que se tiene. Se sugiere lo ejecute en su maquina para una mejor comprensión de la explicación del mismo. Los comentarios al programa serian:

 

A)         Definición del área de terminal:

 

Se define el área 8000 como de /MENU /SELECCIONAR-MARCAS   para  desplegar la imagen. Las marcas serán los días del mes. Una característica de la rutina es que  se puede cambiar el tamaño del área y automáticamente  el calendario se ajusta. Aquí se definió como  /LONG. 20 60 pero se puede usar por ejemplo 10 20. Nota importante: si se ponen valores pequeños,  pueden NO ser adecuados por el uso de fonts muy pequeños.

 

B)         Inicio de la imagen:

 

Una variable imagen puede contener una GRAFICA como se explicó en el capitulo 1, o bien una IMAGEN leída como se vio en capitulo 2 o bien FIGURAS o combinación de gráficas e imágenes leídas bajo ciertas reglas. Para  el caso de figuras se debe poner /INICIO para indicar que se va a proceder a formar la imagen y además dar cierta información. La instrucción sería:

 

              FORMAR IMAGEN FIGURA-BASE $

                /INICIO 0 0 'TRANSPARENTE' $

                /MEDIDA-AREA 8000  DIM-X DIM-Y $

                /X-Y-NORMAL $

                /VARIAS-INSTRUCCIONES

 

La explicación es la siguiente:

·        Con /INICIO se especifica que se va a iniciar la imagen con las medidas en pixeles que se indican a continuación en este caso 0 0 y con el color de fondo indicado. Al poner 'TRANSPARENTE' se toma el del área de terminal en donde se despliega.

·        Con /MEDIDA-AREA se especifica que las medidas de /INICIO sean remplazadas por las del área de terminal 8000 razón por la cual se puso 0 0 en dicha opción, además en forma opcional se especifican 2 variables N1-0 para que SISINF deje el valor en PIXELES de las dimensiones del área. En este caso DIM-X DIM-Y , NOTA: Con esto la lógica se hace mas general ya que se ajusta al tamaño del área en que se despliega.

·        Con /X-Y-NORMAL que es el valor preestablecido se especifica que los ejes X-Y donde se darán los datos son los normales es decir el eje Y de abajo hacia arriba estando el punto 0-0 en la parte inferior izquierda, con la opción /X-Y-GRAFICO se especifica que el eje Y es de arriba hacia abajo, estando el punto 0-0 en la parte superior izquierda. El valor preestablecido es normal por lo que se pudo haber omitido.

·        Se especifica que se va a formar con /VARIAS-INSTRUCCIONES  Note que el orden en que se especifiquen estas opciones puede ser cualquiera

 

C)         Marco del área:

 

En este caso el área 8000 no tiene marco y para  darle uno al calendario se dibujará un rectángulo con un cierto ancho de línea. La instrucción seria:

 

              FORMAR IMAGEN FIGURA-BASE $

                 /EFECTO-LINEAS 'LLENO' 50 $

                 /RECTANGULO 0 0 DIM-X DIM-Y $

                      'AZUL' 'LLENO' 'TRANSPARENTE' $

                 /NO-OPCIONES-FIGURAS

 

La explicación es la siguiente:

·        Cuando se dibuja una figura geométrica (rectángulo, triángulo, círculo, ...) Se dibujan una o varias líneas para definir los contornos de dicha figura a forma de un marco y luego se rellena el interior. Con /EFECTO-LINEAS se especifican los efectos y el ancho de dicha línea en este caso 'LLENO' o continuo y de un ancho de 5.0 pixeles (expresado sin decimales y multiplicado por 10 o sea 50)

·        Luego se pide dibujar un /RECTANGULO  en la posición en X y en Y de 0 0 y con dimensión en X de DIM-X y en Y de DIM-Y que son las del área de la terminal. La línea que define el marco del rectángulo será 'AZUL' y el efecto del relleno es 'LLENO' y de un color ‘TRANSPARENTE' es decir lo que esté en el fondo en este caso 'GRIS'. Note que también se puede poner 'GRIS' en lugar de 'TRANSPARENTE' pero de esta forma queda mas flexible ya que con solo cambiar el fondo del área 8000 se cambia también el del rectángulo.

·        Se cancela el efecto de las líneas con  /NO-OPCIONES-FIGURAS

·        Note que en el caso de figuras, el orden en que se especifican en la instrucción de FORMAR IMAGEN es el orden de ejecución, así una figura puede estar sobrepuesta a otra. Si se hubiera puesto primero  /RECTANGULO y luego /EFECTO-LINEAS no habría el efecto de la línea para ese rectángulo.

 

D)         Generación de coordenadas:

 

Dividir el eje Y en 9 renglones y calcular la Y de cada  uno. Se usará 2 para el título, 1 para el letreros  de "Do Lu ..." y 6 para poner los días del mes, se dejan un espaciado de 5 arriba y abajo, 4 más para la línea.

 

Dividir el eje X en 7 columnas una para cada día de la semana menos un espaciado de 10 a ambos lados.

 

E)         Generación de cambio de mes:

 

Para que el usuario pueda cambiar el mes se dibujan dos triángulos a manera de flechas unidos por un  rectángulo y con la palabra 'Mes'. Las instrucciones para el triángulo izquierdo del mes y para el texto son:

 

         FORMAR IMAGEN FIGURA-BASE $

             /EFECTO-LINEAS 'LLENO' 30 $

             /TRIANGULO XT1 YT1 XT2 YT2 XT3 YT3 $

                 'ROJO' 'ROMBOS' 'CELESTE-B' 101

                  ......

 

         FORMAR IMAGEN FIGURA-BASE $

             /TEXTO X ( 2 ) YL1 'C-M' 'Mes' $

                 'SUIZO' SEPY2 0 $

                'TRANSPARENTE' 'CELESTE-B'

 

Como comentarios a la primera instrucción para dibujar el triángulo izquierdo se tiene:

·        Se dibuja el triángulo con un marco 'ROJO' de 3.0 pixeles, la parte interior tiene un efecto de 'ROMBOS' de color 'CELESTE-B'

·        Al final se especifica un 101 para indicar que este triángulo esta marcado con la marca 101, de forma que si el usuario oprima botón izquierdo con el ratón en dicho triángulo, el número de marca que se leerá será el 101, con lo que la lógica del programa regresa un mes.

 

Como comentarios a la segunda instrucción para  poner el texto:

·        Se define la posición X y Y de un rectángulo en donde se escribirá el texto, estos valores están en pixeles como todas las opciones de figuras.

·        Luego aparece la opción de como interpretar la posición. Si es la posición inferior izquierda del rectángulo se debe poner 'JI' por justificado a la izquierda, si la posición X es el centro del rectángulo entonces se pone 'C' por centrado y si es la derecha 'JF' por justificado a la derecha ‘JD’. También si la posición en Y es la mitad del rectángulo se agrega  un guión  y una M.

·        En este caso la posición X es centrado y la Y es a la mitad por lo que se puso 'C-M'

·        Se tiene la literal con 'Mes' que también se podría poner una variable alfanumérica.

·        Luego se define la familia del font al igual que en las instrucciones de impresión. Aquí permite poner negrita (N), inclinado (I) o relieve (R). Así poner 'SU-NIR' sería suizo con las tres opciones.

·        Luego se especifica el alto del rectángulo en pixeles que es parecido a tamaño en puntos.

·        Viene el ancho máximo del rectángulo ocasionando que se trunque el texto si se excede o bien un 0 que equivale a lo que necesite.

·        Por último el color del fondo y de las letras, en este caso como 'TRANSPARENTE' y 'CELESTE-B'

 

F)          Terminar la imagen base.

 

Con las mismas instrucciones se dibuja algo parecido al inciso anterior pero para el 'Año', luego las iniciales de cada día de la semana separados de lo anterior por una línea y al final se  prepara para el dibujo de los rectángulos que contendrán cada día del mes. La instrucción para hacerlo es:

 

          FORMAR IMAGEN FIGURA-BASE $

             /LINEA 0 YL2 DIM-X YL2 20 'AZUL' $

             /EFECTO-LINEAS 'LLENO' 1 $

             /USAR-COLOR-MARCO $

             /REDONDEADO $

             /ELIPCE XR0 YL1 TRX TRY 0 360 'BLANCO' $

                         'LINEAS-VERTICALES' 'GRIS' $

             /FIN-DE-INSTRUCCIONES

 

Los siguientes comentarios son aplicables a las diferentes opciones, recuerde algunas opciones son aplicables a los rectángulos que se dibujarán para cada día del mes. Estos son:

 

·        Con /LINEA se dibuja la línea de separación entre las flechas y las iniciales de los días de la semana, los datos son posición inicial en X y Y, posición final en X y Y, ancho y color.

·        Si el ancho de la línea para el marco de una figura se hace muy pequeño de todas formas se dibuja lo mas pequeño posible, la única excepción es poner 1 que equivale a cancelarlo. Por eso se puso /EFECTO-LINEAS 'LLENO' 1 porque en este caso NO se desea marco en las figuras.

·        Los efectos en figuras se generan con el color del efecto y el color inverso a menos que se especifique /USAR-COLOR-MARCO en donde se usara el del marco.

·        Los rectángulos se pueden dibujar con las esquinas redondeadas para ello especificar  /REDONDEADO

·        Como un ejemplo de otra figura se puso un elipse en donde se despliega el mes y año del calendario (En el programa PSSID1 esta con comentario, es decir no se dibuja) los datos son posición X y Y del centro del elipse, radio en X y Y, ángulo inicial y final, color del marco, efecto y color de efecto. En este caso se puso  'BLANCO' 'LINEAS-VERTICALES' 'GRIS' que por las opciones anteriores se dibuja un elipse sin marco, con un efecto de líneas verticales blanco con  gris.

·        Por ultimo se pone /FIN-DE-INSTRUCCIONES con lo cual se almacenan TODAS las instrucciones en FIGURA-BASE.

 

G)         Poner los días en imagen mes.

 

Una vez construida la imagen base se procede a completarla con la información propia de cada mes  como son el texto del año y del mes. Para ello la instrucción es:

 

         FORMAR IMAGEN FIGURA-MES $

               CON FIGURA-BASE $

               /VARIAS-INSTRUCCIONES $

               /TEXTO LX YL1 'C' XAN  'SU-N' LA 0 $

                           'TRANSPARENTE' 'NEGRO' $

               /TEXTO LX YL2 'C' XMES 'SU-N' LA 0 $

                           'TRANSPARENTE' 'NEGRO'

 

Aquí se copia la FIGURA-BASE a FIGURA-MES, iniciando esta última, ya que esta parte de la lógica se usará cada vez que cambia el mes o el año. Se pone el texto para hacerlo.

 

Luego se ponen los días diferentes a la fecha del día con la instrucción:

 

          FORMAR IMAGEN FIGURA-MES $

             /RECTANGULO XR0 YR0 TRX TRY $

                   'ROJO' 'ROMBOS' 'GRIS' DIA-PRO $

             /TEXTO XRM YR0 'C' XDIAS 'SU-N' LA 0 $

                   'TRANSPARENTE' 'CELESTE-B'

 

Se dibuja el rectángulo que por las ultimas  instrucciones del inciso  F será sin marco y con un efecto de 'ROMBOS' en rojo con gris. Note que el rectángulo tiene una marca en la variable  DIA-PRO que es el número del día que se podrá seleccionar, Luego se pone el texto del numero del día.

 

Al final se pone:

 

          FORMAR IMAGEN FIGURA-MES /FIN-DE-INSTRUCCIONES

 

 y se despliega y lee la marca seleccionada. Si es mayor a 100 indicará cambio de mes o año y reiniciar  la construcción.

 

 

 

 

 

H)         Comentarios finales.

 

El dibujo de figuras con FORMAR IMAGEN en SISINF es fácil y con variadas opciones para su presentación,  pero como se tiene que trabajar todo  en pixeles esto complica el programa. Además en el caso del calendario se tiene también la lógica de que día de la semana es el día 1 del mes que se despliega o sea si es Domingo, lunes, ...  para poder acomodar el calendario.

 

Si desea incluir esta rutina en alguno de sus  programas se recomienda cambie colores, opciones ...    para ajustarlo a sus gustos. Por ejemplo si cambia la opción  /EFECTO-LINEAS 'LLENO' 1 del inciso F el 1 por un 20 los rectángulos de los días saldrán con un marco rojo. También cambiar el  font de los números de día por 'SU-I' con lo cual se dibujarán inclinados. O bien quitar la lógica para diferenciar el día de hoy y los demás, ...

 

 

3.3       Combinar varias imágenes:

 

 El programa PSSID2 sirve para ilustrar que se pueden combinar varias imágenes para obtener una resultante que se despliegue o imprima. En este programa se poner de fondo una imagen (misma que se leyó con PSSIB3), se agrega un texto sobre la misma, luego  una gráfica y al final se empalma otra imagen. Se sugiere lo ejecute después de ejecutar el PSSIB3 (ya que se usan varias imágenes cargadas con este programa) y vea lo que se despliega. Los comentarios al programa serían:

 

A)         Poner la imagen de fondo:

La lógica para poner la imagen de fondo consiste en iniciar primero la imagen IMA-CON a las medidas del área de terminal en que se va a desplegar y luego empalmar la imagen del fondo que se leyó de disco  y que está en FOTO-1.          

NOTA: Otra opción es pasar FOTO-1 a IMA-CON o bien usar FOTO-1 para efectuar las operaciones, pero  entonces sería necesario conocer las dimensiones en pixeles de dicha imagen y con base a éstas, poner la gráfica y la otra imagen. Las instrucciones son:

 

      FORMAR IMAGEN IMA-CON /INICIO 0 0 'BLANCO'  $

           /MEDIDA-AREA 10 DIM-X DIM-Y /X-Y-GRAFICO

             ...

 

      FORMAR IMAGEN IMA-CON /EMPALMAR 0 0 0 0 FOTO-1 0

 

 La opción de /INICIO tal como se había descrito forma una imagen en este caso de fondo 'BLANCO' y con dimensiones 0 0, estas son remplazadas por las del área 10 por la opción de /MEDIDA-AREA y también deja en DIM-X y DIM-Y las medidas en pixeles de dicha área. Por ultimo se usará  /X-Y-GRAFICO  es decir el punto 0-0 está en el extremo superior  izquierdo del área y el eje Y es hacia abajo.

 

Para pasar la imagen se puso /EMPALMAR con la  posición X-Y donde se pondrá, el ancho y largo que ocupará donde se empalma, luego la imagen y el número de la marca.  En este caso la posición será  la 0 0, y las medidas 0 0  con lo cual se asume las que tenga la imagen donde se empalma. La imagen se leyó de disco en FOTO-1 y no hay marca. Note que internamente la imagen contenida en FOTO-1 se va a reducir o agrandar para acomodarla al tamaño de  /INICIO que es el del área 10.

 

B)         Agregar el texto "Gráfica":

 

Se desea poner este texto en Relieve, es decir se dibuja la línea exterior de cada letra de acuerdo al font seleccionado y a un ancho especificado por /EFECTO-LINEAS 'LLENO' 50.

 

Se usará la opción de /TEXTO,  el punto para ponerlo será a la mitad del eje X y a 50 pixeles abajo y centrado a la mitad 'C-M' Luego se especifica el texto a poner en este caso 'Graficas' y el font SUIZO, con Negrita y con Relieve en 'SU-NR' El tamaño será 90 de alto y 0 el ancho por lo que ocupará lo que necesite. Por último se da el color del fondo 'TRANSPARENTE' el color de las líneas de las letras 'AZUL' y en el  interior se tendrá un efecto de 'ROMBOS' en color 'ROJO'         

La instrucción es:

 

             FORMAR IMAGEN IMA-CON $

           /EFECTO-LINEAS 'LLENO' 50 $

           /TEXTO DIM-X2 50 'C-M' 'Graficas' $

                 'SU-NR' 90 0 'TRANSPARENTE' $

                      'AZUL' 'ROMBOS' 'ROJO'

 

Note que primero se especificó el ancho de la línea del font con /EFECTO-LINEAS.

 

Otra forma de poner el texto sería  poner al efecto 'LLENO' con 'TRANSPARENTE' con lo  cual se logra que dibuje las líneas exteriores del font y conserve el fondo de la imagen. La instrucción seria:

 

                 FORMAR IMAGEN IMA-CON

             /EFECTO-LINEAS 'LLENO' 50 $

             /TEXTO DIM-X2 50 'C-M' 'Graficas' $

                     'SU-NR' 90 0 'TRANSPARENTE' $

                                              'NEGRO' 'LLENO' 'TRANSPARENTE'

 

C)         Incluir la gráfica:

 

Las instrucciones para hacerlo serían:

 

        FORMAR IMAGEN IMA-CON /GRAFICA-BARRAS  $

           /NO-LETREROS /NO-VALORES /2D $

           /POSICION-MEDIDAS 20 DIM-Y2 DIM-X2 DIM-Y2  $

              /DATO 10 '1'   'ROJO'                  $

              /DATO 25 '2'   'AMARILLO'              $

              /DATO 18 '3'   'GRIS'                  $

              /DATO 14 '4'   'VERDE'                 $

              /CONSTRUIR

 

Estas instrucciones se explicaron en el capitulo I  Aquí se dan valores fijos para los datos, pero se  puede remplazar por valores reales. La opción nueva             es la de /POSICION-MEDIDAS en donde se especifica la posición en X y en Y donde se desea desplegar la gráfica y el tamaño en X y en Y de la misma.

 

D)         Agregar otra imagen:

 

Para agregar la imagen contenida en FOTO-2 se usa  /EMPALMAR con la posición y medidas en donde se desea. NOTE que la opción de empalmar solo sirve  para imágenes que se leyeron, no se puede usar  por ejemplo con imágenes que tienen figuras geométricas o gráficas. La instrucción seria:

 

            FORMAR IMAGEN IMA-CON $

        /EMPALMAR DIM-2X3 DIM-Y3 DIM-X3 DIM-Y3 FOTO-2 0

 

E)         Desplegar:

 

Por ultimo se despliega la imagen de IMA-CON y una vez hecho se recorta y se vuelve a desplegar. Lo anterior con el propósito de ilustrar el uso de la opción de /CORTAR en que de una imagen se extrae otra imagen.  NOTE como la gráfica de barras puede aparecer distorsionada,  ya que para desplegar la imagen recortada se va a agrandar. Las gráficas siempre se construyen donde se van a desplegar o imprimir para que NO tengan distorsiones.

 

F)          Pasar a disco:

 

Al final se escribe en un archivo de la PC la imagen  en formato de imagen, es decir para que se pueda leer  por cualquier otro producto que maneje imágenes. Las instrucciones para hacerlo son:

 

          OPCION TEMPORAL 900  /NOMBRE 'ima.png' $

               /DISCO 'c:' /INTERNET /EXTERNO /ESCRITURA

          ESCRIBIR TEMPORAL 900 IMA-CON

          OPCION TEMPORAL 900

 

El temporal se forma con las siguientes opciones:

·                   Nombre con que se guarda la imagen (/NOMBRE)

·                   Unidad de disco (/DISCO)

·                   Guardar en la PC (/INTERNET)

·                   Dejar en formato de imagen (/EXTERNO)

·                   Se va a escribir (/ESCRITURA)

 

            Luego están las instrucciones para escribir y para cerrar el archivo.

 

3.4       Resumen de FORMAR IMAGEN:

 

Las nuevas opciones de formar imagen que sirven para poner figuras geométricas o combinar varias imágenes son:

 

Descripción

Operación

Iniciar la imagen  a unas dimensiones.

/INICIO Dim-X Dim-Y Color-fondo

Sacar las medidas de un área de terminal y remplazarlas en /INICIO.

/MEDIDA-AREA Numero-Area (Dim-X Dim-Y)

Agrandar o reducir una imagen leída y ponerla en otra imagen asociándola a una marca.

/EMPALMAR Pos-X Pos-Y Dim-X Dim-Y Imagen-Leída Número-Marca

Cortar una imagen y dejar la nueva en la original.

/CORTAR Pos-X Pos-Y  Dim-X Dim-Y

Ejes X-Y normales o Gráficos.

/X-Y-NORMAL o /X-Y-GRAFICO

Definir efectos de las líneas de figuras.

/EFECTO-LINEAL Efecto Ancho*10

Redondear rectángulos.

/REDONDEADO

Usar color marco para  el efecto en vez de color inverso.

/USAR-COLOR-MARCO

Cancelar opciones de figuras.

/NO-OPCIONES-FIGURAS

Dibujar línea.

/LINEA Pos-X-i Pos-Y-i Pos-X-f Pos-Y-f Ancho*10  (Efecto)

Dibujar triángulo.

/TRIANGULO Pos-X1 Pos-Y1 Pos-X2 Pos-Y2 Pos-X3 Pos-Y3 Color-marco (Efecto Color-efecto Número-Marca)

Dibujar rectángulo.

/RECTANGULO Pos-X Pos-Y Dim-X Dim-Y Color-marco (Efecto Color-efecto Número-Marca)

Dibujar elipse.

/ELIPSE   Pos-X Pos-Y Radio-1 Radio-2 Angulo-1 Angulo-2 Color-marco (Efecto Color-efecto Número-Marca)

Dibujar círculo.

/CIRCULO Pos-X Pos-Y Radio Angulo-1 Angulo-2 Color-marco (Efecto Color-efecto Número-Marca)

Agregar un Texto.

/TEXTO  Pos-X Pos-Y Tipo-pos Texto Font Alto Ancho Color-fondo Color-letras (Efecto Color-efecto)

 

Los tipos de posición en texto son:

 

Número

Nombre

Descripción

0

'JI'

Justificado a la izquierda

1

'C'

Centrado horizontalmente

2

'JD'

Justificado a la derecha

3

'+90'

Girado 90 grados (de abajo hacia arriba)

4

'-90'

Girado –90 grados (a arriba para abajo)

10

'JI-M'

Justificado a la izquierda, centrado verticalmente

11

'C-M'

Centrado horizontalmente, centrado verticalmente

12

'JD-M'

Justificado a la derecha, centrado verticalmente

 

Los valores del font son:

 

Número

Nombre

1

'MODERNO'             

2

'DECORATIVO'          

3

'ROMANO'              

4

'SUIZO'

5

'MANUSCRITO'

 

Para general las opciones de Negrita, Inclinado o Relieve se deberá de tomar las dos primeras letras del font, poner el guión y una, dos o las tres de N I R (En este orden).

 

El número se genera: Para I sumar 8        Para N sumar 16             Para R sumar 32

 

Ejemplos:          'MO-N'         1+16=17

                          'MA-I'           5+8=13

                          'MA-NR'       5+16+32=53

                          'DE-IR'         2+8+32=42

                           'DE-NIR'      2+8+16+32=58

 

Así, queda la siguiente tabla de números de font:

 

 

Efecto
Nombre

nada

N

NI

NIR

NR

I

IR

R

MO

1

17

25

57

49

9

41

33

DE

2

18

26

58

50

10

42

34

RO

3

19

27

59

51

11

43

35

SU

4

20

28

60

52

12

44

36

MA

5

21

29

61

53

13

45

37

 

Efectos de líneas:

 

Número

Nombre

0

'NORMAL'

1

'PUNTOS-JUNTOS'

2

'PUNTOS-SEPARADOS'

3

'GUION-GIGANTE'

4

'GUION-GRANDE'

5

'GUION-MEDIANO'

6

'GUION-CHICO'

7

'GUION-MEDIANO-CHICO'

8

'GUION-PUNTO'

 

Los efectos de figuras son iguales a las gráficas:

 

Efectos normales

Efectos grandes

Número

Nombre

Número

Nombre

0

'LLENO'

 

 

1

'PUNTOS'

51

'PUNTOS-GRANDES'

2

'LINEAS-HORIZONTALES'

52

'HORIZONTALES-SEPARADAS'

3

'LINEAS-VERTICALES'

53

'VERICALES-SEPARADAS'

4

'DIAGONALES-DESCENDENTES'

54

'DESCENDENTES-SEPARADAS'

5

'DIAGONALES-ASCENDENTES'

55

'ASCENDENTES-SEPARADAS'

6

'ROMBOS'

56

'ROMBOS-GRANDES'

7

'CUADRADOS'

57

'CUADRADOS-GRANDES'

8

'CIRCULOS'

58

'CIRCULOS-GRANDES'

9

'ZIG-ZAG'

59

'ZIG-ZAG-GRANDE'