Presentación 10 - Escuela Politécnica Nacional

Transcripción

Presentación 10 - Escuela Politécnica Nacional
Programación con Herramientas Visuales
Clase 10: Barras de estado
Lunes, 20 de Enero de 2003
Iván Bernal, Ph.D.
[email protected]
http://
wwwfie.epn.edu.ec//ibernal
http://wwwfie.epn.edu.ec
Escuela Politécnica Nacional
Quito – Ecuador
Copyright @2003, I. Bernal
Agenda
• Aspectos adicionales de barras
de herramientas.
• Barras de estado.
Dic. 02 – Abril 03
PHV
Iván Bernal, Ph.D.
Ph.D.
http://
wwwfie.epn.edu.ec//ibernal
http://wwwfie.epn.edu.ec
Escuela Politécnica Nacional
Quito - Ecuador
2
Barras de Herramientas (1)
• Las barras de
herramientas son objetos
de la clase CToolBar, y
las barras de estado son
objetos de la clase
CStatusBar.
– Ambas clases se derivan
de CControlBar, la que es
derivada de CWnd.
• Las barras de
herramientas se
construyen en base al
“control común toolbar”.
• Tienen la característica de
“adosamiento” (docking) o
flotantes.
Dic. 02 – Abril 03
PHV
Iván Bernal, Ph.D.
Ph.D.
http://
wwwfie.epn.edu.ec//ibernal
http://wwwfie.epn.edu.ec
Escuela Politécnica Nacional
Quito - Ecuador
3
Barras de Herramientas (2)
• En Visual C++ 6.0, se introdujo un nuevo tipo de barra de
herramientas llamada una “rebar”.
– Las rebar están basadas en los controles que vienen con Microsoft
Internet Explorer.
• Las imágenes de los botones de una barra de herramientas
se almacenan en un solo bitmap.
bitmap
– Cada imagen de un botón tiene un tamaño de 15 pixels x 16 pixels.
– El bitmap se almacena en un archivo Toolbar.bmp, en el
subdirectorio de la aplicación \res.
• Cuando se presiona un botón se envía un mensaje de
comando, de igual forma que lo hacen los menús, y
aceleradores del teclado.
– La mayoría de las veces, un botón en una barra de herramientas
tiene un par en un ítem de un menú.
• También se tiene asociados mensajes de comando para
actualizar el interfaz de usuario, para modificar la apariencia
de los botones.
Dic. 02 – Abril 03
PHV
Iván Bernal, Ph.D.
Ph.D.
http://
wwwfie.epn.edu.ec//ibernal
http://wwwfie.epn.edu.ec
Escuela Politécnica Nacional
Quito - Ecuador
4
Barras de Herramientas (3)
• Abriendo como un archivo de texto el archivo con extensión
“.rc”, se puede observar la descripción de la estructura de
una barra de herramientas.
– Este archivo contiene la descripción de lo que se puede manipular
con el editor de recursos.
Dic. 02 – Abril 03
PHV
Iván Bernal, Ph.D.
Ph.D.
http://
wwwfie.epn.edu.ec//ibernal
http://wwwfie.epn.edu.ec
Escuela Politécnica Nacional
Quito - Ecuador
5
Acceso a la ventan principal
• Las barras de herramienta y de estado están asociadas a la
ventana principal de la aplicación no a la vista.
• Para aplicaciones SDI y MDI, se puede usar la función
AfxGetApp (función global), para acceder al objeto de la
aplicación, y de este se accede al puntero a la ventana principal.
– CMainFrame es una nueva clase definida para el usuario.
– Se realiza “casting” de la ventana principal.
– Se debe incluir el archivo “MainFrm.h” para hacer uso de funciones o
datos de la clase CMainFrame.
– Se debe hacer públicos los miembros que se deben acceder, o proveer
funciones de acceso.
Dic. 02 – Abril 03
PHV
Iván Bernal, Ph.D.
Ph.D.
http://
wwwfie.epn.edu.ec//ibernal
http://wwwfie.epn.edu.ec
Escuela Politécnica Nacional
Quito - Ecuador
6
Actividades Relacionadas
• Revisar el ejemplo del libro de Kruglinski.
• Revisar los comentarios asociados expuestos
en el libro.
Dic. 02 – Abril 03
PHV
Iván Bernal, Ph.D.
Ph.D.
http://
wwwfie.epn.edu.ec//ibernal
http://wwwfie.epn.edu.ec
Escuela Politécnica Nacional
Quito - Ecuador
7
Barras de Estado (1)
• No responde a acciones del usuario ni
genera mensajes de comando.
– Solo presenta texto considerado complementario a la
aplicación.
– Existen paneles que pueden presentar:
• Líneas de mensaje.
• Indicadores de estado.
– Para usar la barra de estado para algo particular, el
comportamiento por predefinición se debe cambiar:
• Mensajes asociados a menús y barras de
herramienta.
• Estado del teclado.
Dic. 02 – Abril 03
PHV
Iván Bernal, Ph.D.
Ph.D.
http://
wwwfie.epn.edu.ec//ibernal
http://wwwfie.epn.edu.ec
Escuela Politécnica Nacional
Quito - Ecuador
8
Barras de Estado (2)
• Existe un arreglo de indicadores generado y
almacenado en MainFrm.cpp.
• Las barras de herramienta y de estado se
crean bajo el control de la ventana principal.
• Para cambiar los indicadores se usa la
función SetIndicators.
Dic. 02 – Abril 03
PHV
Iván Bernal, Ph.D.
Ph.D.
http://
wwwfie.epn.edu.ec//ibernal
http://wwwfie.epn.edu.ec
Escuela Politécnica Nacional
Quito - Ecuador
9
Barras de Estado (3)
Dic. 02 – Abril 03
PHV
Iván Bernal, Ph.D.
Ph.D.
http://
wwwfie.epn.edu.ec//ibernal
http://wwwfie.epn.edu.ec
Escuela Politécnica Nacional
Quito - Ecuador
10
Barras de Estado (4)
• Línea de mensaje:
– Presenta un mensaje que puede cambiar dinámicamente.
– Se debe tener acceso a la barra de estado antes de cambiar
su contenido, y luego definir el texto a presentarse.
• Se requiere un índice, que inicia en 0, desde el extremo
izquierdo.
– El código que se presenta correspondería a lo que se haría
desde una clase vista.
Dic. 02 – Abril 03
PHV
Iván Bernal, Ph.D.
Ph.D.
http://
wwwfie.epn.edu.ec//ibernal
http://wwwfie.epn.edu.ec
Escuela Politécnica Nacional
Quito - Ecuador
11
Barras de Estado (5)
• Indicadores de Estado:
– Un panel de estado está relacionado a un mensaje definido
entre los recursos de la aplicación.
– Los mensajes en los paneles pueden ser escondidos o
presentados, de acuerdo a la lógica del programa.
– El ID es utilizado para enrutar el comando para actualizar el
interfaz de usuario.
– El código anterior está relacionado al “Caps Lock” (letras
mayúscula o minúsculas).
Dic. 02 – Abril 03
PHV
Iván Bernal, Ph.D.
Ph.D.
http://
wwwfie.epn.edu.ec//ibernal
http://wwwfie.epn.edu.ec
Escuela Politécnica Nacional
Quito - Ecuador
12
Barras de Estado (6)
• La función de creación de
la barra de estado,
acepta por default el valor
como ID
AFX_IDW_STATUS_BAR
.
– En el código generado y
presentado en una
transparencia anterior, no
se especificó este ID.
– MFC utiliza este ID para
saber que presentar como
línea de mensaje,
indicando los mensajes
asociados a menús y
botones.
– Para cambiar el
comportamiento de la
línea de mensaje se debe
cambiar este ID.
Dic. 02 – Abril 03
PHV
Iván Bernal, Ph.D.
Ph.D.
http://
wwwfie.epn.edu.ec//ibernal
http://wwwfie.epn.edu.ec
Escuela Politécnica Nacional
Quito - Ecuador
13
Barras de Estado (7)
• Se debe definir la constante ID_MY_STATUS_BAR,
en el archivo “resource.h”, utilizando el editor de
símbolos de Visual C++.
• El editor elegirá el número asociado al símbolo.
Dic. 02 – Abril 03
PHV
Iván Bernal, Ph.D.
Ph.D.
http://
wwwfie.epn.edu.ec//ibernal
http://wwwfie.epn.edu.ec
Escuela Politécnica Nacional
Quito - Ecuador
14
Barras de Estado (8)
• Finalmente, si se debe cambiar el ID de la barra de estados,
también se debe corregir la lógica asociada a esconder y
presentar la barra de estados.
– ID_VIEW_STATUS_BAR representa la barra de estados y para ella se
debe generar las funciones asociadas a los mensajes de comandos, en
la clase CMainFrame.
– Revisar el ejemplo B del capítulo de Kruglinski para mas detalles.
Dic. 02 – Abril 03
PHV
Iván Bernal, Ph.D.
Ph.D.
http://
wwwfie.epn.edu.ec//ibernal
http://wwwfie.epn.edu.ec
Escuela Politécnica Nacional
Quito - Ecuador
15
Barras de Estado (9)
• En este ejemplo se modificará la información
presentada por la barra de estados, de acuerdo a lo
que se indica en la figura.
• Para este ejemplo se debe cambiar el ID de la
ventana, como se explicó anteriormente y cambiar el
código asociado a la creación de la barra de estados.
Dic. 02 – Abril 03
PHV
Iván Bernal, Ph.D.
Ph.D.
http://
wwwfie.epn.edu.ec//ibernal
http://wwwfie.epn.edu.ec
Escuela Politécnica Nacional
Quito - Ecuador
16
Barras de Estado (10)
• Para asignar un mensaje a un símbolo se
debe usar el editor de recursos.
• Esto es necesario para definir los nuevos
elementos del arreglo que acepta la barra de
estados.
Dic. 02 – Abril 03
PHV
Iván Bernal, Ph.D.
Ph.D.
http://
wwwfie.epn.edu.ec//ibernal
http://wwwfie.epn.edu.ec
Escuela Politécnica Nacional
Quito - Ecuador
17
Barras de Estado (11)
• Para generar los handlers asociados a la barra de estados en
CMainFrame, se ubica el símbolo ID_VIEW_STATUS_BAR y
se generan los dos mensajes asociados.
Dic. 02 – Abril 03
PHV
Iván Bernal, Ph.D.
Ph.D.
http://
wwwfie.epn.edu.ec//ibernal
http://wwwfie.epn.edu.ec
Escuela Politécnica Nacional
Quito - Ecuador
18
Barras de Estado (12)
• Los handlers asociados a los nuevos indicadores de la barra
de estados en CMainFrame, deben ser agregados
manualmente.
– Se debe añadir el código necesario en “.h” y “.cpp”.
• Se debe cambiar el arreglo de indicadores.
Dic. 02 – Abril 03
PHV
Iván Bernal, Ph.D.
Ph.D.
http://
wwwfie.epn.edu.ec//ibernal
http://wwwfie.epn.edu.ec
Escuela Politécnica Nacional
Quito - Ecuador
19
Barras de Estado (13)
• Para el ejemplo, se debe presentar información
relacionada a si los botones del mouse están o no
presionados.
– Los botones del mouse derecho e izquierdo tienen asociados
códigos de teclas virtuales.
– No se depende de mensajes del mouse para esta tarea.
Dic. 02 – Abril 03
PHV
Iván Bernal, Ph.D.
Ph.D.
http://
wwwfie.epn.edu.ec//ibernal
http://wwwfie.epn.edu.ec
Escuela Politécnica Nacional
Quito - Ecuador
20
Barras de Estado (14)
• El código presenta las acciones a tomarse dentro de la vista
para cambiar la línea de mensaje de la barra de estado.
• En este caso cada vez que se mueva el mouse debe
actualizarse el contenido de la barra de estado.
Dic. 02 – Abril 03
PHV
Iván Bernal, Ph.D.
Ph.D.
http://
wwwfie.epn.edu.ec//ibernal
http://wwwfie.epn.edu.ec
Escuela Politécnica Nacional
Quito - Ecuador
21
Actividades Relacionadas
• Revisar el ejemplo del
libro de Kruglinski.
• Revisar los
comentarios
asociados expuestos
en el libro, para mas
detalles sobre los
pasos asociados.
Dic. 02 – Abril 03
PHV
Iván Bernal, Ph.D.
Ph.D.
http://
wwwfie.epn.edu.ec//ibernal
http://wwwfie.epn.edu.ec
Escuela Politécnica Nacional
Quito - Ecuador
22
Proyecto (1)
• Agregar código para
cambiar la barra de
estados.
– Un mensaje deberá
presentar cuantos
números del total a
generarse se tiene en un
momento dado.
– Un indicador presentará la
información si se trabaja
en modo de número o no.
– La información asociada
con los botones de la
barra de herramientas
sigue siendo la misma.
Dic. 02 – Abril 03
PHV
Iván Bernal, Ph.D.
Ph.D.
http://
wwwfie.epn.edu.ec//ibernal
http://wwwfie.epn.edu.ec
Escuela Politécnica Nacional
Quito - Ecuador
23
Proyecto (2)
• Tres nuevos botones se deben añadir para definir el color de
los rectángulos vacíos, los que tienen números y el texto.
– Se debe incluir también un ítem en los menús por cada caso.
• Frente a un click en los botones se debe presentar la ventana
de selección de color que permite al usuario escoger el color.
Dic. 02 – Abril 03
PHV
Iván Bernal, Ph.D.
Ph.D.
http://
wwwfie.epn.edu.ec//ibernal
http://wwwfie.epn.edu.ec
Escuela Politécnica Nacional
Quito - Ecuador
24
Proyecto (3)
• El último botón a añadirse es el “T”, que permite definir el
tamaño de la cuadrícula.
– Se debe incluir también un ítem en el menú.
• Al presionar este botón se debe presentar una ventana de
diálogo, como en la figura.
– La ventana permite definir el número de filas y columnas.
– El botón “Cancel” cancela la operación.
– El botón “OK” actualiza el tamaño pero desecha tdos los números
generados.
– Debe haber siempre consistencia con la información de la barra de
estados.
Dic. 02 – Abril 03
PHV
Iván Bernal, Ph.D.
Ph.D.
http://
wwwfie.epn.edu.ec//ibernal
http://wwwfie.epn.edu.ec
Escuela Politécnica Nacional
Quito - Ecuador
25
Proyecto (4)
• Proyecto:
– Para el 27 de Enero de 2003, hasta las 9am.
– Detalladamente revisar la funcionalidad del programa
entregado.
– Pueden utilizar mi solución al Proyecto 2.
• Deber:
– Para el Viernes 24 de Enero de 2003, hasta las 9am
(enviar por email).
– Estudiar las secciones:
• The Internet Explorer Rebar Toolbar.
• The EX14C Rebar Example .
– Crear un proyecto y reproducir la funcionalidad
sugerida en el ejemplo.
– Incluir comentarios sobre los pasos seguidos.
Dic. 02 – Abril 03
PHV
Iván Bernal, Ph.D.
Ph.D.
http://
wwwfie.epn.edu.ec//ibernal
http://wwwfie.epn.edu.ec
Escuela Politécnica Nacional
Quito - Ecuador
26
Ventanas de Diálogo (1)
Dic. 02 – Abril 03
PHV
Iván Bernal, Ph.D.
Ph.D.
http://
wwwfie.epn.edu.ec//ibernal
http://wwwfie.epn.edu.ec
Escuela Politécnica Nacional
Quito - Ecuador
27
Ventanas de Diálogo (2)
• La clase CColorDialog representa la ventana para
escoger los colores.
– Esta clase tiene como miembro la estructura “m_cc”, del tipo
CHOOSECOLOR .
– En el código de ejemplo se usa el miembro “rgbResult ”, para
presentar el color actualmente seleccionado en la ventana.
• Esto funciona si la bandera (flag) CC_RGBINIT está
seleccionada, como es el caso del ejemplo.
• CC_FULLOPEN permite presentar la sección extra de la
ventana para definir colores del usuario.
– La función DoModal presenta finalmente la ventana.
• La palabra Modal significa que solo esa ventan está activa;
la vista o ventana principal no pueden interactuar con el
usaurio.
– Cuando el usuario concluye su tarea con la ventana
presionando “OK” se ejecuta la función GetColor( ) para
recuperar la selección hecha.
Dic. 02 – Abril 03
PHV
Iván Bernal, Ph.D.
Ph.D.
http://
wwwfie.epn.edu.ec//ibernal
http://wwwfie.epn.edu.ec
Escuela Politécnica Nacional
Quito - Ecuador
28
Ventanas de Diálogo (3)
• Agregar una nueva ventana de diálogo.
– Incluye dos botones que se usan si son necesarios y su
texto puede ser cambiado.
Dic. 02 – Abril 03
PHV
Iván Bernal, Ph.D.
Ph.D.
http://
wwwfie.epn.edu.ec//ibernal
http://wwwfie.epn.edu.ec
Escuela Politécnica Nacional
Quito - Ecuador
29
Ventanas de Diálogo (4)
• En la ventana se pueden
agregar elementos de la
barra de controles.
• Los que se requieren por
ahora son:
– El “static” para poner
mensajes.
– El de “Edición” para obtener
el valor del usuario.
• Para definir propiedades
de cada elemento, se
selecciona y se utiliza el
botón derecho del mouse
y seleccionar
“Propiedades”.
Dic. 02 – Abril 03
PHV
Iván Bernal, Ph.D.
Ph.D.
http://
wwwfie.epn.edu.ec//ibernal
http://wwwfie.epn.edu.ec
Escuela Politécnica Nacional
Quito - Ecuador
30
Ventanas de Diálogo (5)
• En la ventana de
“Propiedades”:
– Se puede cambiar el ID
del control en la pestaña
“General”.
– Para el ejemplo conviene
que se ingresen
solamente números para
las filas y columnas.
• Esto se define en la
pestaña de “Styles”.
• La validación se hace
sin que el usuario
agregue una sola
línea de código.
Dic. 02 – Abril 03
PHV
Iván Bernal, Ph.D.
Ph.D.
http://
wwwfie.epn.edu.ec//ibernal
http://wwwfie.epn.edu.ec
Escuela Politécnica Nacional
Quito - Ecuador
31
Ventanas de Diálogo (6)
• Con doble click del mouse se puede asociar una
nueva clase con la ventana de diálogo.
• Se debe asignar un nombre para esta nueva
clase.
• La base de la nueva clase es CDialog y se indica
el ID asignado en el editor para nuestra nueva
ventana.
Dic. 02 – Abril 03
PHV
Iván Bernal, Ph.D.
Ph.D.
http://
wwwfie.epn.edu.ec//ibernal
http://wwwfie.epn.edu.ec
Escuela Politécnica Nacional
Quito - Ecuador
32
Ventanas de Diálogo (7)
• Luego de presionar “OK” se selecciona la pestaña
“Member variables de la ventana del ClassWizard.”
– Se añadirá una variable miembro de la nueva clase que represente
a los diferentes controles agregados en la ventana.
– Para el ejemplo es de importancia el control que permite al usuario
especificar un valor.
Dic. 02 – Abril 03
PHV
Iván Bernal, Ph.D.
Ph.D.
http://
wwwfie.epn.edu.ec//ibernal
http://wwwfie.epn.edu.ec
Escuela Politécnica Nacional
Quito - Ecuador
33
Ventanas de Diálogo (8)
• Con doble click sobre el nombre seleccionado se
define las propiedades de la variable.
– Se asigna un nombre.
– La categoría es un valor (la alternativa es usar una variable que
represente un control).
– El tipo de valor a usarse en este caso es un entero.
• Podría ser claramente para este control de texto un mensaje.
Dic. 02 – Abril 03
PHV
Iván Bernal, Ph.D.
Ph.D.
http://
wwwfie.epn.edu.ec//ibernal
http://wwwfie.epn.edu.ec
Escuela Politécnica Nacional
Quito - Ecuador
34
Ventanas de Diálogo (9)
• Debido a las características seleccionadas (el usuario solo
puede ingresar un número entero), el wizard nos ayuda a
definir el rango del entero.
– En este caso los valores deben fluctuar entre 1 y 10.
• Se puede observar que se ha añadido una nueva clase en
el “ClassView”.
• Para este caso sencillo no es necesario agregar código en
la clase del diálogo.
Dic. 02 – Abril 03
PHV
Iván Bernal, Ph.D.
Ph.D.
http://
wwwfie.epn.edu.ec//ibernal
http://wwwfie.epn.edu.ec
Escuela Politécnica Nacional
Quito - Ecuador
35
Ventanas de Diálogo (10)
• Para usar la nueva clase, se debe incluir siempre:
#include "MiDialogo.h"
• El código de ejemplo selecciona un valor inicial,
presenta la ventana de diálogo y luego recupera el
nuevo valor ingresado por el usuario.
• Revisar el código del ejemplo B que incluye esta
ventana de diálogo.
Dic. 02 – Abril 03
PHV
Iván Bernal, Ph.D.
Ph.D.
http://
wwwfie.epn.edu.ec//ibernal
http://wwwfie.epn.edu.ec
Escuela Politécnica Nacional
Quito - Ecuador
36

Documentos relacionados