clase 4: manejo de eventos - ivan...
TRANSCRIPT
Iván Bernal, [email protected]
httphttp://://wwwfie.epn.edu.ecwwwfie.epn.edu.ec//ibernalibernal
Escuela Politécnica NacionalEscuela Politécnica NacionalQuito – Ecuador
Copyright @2002, I. Bernal
Programación con Herramientas VisualesProgramación con Herramientas Visuales
Clase 4: Manejo de eventosLunes, 16 de Diciembre de 2002
Iván Bernal, Iván Bernal, Ph.DPh.D..httphttp://://wwwfie.epn.edu.ecwwwfie.epn.edu.ec//ibernalibernal
Dic. 02 Dic. 02 –– Abril 03Abril 03PHVPHV
Escuela Politécnica NacionalEscuela Politécnica NacionalQuito Quito -- EcuadorEcuador
22
• Manejo de eventos básicos.
Agenda
Iván Bernal, Iván Bernal, Ph.DPh.D..httphttp://://wwwfie.epn.edu.ecwwwfie.epn.edu.ec//ibernalibernal
Dic. 02 Dic. 02 –– Abril 03Abril 03PHVPHV
Escuela Politécnica NacionalEscuela Politécnica NacionalQuito Quito -- EcuadorEcuador
33
Manejo de eventos (1)• La clase CView, derivada de CWnd incluye
cientos de funciones miembro.– Las funciones que empiezan con On..... son llamadas por la
infraestructura de MFC en respuesta a eventos de Windows.• OnKeyDown (teclas presionadas).• OnLButtonUp (clicks del mouse).
• Muchas de las funciones On...... llamadas por MFC no son virtuales.
– Para usarlas se debe usar un mecanismo especial que ofrece MFC llamado: messagemessage mapmap.
– Esto se hace con ayuda del ClassWizard.– Con el mapa se conecta a MFC con las funciones escritas
por el usuario para los mensajes.
Iván Bernal, Iván Bernal, Ph.DPh.D..httphttp://://wwwfie.epn.edu.ecwwwfie.epn.edu.ec//ibernalibernal
Dic. 02 Dic. 02 –– Abril 03Abril 03PHVPHV
Escuela Politécnica NacionalEscuela Politécnica NacionalQuito Quito -- EcuadorEcuador
44
Manejo de eventos (2)• Mapa de mensajes.
– Si el usuario presiona el botón derecho del mouse sobre una ventana de vista, Windows envía un mensaje WM_LBUTTONDOWN, a esa vista.
– La vista debe entonces tener en su implementación una función:
– El prototipo de la función debe estar también presente en el archivo .h :
– La notación afx_msg es una “no operación” (NOP), que alerta al programador que el prototipo corresponde a una función del mapa de mensajes.
Iván Bernal, Iván Bernal, Ph.DPh.D..httphttp://://wwwfie.epn.edu.ecwwwfie.epn.edu.ec//ibernalibernal
Dic. 02 Dic. 02 –– Abril 03Abril 03PHVPHV
Escuela Politécnica NacionalEscuela Politécnica NacionalQuito Quito -- EcuadorEcuador
55
Manejo de eventos (3)
• Se necesita incluir un macro en el archivo “.cpp” para conectar la función OnLButtonDown a MFC.
• El archivo “.h” requiere contener:
• No es necesario agregar el código manualmente, el ClassWizard presta su ayuda.– Para ciertos mensajes es necesario hacer esta tarea
manualmente.
Iván Bernal, Iván Bernal, Ph.DPh.D..httphttp://://wwwfie.epn.edu.ecwwwfie.epn.edu.ec//ibernalibernal
Dic. 02 Dic. 02 –– Abril 03Abril 03PHVPHV
Escuela Politécnica NacionalEscuela Politécnica NacionalQuito Quito -- EcuadorEcuador
66
Ejemplo de Aplicación
• Se desea que al presionar el botón izquierdo del mouse, una elipse dibujada en la vista, cambie de color entre gris y blanco.
• El cambio se realiza solo cuando el mouse es presionado sobre el rectángulo que contiene a la elipse.
Iván Bernal, Iván Bernal, Ph.DPh.D..httphttp://://wwwfie.epn.edu.ecwwwfie.epn.edu.ec//ibernalibernal
Dic. 02 Dic. 02 –– Abril 03Abril 03PHVPHV
Escuela Politécnica NacionalEscuela Politécnica NacionalQuito Quito -- EcuadorEcuador
77
Manipulación de la Vista (1)• Para presentar información al usuario se debe
dibujar en Ondraw.• La vista debe proveer variables para almacenar el
estado en variables. – El usuario puede interactuar con la vista y provocar
actualizaciones de la misma, cambiando el estado.–– Por ahoraPor ahora no se utilizará el documento y cualquier dato lo
almacenaremos en la vista.
• Para el ejemplo a estudiarse se emplean dos datos miembro:
– m_rectEllipse (CRect): rectángulo que limita una elipse.– m_nColor (integer ): el color de la elipse.
Iván Bernal, Iván Bernal, Ph.DPh.D..httphttp://://wwwfie.epn.edu.ecwwwfie.epn.edu.ec//ibernalibernal
Dic. 02 Dic. 02 –– Abril 03Abril 03PHVPHV
Escuela Politécnica NacionalEscuela Politécnica NacionalQuito Quito -- EcuadorEcuador
88
Manipulación de la Vista (2)
• El valor inicial de m_rectEllipse y m_nColor se define en el constructor de la vista.
• m_nColor podría inicializarse de igual forma.– Como es de tipo int (tipo predefinido en el lenguaje), no
habrá diferencia si se inicializa en el cuerpo del constructor.
• El color de la elipse se cambiará en la función miembro OnLButtonDown.
Iván Bernal, Iván Bernal, Ph.DPh.D..httphttp://://wwwfie.epn.edu.ecwwwfie.epn.edu.ec//ibernalibernal
Dic. 02 Dic. 02 –– Abril 03Abril 03PHVPHV
Escuela Politécnica NacionalEscuela Politécnica NacionalQuito Quito -- EcuadorEcuador
99
• Invalidación de áreas de la vista.– Al presionar el botón del mouse se invocará
OnLButtonDown, y se cambiará el valor de m_nColor.– Cómo se consigue que el usuario observe el cambio de
color en la elipse ? • Se puede cambiar el tamaño de la ventana, pero el
cambio debe ser visible al usuario automáticamente.– OnLButtonDown debe invocar InvalidateRect (de Cwnd).
• InvalidateRect: permite la emisión de un mensajeWM_PAINT , el cual está asociado a a OnDraw de la vista.
• Esta función indica el rectángulo invalidado que debe volver a pintarse.
Manipulación de la Vista (3)
Iván Bernal, Iván Bernal, Ph.DPh.D..httphttp://://wwwfie.epn.edu.ecwwwfie.epn.edu.ec//ibernalibernal
Dic. 02 Dic. 02 –– Abril 03Abril 03PHVPHV
Escuela Politécnica NacionalEscuela Politécnica NacionalQuito Quito -- EcuadorEcuador
1010
Manejo de eventos (4)• Invalidación de áreas de la vista.
– Se debe optimizar el proceso de pintado en OnDraw.– Se debe actualizar sólo los pixels dentro del rectángulo
invalidado.– Se debe siempre especificar el mínimo rectángulo que
contenga a la parte que ha sufrido cambios y debe actualizarse.
– Mientras más pequeño es el rectángulo invalidado más rápido se repinta.
– Es una pérdida de tiempo ejecutar instrucciones para dibujar en un área fuera del rectángulo invalidado.
• Puede que se pinte regiones no visibles. • Puede que se pinte regiones que no han cambiado su
contenido.
Iván Bernal, Iván Bernal, Ph.DPh.D..httphttp://://wwwfie.epn.edu.ecwwwfie.epn.edu.ec//ibernalibernal
Dic. 02 Dic. 02 –– Abril 03Abril 03PHVPHV
Escuela Politécnica NacionalEscuela Politécnica NacionalQuito Quito -- EcuadorEcuador
1111
Manejo de eventos (5)• Para nuestro ejemplo, se invalida un
rectángulo en la función OnLButtonDownpero la función OnDraw debe conocer que rectángulo debe procesar.
– Utilizando la clase CDC que utiliza OnDraw para pintar, se puede invocar a la función pDC->GetClipBox para obtener el área a repintar.
– El rectángulo obtenido en OnDraw será la acumulación de todos los rectángulos invalidados debido a diferentes razones:
• Otras llamadas a InvalidateRect.• Acciones como scrolling y cambio de
dimensiones, etc.
Iván Bernal, Iván Bernal, Ph.DPh.D..httphttp://://wwwfie.epn.edu.ecwwwfie.epn.edu.ec//ibernalibernal
Dic. 02 Dic. 02 –– Abril 03Abril 03PHVPHV
Escuela Politécnica NacionalEscuela Politécnica NacionalQuito Quito -- EcuadorEcuador
1212
Área de cliente en una ventana
• Es La región rectangular que excluye el borde, el título, el menú, la barra de estado y todas las barras de herramientas.
• Para obtener este rectángulo se utiliza la función GetClientRect de la clase CWnd.
• Por lo regular no está permitido dibujar fuera del área de cliente y la mayoría de los mensajes del mouse se reciben en la vista solo cuando el cursor del mouse está en el área de cliente.
Iván Bernal, Iván Bernal, Ph.DPh.D..httphttp://://wwwfie.epn.edu.ecwwwfie.epn.edu.ec//ibernalibernal
Dic. 02 Dic. 02 –– Abril 03Abril 03PHVPHV
Escuela Politécnica NacionalEscuela Politécnica NacionalQuito Quito -- EcuadorEcuador
1313
Clases auxiliares (1)• Las clases están derivadas de estructuras definidas en
Windows y tienen datos miembro públicos.– CRect (RECT): left, top, right bottom. – CPoint (POINT): x, y.– CSize (SIZE): cx, cy.
• Estas clases interactúan e incluso tienen operadores que combinan dichas clases. Se puede:
– Añadir un objeto CSize a un objeto CPoint.– Substraer un objeto CSize de un objeto CPoint.– Substraer un objeto CPoint de otro y entregar un objeto
CSize.– Añadir un objeto CPoint a un CSize y obtener un objeto
CRect.– Substraer un objeto CPoint ó un CSize de un CRect.
Iván Bernal, Iván Bernal, Ph.DPh.D..httphttp://://wwwfie.epn.edu.ecwwwfie.epn.edu.ec//ibernalibernal
Dic. 02 Dic. 02 –– Abril 03Abril 03PHVPHV
Escuela Politécnica NacionalEscuela Politécnica NacionalQuito Quito -- EcuadorEcuador
1414
Clases auxiliares (2)
• La función para procesar el mensaje del mouse asociado al botón izquierdo, recibe las coordenadas en un objeto CPoint que indica la posición del mouse en coordenadas del área de cliente.
• Para el ejemplo de la elipse, limitada por un rectángulo, se puede chequear si el usuario presionó el mouse dentro de dicho rectángulo.
• La función TopLeft de CRect retorna un objeto CPoint.• La función Size de CRect retorna un objeto CSize.• La función PtInRect de CRect chequea si un punto está
dentro de un rectángulo.
Iván Bernal, Iván Bernal, Ph.DPh.D..httphttp://://wwwfie.epn.edu.ecwwwfie.epn.edu.ec//ibernalibernal
Dic. 02 Dic. 02 –– Abril 03Abril 03PHVPHV
Escuela Politécnica NacionalEscuela Politécnica NacionalQuito Quito -- EcuadorEcuador
1515
Clases auxiliares (3)
• Para saber si un punto está dentro de la elipse, no solo dentro del rectángulo que le contiene, primero se debe construir un objeto que representa una región irregular (CRgn).
• Para el ejemplo se podría crear una región elíptica basados en el rectángulo que la contiene.
Iván Bernal, Iván Bernal, Ph.DPh.D..httphttp://://wwwfie.epn.edu.ecwwwfie.epn.edu.ec//ibernalibernal
Dic. 02 Dic. 02 –– Abril 03Abril 03PHVPHV
Escuela Politécnica NacionalEscuela Politécnica NacionalQuito Quito -- EcuadorEcuador
1616
Clases auxiliares (4)Observación:Observación:
• La función InvalidateRect tiene como prototipo:
• LPRECT es un puntero a una estructura RECT.– Este puntero no es a un objeto CRect.– Sin embargo, se puede escribir código como:
• Lo anterior es posible porque CRect define el operador LPRECT() que retorna la dirección de un objeto CRect.– CRect está derivada de RECT.– El compilador convierte argumentos CRect a LPRECT cuando sea
necesario y se puede escribir el código anterior como si la función aceptase referencias.
Iván Bernal, Iván Bernal, Ph.DPh.D..httphttp://://wwwfie.epn.edu.ecwwwfie.epn.edu.ec//ibernalibernal
Dic. 02 Dic. 02 –– Abril 03Abril 03PHVPHV
Escuela Politécnica NacionalEscuela Politécnica NacionalQuito Quito -- EcuadorEcuador
1717
Código (1)
Iván Bernal, Iván Bernal, Ph.DPh.D..httphttp://://wwwfie.epn.edu.ecwwwfie.epn.edu.ec//ibernalibernal
Dic. 02 Dic. 02 –– Abril 03Abril 03PHVPHV
Escuela Politécnica NacionalEscuela Politécnica NacionalQuito Quito -- EcuadorEcuador
1818
Código (2)
Iván Bernal, Iván Bernal, Ph.DPh.D..httphttp://://wwwfie.epn.edu.ecwwwfie.epn.edu.ec//ibernalibernal
Dic. 02 Dic. 02 –– Abril 03Abril 03PHVPHV
Escuela Politécnica NacionalEscuela Politécnica NacionalQuito Quito -- EcuadorEcuador
1919
Código (3)
Iván Bernal, Iván Bernal, Ph.DPh.D..httphttp://://wwwfie.epn.edu.ecwwwfie.epn.edu.ec//ibernalibernal
Dic. 02 Dic. 02 –– Abril 03Abril 03PHVPHV
Escuela Politécnica NacionalEscuela Politécnica NacionalQuito Quito -- EcuadorEcuador
2020
Código (4)
Iván Bernal, Iván Bernal, Ph.DPh.D..httphttp://://wwwfie.epn.edu.ecwwwfie.epn.edu.ec//ibernalibernal
Dic. 02 Dic. 02 –– Abril 03Abril 03PHVPHV
Escuela Politécnica NacionalEscuela Politécnica NacionalQuito Quito -- EcuadorEcuador
2121
Código (5)
• Las líneas de comentario añadidas son para el uso del ClassWizard (AFX_MSG.., no retirarlas ).– Al añadir el handler de un mensaje, el ClassWizard añade código
entre estas líneas de comentario.• ClassWizard añade también un definición en el archivo “.h”
y un cuerpo en “.cpp” para OnLButtonDown.
Iván Bernal, Iván Bernal, Ph.DPh.D..httphttp://://wwwfie.epn.edu.ecwwwfie.epn.edu.ec//ibernalibernal
Dic. 02 Dic. 02 –– Abril 03Abril 03PHVPHV
Escuela Politécnica NacionalEscuela Politécnica NacionalQuito Quito -- EcuadorEcuador
2222
Código (6)
Iván Bernal, Iván Bernal, Ph.DPh.D..httphttp://://wwwfie.epn.edu.ecwwwfie.epn.edu.ec//ibernalibernal
Dic. 02 Dic. 02 –– Abril 03Abril 03PHVPHV
Escuela Politécnica NacionalEscuela Politécnica NacionalQuito Quito -- EcuadorEcuador
2323
Deber (1)
Iván Bernal, Iván Bernal, Ph.DPh.D..httphttp://://wwwfie.epn.edu.ecwwwfie.epn.edu.ec//ibernalibernal
Dic. 02 Dic. 02 –– Abril 03Abril 03PHVPHV
Escuela Politécnica NacionalEscuela Politécnica NacionalQuito Quito -- EcuadorEcuador
2424
Deber (2)• Generar un conjunto de 10 números aleatorios
diferentes entre 1 y 100.• Dibujar una cuadrícula de 4x5 e incluir los números
como se indica en la figura.• La cuadrícula siempre debe cubrir toda la pantalla.• Los números estarán aproximadamente en el centro de
un rectángulo de menor tamaño que la cuadrícula. Su tamaño puede ser fijo, por ahora.
• Cuando se presione el botón DERECHO DERECHO del mouse se presentará un nuevo conjunto de valores.
• Solo usar lo que se ha aprendido en clase.– Para la lista de 10 números usar la clase vect<int>. – Revisar las funciones disponibles en la clase CDC.– Revisar las funciones disponibles en la clase CRect.
Iván Bernal, Iván Bernal, Ph.DPh.D..httphttp://://wwwfie.epn.edu.ecwwwfie.epn.edu.ec//ibernalibernal
Dic. 02 Dic. 02 –– Abril 03Abril 03PHVPHV
Escuela Politécnica NacionalEscuela Politécnica NacionalQuito Quito -- EcuadorEcuador
2525
Deber (3)
• Para el Viernes 3pm., antes de la clase.
– El programa debe compilar.– Enviar los archivos del
proyecto comprimidos.–– NO ENVIARNO ENVIAR el directorio
DEBUG.– El nombre del archivo .zip
debe ser el apellido de un de los miembros del grupo.
– Enviar solamente a [email protected]
– Si no se respeta lo indicado en cuanto al envío habrá una drástica sanción.
– No olvidar la documentación del programa.
• Todo proyecto debe incluir la ventana de diálogo de información del proyecto de acuerdo a lo que se indica a continuación.
• No olvidar que un número puede aparecer solo una vez.
Iván Bernal, Iván Bernal, Ph.DPh.D..httphttp://://wwwfie.epn.edu.ecwwwfie.epn.edu.ec//ibernalibernal
Dic. 02 Dic. 02 –– Abril 03Abril 03PHVPHV
Escuela Politécnica NacionalEscuela Politécnica NacionalQuito Quito -- EcuadorEcuador
2626
Actividades
• Revisar el depurador.• Incluir el código para regiones.• Macros TRACE:
– Tratar de depurar código en OnDraw (breakpoint).– En OnDraw.
• Prueba sorpresa.
Iván Bernal, Iván Bernal, Ph.DPh.D..httphttp://://wwwfie.epn.edu.ecwwwfie.epn.edu.ec//ibernalibernal
Dic. 02 Dic. 02 –– Abril 03Abril 03PHVPHV
Escuela Politécnica NacionalEscuela Politécnica NacionalQuito Quito -- EcuadorEcuador
2727
Ventana Diálogo (1)• La ventana de diálogo
para todos los deberes y proyectos debe presentar:
– La fotografía de cada miembro del grupo.
• Rostro claramente identificable.
• Nombre.• Identificación del
deber.• Fecha de entrega.
– La distribución geométrica de las fotografías y texto queda a criterio de cada grupo.
Iván Bernal, Iván Bernal, Ph.DPh.D..httphttp://://wwwfie.epn.edu.ecwwwfie.epn.edu.ec//ibernalibernal
Dic. 02 Dic. 02 –– Abril 03Abril 03PHVPHV
Escuela Politécnica NacionalEscuela Politécnica NacionalQuito Quito -- EcuadorEcuador
2828
Ventana Diálogo (2)
• Abrir una fotografía en el programa PAINT.
• Redimensionar a un tamaño adecuado con “Expandir y Contraer”– Guardar relación original
de aspecto.
• Salvar imagen como “.bmp” de al menos 256 colores.
Iván Bernal, Iván Bernal, Ph.DPh.D..httphttp://://wwwfie.epn.edu.ecwwwfie.epn.edu.ec//ibernalibernal
Dic. 02 Dic. 02 –– Abril 03Abril 03PHVPHV
Escuela Politécnica NacionalEscuela Politécnica NacionalQuito Quito -- EcuadorEcuador
2929
Ventana Diálogo (3)• Abrir el editor de recursos• Seleccionar con el mouse el
nombre del proyecto.• Click con el botón derecho del
mouse.• Seleccionar “importar”.• Seleccionar el “.bmp”
Iván Bernal, Iván Bernal, Ph.DPh.D..httphttp://://wwwfie.epn.edu.ecwwwfie.epn.edu.ec//ibernalibernal
Dic. 02 Dic. 02 –– Abril 03Abril 03PHVPHV
Escuela Politécnica NacionalEscuela Politécnica NacionalQuito Quito -- EcuadorEcuador
3030
Ventana Diálogo (4)
• Se obtiene un mensaje que la imagen no podrá ser editada por el número de colores utilizado.
• Se importó el archivo “.bmp”.– Se guarda una copia
local al proyecto.– Se asigna un nombre a la
imagen importada.
Iván Bernal, Iván Bernal, Ph.DPh.D..httphttp://://wwwfie.epn.edu.ecwwwfie.epn.edu.ec//ibernalibernal
Dic. 02 Dic. 02 –– Abril 03Abril 03PHVPHV
Escuela Politécnica NacionalEscuela Politécnica NacionalQuito Quito -- EcuadorEcuador
3131
Ventana Diálogo (5)• Abrir la ventana de
diálogo en el editor de recursos.
• Cambiar el tamaño de la ventana para que acepte dos fotografías.
• Hacer visible la barra de controles.
– En la región de barras de herramientas hacer click con el boton derecho.
– Seleccionar “Controls” para hacer la barra de controles.
Iván Bernal, Iván Bernal, Ph.DPh.D..httphttp://://wwwfie.epn.edu.ecwwwfie.epn.edu.ec//ibernalibernal
Dic. 02 Dic. 02 –– Abril 03Abril 03PHVPHV
Escuela Politécnica NacionalEscuela Politécnica NacionalQuito Quito -- EcuadorEcuador
3232
Ventana Diálogo (6)
• Seleccionar con un click el control para imágenes (Picture).
• Con el mouse definir sobre la ventana de diálogo el tamaño de la imagen.
Iván Bernal, Iván Bernal, Ph.DPh.D..httphttp://://wwwfie.epn.edu.ecwwwfie.epn.edu.ec//ibernalibernal
Dic. 02 Dic. 02 –– Abril 03Abril 03PHVPHV
Escuela Politécnica NacionalEscuela Politécnica NacionalQuito Quito -- EcuadorEcuador
3333
Ventana Diálogo (7)
• Con el control seleccionado hacer click con el botón derecho del mouse.
• Seleccionar la opción Properties.
Iván Bernal, Iván Bernal, Ph.DPh.D..httphttp://://wwwfie.epn.edu.ecwwwfie.epn.edu.ec//ibernalibernal
Dic. 02 Dic. 02 –– Abril 03Abril 03PHVPHV
Escuela Politécnica NacionalEscuela Politécnica NacionalQuito Quito -- EcuadorEcuador
3434
Ventana Diálogo (8)• ID corresponde al
identificador del control seleccionado.
• En “type” escoger la opción “bitmap”.
• En “Image” escoger el identificador del bitmap que se importó.
• Presionar “enter”• Se visualiza la imagen.• Repetir el proceso para la
otra fotografía.• No se puede cambiar el
tamaño de la imagen en el editor.
– Modificar tamaño en PAINT.