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:
·
Resumen.
Al final se tiene un resumen de lo visto.
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:
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.
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
FORMAR IMAGEN
FIGURA-BASE $
/EFECTO-LINEAS 'LLENO' 50 $
/RECTANGULO 0 0 DIM-X DIM-Y $
/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.
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.
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
......
/TEXTO X ( 2 ) YL1 'C-M' 'Mes' $
'SUIZO' SEPY2 0 $
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'
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' $
/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.
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:
/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:
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.

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, ...
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:
/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.
FORMAR IMAGEN IMA-CON
/EFECTO-LINEAS 'LLENO' 50 $
/TEXTO DIM-X2 50 'C-M' 'Graficas'
$
'SU-NR' 90 0
'TRANSPARENTE' $
C)
Incluir la gráfica:
Las instrucciones
para hacerlo serían:
/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:
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.
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' |