2.
Dise Diseño ño de la Inte Interf rfaz az Gráfi ráfica ca con con el el Usu Usuar ario io.. SQLWindows provee al usuario los objetos necesarios para diseñar la
interface en el ambiente de Windows. Windows. Todos los objetos objetos son ventanas. ventanas.
Las Las vent ventan anas as segú según n su jera jerarqu rquía ía se clas clasif ific ican an en Vent Ventan anaa Padre Padre y Ventanas Hijas, las primeras contienen a las segundas.
Básicamente existen tres tipos de Ventanas Padre ( o Madre) :
•
Form Windows
•
Dialog Box
•
Top Level Table Window
2.1. Form orm Windows ows Es la venta ventana na gener general al de toda toda aplica aplicaci ción ón en ambie ambiente nte Windo Windows ws,, se caracteriza por tener un menú de sistema, una barra de menú y barras para hacer hacer Scroll Scroll vertic vertical al u horiz horizont ontal. al. En este tipo de ventana ventana se da la mayor mayor interacción entre el usuario y la aplicación. aplicación.
La ventana del Bloc de notas ( Notepad) es un ejemplo típico de Form Window.
SQLWindows
14
System Menu
Botones para Maximizar y Minimizar
Barra de Menú
Scroll Horizontal y Vertical
Se ha puesto de moda que adicionalmente las formas incluyan un Tool Bar y un Status Bar, aunque estas son variaciones de a Form Window, SQLWindows las soporta.
2.2. Dialog Box Parecidas a la Form Window, la ventana del tipo Dialog Box no posee Barra de Menú ni de Scroll, su propósito es la de proveer un elemento de captura rápida.
La ventana que aparece cuando se va a abrir un archivo es un Dialog Box.
SQLWindows
15
Pueden tener uno o más de los siguientes modos de operación:
No Modal
El usuario puede cambiar a otra ventana de la
Modal
aplicación (modeless) El usuario no puede cambiar a otra ventana de la
System Modal
aplicación hasta cerrar esta ventana. El usuario no puede cambiar a otra ventana de Windows hasta cerrar la ventana.
2.3. Top Level Table Window Estas ventanas son similares a las Forms Window pero contienen sólo un objeto para capturar y despliegue de información en forma tabular (parecida a una hoja de EXCEL).
SQLWindows
16
2.4. Manipulación de Objetos. Por su parte las ventanas hijas son de una gran variedad y se emplean para diversos propósitos.
Para colocarlos en una ventana Form Window o Dialog Box sólo se requiere seleccionar el objeto del Tool Palette y trazarlo en el área que va a
SQLWindows
17
ocupar, también se tienen dos elementos para manipular los objetos, es decir, moverlos o cambiar su tamaño o sus características.
2.4.1. Paleta de Herramientas (Tool Palette).
El
Window Grabber selecciona un objeto; con un click del botón
izquierdo se marca un objeto para moverlo o cambiar su tamaño, con el click del botón derecho se accede a las ventanas del Customizer, con la cual se pueden ajustar las propiedades del objeto a valores particulares, por ejemplo a un Pushbutton se le puede colocar un título, una imagen, configurar el color para el texto, para el fondo, etc.
Selección de objetos.
Se puede seleccionar varios objetos a la vez cambiando la tecla Shift y haciendo Click con el Mouse. SQLWindows
18
El
Object Selector permite seleccionar varios objetos.
Esta
herramienta traza un rectángulo y todos los objetos contenidos en el son seleccionados de la misma forma que el método anterior, con la diferencia de que este es más rápido.
Objeto Nombre Uso Background Text Para colocar textos en la ventana.
Prefijo No aplica
Data Field
Se usa para capturar o desplegar un dato.
df
Pushbutton
Proporciona un m ecanismo para que e l
List Box
usuario indique el inicio de una acción. Despliega una lista de valores.
lb
Picture
Permite incluir un gráfico en la interfaz
pic
Group Box
de la aplicación. Crea un marco con un título. Además del
pb
gb
aspecto estético, se emplea para agrupar Multiline Text
controles y separar dichos grupos. Se utiliza para la captura y despliegue de
ml
Radio Button
textos en la interface, es un minieditor. Se emplea para que el usuario elija una (y
rb
sólo una) opción de un conjunto, por Combo Box
ejemplo, el sexo de una persona. Es la combinación de Data Field + List
cmb
Box, con este control se captura un dato
(tecleado) o bien puede ser seleccionado desde una lista. Horizontal Scroll Se emplea para que el usuario indique un Bar
cambio de valor (izquierda - derecha,
Vertical Scroll
incrementa - decrementa). Se emplea para que el usuario indique un cambio
SQLWindows
de
valor
(arriba
-
sb
sb
abajo, 19
Frame
incrementa - decrementa). Se utiliza para dar realce a la interface.
Check Box
Parecido al Radio Button, sin embargo en
No aplica cb
este caso el usuario puede seleccionar Child Table
más de una opción. Se emplea para despliegue y captura de
Line
información en forma tabular. Se utiliza para dar realce a la interfaz.
Option Button
Se emplea para crear barrar y paletas de
tbl No aplica ob
herramientas.
El prefijo se utiliza para asignar nombre al objeto, los nombres deben empezar con una letra y pueden tener una longitud de hasta 32 caracteres, debe tenerse cuidado en el uso de mayúsculas y minúsculas, pues SQLWindows hace distinción de ellas.
Nombres
Es importante utilizar una nomenclatura para asignación de nombres para identificar fácilmente el tipo de objeto y su función, la nomenclatura para asignación de nombres sigue dos reglas básicas: •
El nombre debe iniciar con el prefijo que identifica el tipo de objeto.
•
En general deben usarse minúsculas, sólo la primera letra de cada
palabra debe ir en mayúsculas.
Ejemplos: dfNoEmpleado lbEstados tblComisionados SQLWindows
20
Seguir una nomenclatura apropiada evitará muchos dolores de cabeza para depurar una aplicación.
¿ Que objetos utilizar ? y ¿ Como utilizar estos objetos ?
Los objetos a utilizar deben elegirse en función de como se desea que la aplicación trabaje, ello implica necesariamente un análisis de la información que la aplicación va a utilizar para decidir los objetos necesarios que se van a utilizar en la interface, así como el número de ventanas que va a necesitar. En muchas ocasiones una aplicación requiere de más de una ventana.
2.5. Consideraciones en el diseño. Al diseñar una aplicación lo primero que debe hacerse es analizar el tipo de datos que se van a capturar y desplegar dentro de la ventana, con base en ello se puede diseñar la ventana combinando los diferentes elementos de control de SQLWindows.
Modelo Entidad Relación (Esquema Lógico) para el catálogo de Clientes
SQLWindows
21
La aplicación a desarrollar deberá alimentar renglones a la tabla Clientes, se puede ver como algunos valores deben existir en otras tablas
(Llaves Foráneas), por lo que en la forma de captura conviene utilizar Combo Box de tal forma que el usuario de un valor válido para los campos
que relacionan la tabla Clientes con la tabla Tipo Cliente y Agente.
Para las columnas que no estén restringidas se puede utilizar objetos Data Filed.
Para las columnas Descripción es conveniente utilizar un objeto del tipo Multiline por la longitud de la información.
Para el caso del Agente, sería deseable que el usuario capturara un agente existente en la Base de Datos, evitar que cometa error al teclear la clave o que tenga que memorizarlas, para tal caso se puede utilizar un Combo Box.
El caso del Tipo de cliente es parecido al Agente, sin embargo el número de claves es menor por lo que se puede utilizar un Radio Button. SQLWindows
22
La aplicación debe permitir realizar consultas, insertar nuevos renglones, modificar renglones ya existentes, así como eliminar renglones. El usuario puede realizar estas acciones por medio de acciones de menú, pero es bueno utilizar Pushbuttons.
Modelo Entidad Relación (Esquema Físico) para el catálogo de Clientes
SQLWindows
23
Ejercicio. 1. Ejecute SQLWindows, si ya lo hizo oprima el botón Nuevo del Tool Bar. 2. Si aparece la ventana de QuickForm oprima el botón Cancel. 3. Antes de continuar borre el contenido de la sección Libraries. 4. Presione la tecla F4 para desplegar el Tool Palette. 5. Cree una nueva forma a partir del Tool Palette, haga click en Form . 6. Configure la forma haciendo click derecho para desplegar el customizer de la
forma, cambie el nombre: elija Object Title y teclee frmMain. 7. Cambie el título, elija Object Title y teclee Captura de Clientes. 8. Agregue Tool Bar y Status Bar a la ventana, elija Accessories Enabled y
seleccione Yes (en caso de que no aparezca el Tool Bar deberá configurar también la propiedad de Accessories, y por separado iniciar con Yes Tool Bar Visible y Status Bar Visible) . 9. En la región del Tool Bar ponga primero un Frame y configure sus propiedades:
Border Style: Etched y Background Color: Al gusto.
10.
Coloque un botón en el Tool Bar, configure su tamaño.
11. Abra el Customizer del botón, asígnele un nombre: Object Name = pbPrimero. 12. Elija la opción Picture Contents, luego la opción File Name, aparecerá una
ventana para la sección de archivo, seleccione el archivo First.bmp , oprima Ok . 13.
Utilice el duplicador de objetos para copiar el botón, luego
cambie el nombre y figura para cada uno de los botones del Tool Bar. 14. En la región de trabajo de la forma coloque los elementos de realce (Frame y
Group Box). 15. Coloque los demás objetos dentro de la forma Datafields, Combo, Radio
Buttons, Multiline, Backgroud Text, configure cada uno de ellos con sus
propiedades características como nombre, título (si es que lo tienen), tipo de dato, máximo tamaño de caracteres, editable, etc.
SQLWindows
24
16.
Recuerde asignar el nombre de los objetos de acuerdo a la
nomenclatura descrita. 17. Pruebe la captura de los campos pasando de uno a otro con el tabulador, ¿El orden
es el correcto?, utilice el botón de 18.
para adecuar el orden.
Guarde la aplicación como Clientes.App.
2.6. Codificando los Menús. Agregar un menú a una aplicación SQLWindows es una tarea sencilla, para ello se debe editar la sección Menú de la ventana (solamente Form Window), en esta sección se puede colocar los siguientes elementos:
Menu Item
Es una opción del menú, cuando el usuario de un Click en
Menu Row
esta opción se ejecutará una acción. Indica que los elementos siguientes deben colocarse en otra
Named Menu
línea. Indica colocar un menú definido en la sección Named
Popup Menu
Menus. Indica colocar un menú.
SQLWindows
25
Window Menu Object Menu
Indica colocar un menú para el control de ventanas MDI. Agrega el comando para editar un objeto de OLE.
Note el uso de & para definir la tecla de acceso rápido al menú.
Los Popup Menu y Window Menu, pueden contener a su vez:
Menu Column
Indica que los siguientes elementos deben colocarse en
Menu Item Menu Separator Popup Menu
otra columna. Una opción de menú. Una opción de menú Coloca otro menú.
Secciones de un Menu Item.
Keyboard Acelerator
Indica que secuencia de teclas accesará la opción en forma directa, pueden ser Ctrl-x, F1 a F12, Shift-F1,
Status Text
SQLWindows
etc. Es la leyenda a desplegar al colocar el cursor en esta
26
Enabled when
opción del menú. Indica cuando esta habilitada o deshabilitada la opción (en gris). En esta sección se coloca cualquier
Checked when
expresión que regrese un valor booleano. Indica en que condición la opción aparecerá con una marca , de igual forma en este apartado se coloca
Menu Actions
una expresión que regrese un valor booleano. Contiene el código a ejecutar cuando el usuario seleccione la opción.
Con la ayuda de las características de OOP es muy sencillo programar los menús, cada opción de menú tiene las secciones descritas en la imagen.
En el programa cada opción del menú se puede ligar con un botón y, seleccionar una opción equivale a hacer click en el botón.
Ejercicio.
El ejercicio consiste ahora en agregar los menús de la aplicación.
SQLWindows
27
1. Abra la aplicación de captura de Clientes. 2.
Marque la sección Menu de la plantilla frmMain.
3.
Despliegue el asistente ( F2).
4.
Marque Popup Menu en el asistente y presione Add Next Level , teclee &Acciones
.
5.
De la ventana superior del asistente seleccione menuEdit y oprima el botón Add Same Level.
6. Agregue los menús Herramientas y Ayuda como agrego el de Acciones. 7.
Incluya los Menu Items de cada menú: marque el Popup Menu en el asistente marque la opción Menu Item y presione el botón Add Next Level, asigne el nombre y propiedades correspondientes al Menu Item.
8.
En el caso del Popup Menu Acciones recuerde colocar un Menu Separator.
9. Cuide la identación de los menús si necesita cambiarla utilice las combinaciones de teclas: , , o .
Evaluación.
SQLWindows
28
1. En el ambiente Windows existen ventanas ____________ y ventanas ____________. Las ventanas Form Window tiene _______________ para que el usuario
2.
indique acciones, y barras de ________________ para ver el contenido de la ventana. Las ventanas Dialog Box, pueden tener tres modalidades de operación:
3.
Modal, _______________ y _________________________.
4. Se pueden modificar las propiedades de las ventanas con la ventana del _____________________________. 5. Utilizando la nomenclatura propuesta cada objeto de SQLWindows se identifica porque su nombre inicia con un __________________. 6. El
objeto
que
sirve
para
capturar
un
dato
se
llama
______________________. 7. El objeto que se utiliza para colocar en la interface un mecanismo mediante el
cual
el
usuario
indique
realizar
una
acción
es
el
_______________________. 8. Cuando se desea que el usuario escoja un dato de una lista de valores se puede
utilizar
una
_________________
o
bien
un
_____________________. 9. Los elementos para dar realce a una ventana son el ___________________ y ____________________. 10.
La elección de
los objetos a utilizar se debe
basar
en
utiliza
un
________________ que la aplicación va a utilizar. 11.
Para
agregar
una
opción
en
un
menú
se
_____________________. 12.
Cuando se desea que la barra del menú tenga más de una línea se
hace uso de un ________________________________. 13.
Los Popup Menu no pueden contener otros Popup Menu. Cierto Falso
SQLWindows
29
14.
La sección
_________________________________________ de
una opción de menú se utiliza para asignar una tecla de acceso rápido. 15.
Cuando se dese colocar una marca de a una opción de menú se utiliza la sección
__________________________
la cual debe
contener una
expresión que de como resultado un valor booleano.
SQLWindows
30
2. DISEÑO DE LA INTERFAZ GRÁFICA CON EL USUARIO..............................14 2.1. Form Windows............................................................................................................................................14 2.2. Dialog Box....................................................................................................................................................15 2.3. Top Level Table Window..........................................................................................................................16 2.4. Manipulación de Objetos..........................................................................................................................17 2.4.1. Paleta de Herramientas (Tool Palette)...............................................................................................18 2.5. Consideraciones en el diseño....................................................................................................................21 2.6. Codificando los Menús..............................................................................................................................25
SQLWindows
31
