Instituto Tecnológico Superior De San Andrés

Tuxtla

Ingeniería en Sistemas Computacionales

Asignatura: Tópicos Avanzados de Programación
Docente: MTI. Angelina Márquez Jiménez

Trabajo: Reporte de Investigación

Unidad 1: Interfaz Gráfica de Usuario

Equipo #4
Integrantes:
Baxin Marcial José Javier
Chigo Toga Rodrigo de Jesús
Gorgonio Cobaxin Jorge Uriel
Hernández Muñiz Ulises de Jesús

Grupo: 404-A
Periodo: Enero – Junio 2019
 ÍNDICE

INTRODUCCIÓN .................................................................................................. 03

GUI ........................................................................................................................ 04

EVENTOS ............................................................................................................. 04

TIPOS DE EVENTOS ........................................................................................ 11

LIBRERIAS ........................................................................................................ 11

MANEJO DE EVENTOS .................................................................................... 11

LISTENERS & ADAPTERS .................................................................................. 10

CONCLUSIÓN ...................................................................................................... 14

PROPUESTA DEL PROYECTO ........................................................................... 14

REFERENCIAS ..................................................................................................... 16
 INTRODUCCIÓN
A continuación se abarcará el concepto y como se constituye una Interfaz Gráfica
de Usuario, dando análisis por ejemplo a los elementos que los componen y las
características que estos tienen, dando pie a conceptos que van de la mano y
también son igual de relevantes para adentrarse a este tema, como lo son los
eventos, informando desde luego lo que son, y los tipos que hay de este, que
directamente lleva al manejo de estos mediante ciertas librerías, con el propósito de
ir abarcando el tema hasta llevarlo a la práctica.
 GUI
Una interfaz gráfica de usuario (GUI) presenta un mecanismo amigable al usuario
para interactuar con una aplicación. Una GUI proporciona a una aplicación una
“apariencia visual” única. Al proporcionar distintas aplicaciones en las que los
componentes de la interfaz de usuario sean consistentes e intuitivos, los usuarios
pueden familiarizarse en cierto modo con una aplicación, de manera que pueden
aprender a utilizarla en menor tiempo y con mayor productividad.
Las GUIs se crean a partir de componentes de la GUI. A éstos se les conoce
también como controles o widgets (accesorios de ventana) en otros lenguajes. Un
componente de la GUI es un objeto con el cual interactúa el usuario mediante el
ratón, el teclado u otra forma de entrada, como el reconocimiento de voz. [1]
Algunos componentes básicos de GUI [1] son:

Componente Descripción
JLabel Muestra texto que no puede editarse, o iconos.
Permite al usuario introducir datos mediante el teclado.
JTextField También se puede utilizar para mostrar texto que puede o
no editarse.
JButton Activa un evento cuando se oprime mediante el ratón.
Especifica una opción que puede seleccionarse o no
JCheckBox
seleccionarse.
Proporciona una lista desplegable de elementos, a partir de
los cuales el usuario puede realizar una selección, haciendo
JComboBox
clic en un elemento o posiblemente escribiendo en el
cuadro.
Proporciona una lista de elementos a partir de los cuales el
usuario puede realizar una selección, haciendo clic en
JList
cualquier elemento en la lista. Pueden seleccionarse varios
elementos.
Proporciona un área en la que pueden colocarse y
JPanel organizarse los componentes. También puede utilizarse
como un área de dibujo para gráficos.
 EVENTO
Un evento es la notificación que hace un elemento gráfico cuando el usuario
interactúa con él. Por lo tanto, si se realiza alguna acción sobre algún elemento de
la interfaz, se dice que se ha generado un evento en dicho elemento. [2]

TIPOS DE EVENTOS
 Eventos de bajo nivel. Representan entradas o interacciones de bajo nivel con
elementos del interfaz gráfico.
 Eventos de alto nivel. Encapsulan la semántica del modelo de componentes
del interfaz de usuario [2]
EVENTOS DE BAJO NIVEL
Evento Descripción
Indica que un componente se movió, cambió de tamaño o cambió
ComponentEvent
de visibilidad.
Indica que el contenido de un contenedor cambió debido a que un
ContainerEvent
componente se agregó o eliminó.
Indica que un componente ha ganado o perdido el enfoque de
FocusEvent
entrada.
KeyEvent Indica que se produjo una pulsación de tecla en un componente.
MouseEvent Indica que se produjo una acción del mouse en un componente.
WindowEvent Indica que una ventana ha cambiado su estado.

EVENTOS DE ALTO NIVEL

Evento Descripción
ActionEvent Indica que se produjo una acción definida por el componente.

Se utiliza para notificar a las partes interesadas que el estado ha

ChangeEvent
cambiado en el origen del evento

ItemEvent Indica que un elemento fue seleccionado o deseleccionado

Se utiliza para notificar a las partes interesadas que el texto caret
CaretEvent
ha cambiado en el origen del evento.
ListSelectionEvent Un evento que caracteriza un cambio en la selección.
TextEvent Indica que el texto de un objeto ha cambiado.
 Evento ¿Qué lo genera? [3]

Generado por un componente (como a Button) cuando ocurre la

ActionEvent
acción específica del componente (como ser presionado)

Generado por un cambio en la posición del cursor de inserción

CaretEvent
en un componente que gestiona texto
ChangeEvent Generado por un cambio en el estado del componente

Generado por un objeto componente (como una Lista) cuando el

ComponentEvent componente se mueve, cambia de tamaño, se vuelve invisible o
se vuelve visible nuevamente.

Generado por un objeto contenedor (como un Panel) cuando se

ContainerEvent
le agrega o elimina un componente.
FocusEvent Generado por un componente (como un campo de texto).
Generado por un objeto ItemSelectable (como una lista) cuando
ItemEvent
un elemento es seleccionado o deseleccionado por el usuario.

Generado por un objeto componente (como un campo de texto)

KeyEvent
cuando se presiona, suelta o escribe una tecla.
ListSelectionEvent Generado por un cambio en la selección actual de una lista

Generado por un objeto componente para:

Eventos del ratón
 se presiona un botón del ratón
 se suelta un botón del ratón
 se presiona un botón del mouse (presiona y suelta)
 El cursor del mouse entra en la parte despejada de la
MouseEvent
geometría del componente.
 El cursor del mouse sale de la parte despejada de la
geometría del componente.
Eventos de movimiento del ratón
 el mouse se mueve
 el mouse es arrastrado

Generado por un objeto (como un componente de texto) cuando

TextEvent
cambia su texto.

Generado por un objeto de la Ventana cuando se abre, cierra,

WindowEvent activa, desactiva, iconifica o desiconifica, o cuando el enfoque se
transfiere dentro o fuera de la Ventana.
LIBRERIAS
AWT
(Abstract Window Toolkit) es un paquete en el que se encuentran clases capaces
de crear componentes de la IGU (GUI); es decir, clases capaces de crear objetos
visuales sobre los cuales pueden los usuarios actuar, mediante el empleo del ratón
o el teclado, para comunicarse con el programa, sustituyendo, por tanto, dichos
objetos las entrada/salida clásicas. Los componentes de la IGU (botones, campos
de texto, etc.) se organizan en contenedores y esperan hasta que el usuario ejecute
alguna acción sobre ellos, es decir, esperan un evento (suceso). Por eso se dice
que la programación IGU es una programación dirigida por eventos. Para el diseño
de este tipo de programas es necesario considerar, como se acaba de indicar, que
las interfaces gráficas están construidas por elementos gráficos denominados
componentes agrupados dentro de otros que se denominan contenedores, pero
además hay que tener en cuenta que los contenedores son a su vez componentes
y pueden volver a ser agrupados en otros contenedores. [4]
Swing
El paquete swing extiende el awt, añade nuevos componentes e incorpora dos
administradores de diseño más. La superclase de los componentes swing es la
clase JComponent, que deriva de la clase estándar Container y, por tanto,
desciende también de la clase Component del awt, de esta jerarquía se deduce que
todos los componentes swing son contenedores. Entre las novedades aportadas
por javax.swing destacan las ventanas con pestañas, el hecho de poder añadir
bordes así como asociar un texto de ayuda a cualquier componente. Además, los
componentes swing se ejecutan uniformemente en cualquier plataforma. Hay que
tener en cuenta que, en muchas ocasiones, los nombres de los componentes en
ambos paquetes casi coinciden, diferenciándose únicamente en que los de swing
anteponen una J, y la forma de trabajo también, facilitándose así el paso de awt a
swing. [4]

MANEJO DE EVENTOS
En Java se definen clases auxiliares (event listeners) que pueden recibir eventos de
tipos específicos. Estas clases se asocian luego a componentes específicos.
En términos de objetos y métodos, el manejo de eventos en Java funciona de la
siguiente forma:
Los manejadores de eventos (event listeners) se registran en las distintas fuentes
de eventos (event source).
Una fuente de eventos (ratón, botón, ventana…) envía objetos de tipo EventObject
a todos los manejadores registrados cuando se produce un nuevo evento.
Cada manejador de eventos utiliza la información recibida a través del objeto tipo
EventObject para realizar las acciones que estime adecuadas. [1]

LISTENERS & ADAPTERS

Un listener es un objeto que es notificado cuando ocurre un evento. Tiene dos
requisitos principales. Primero, tiene que ser registrado con una o más fuentes para
recibir notificaciones sobre eventos de tipos específicos. Segundo, tiene que
implementar métodos para recibir y procesar esas notificaciones. [1]

AWT Event Listeners [5]

Métodos de interfaz

ActionListener
Esta interfaz se utiliza para void actionPerformed (ActionEvent e)
recibir los eventos de Se invoca cuando se produce una acción.
acción.

void componentHidden (ComponentEvent e)

Se invoca cuando el componente se ha hecho invisible.

ComponentListener void componentMoved (ComponentEvent e)

Esta interfaz se utiliza para Se invoca cuando cambia la posición del componente.
recibir los eventos void componentResized (ComponentEvent e)
componentes. Se invoca cuando cambia el tamaño del componente.

void componentShown (ComponentEvent e)

Se invoca cuando el componente se ha hecho visible.

ItemListener
void itemStateChanged (ItemEvent e)
Esta interfaz se utiliza para
Se invoca cuando el usuario ha seleccionado o
recibir los eventos del
deseleccionado un elemento.
elemento.

void keyPressed (KeyEvent e)

KeyListener Se invoca cuando se ha pulsado una tecla.
Esta interfaz se utiliza para void keyReleased (KeyEvent e)
recibir los eventos clave. Se invoca cuando se ha liberado una tecla.

void keyTyped (KeyEvent e)

 Se invoca cuando se ha escrito una tecla.

void mouseClicked (MouseEvent e)

Se invoca cuando se hace clic (presionar y soltar) el
botón del mouse en un componente.

void mouseEntered (MouseEvent e)

Se invoca cuando el ratón entra en un componente.
MouseListener
void mouseExited (MouseEvent e)
Esta interfaz se utiliza para
Se invoca cuando el ratón sale de un componente.
recibir los eventos del
ratón. void mousePressed (MouseEvent e)
Se invoca cuando se presiona un botón del mouse en un
componente.

void mouseReleased (MouseEvent e)

Se invoca cuando se ha soltado un botón del ratón en un
componente.

TextListener
void textValueChanged (TextEvent e)
Esta interfaz se utiliza para
Se invoca cuando el valor del texto ha cambiado.
recibir los eventos de texto.

void windowActivated (WindowEvent e)

Se invoca cuando la ventana está configurada para ser la
ventana activa.

void windowClosed (WindowEvent e)

WindowListener
Esta interfaz se utiliza para
recibir los eventos de la
ventana.
Se invoca cuando una ventana se ha cerrado como
resultado de llamar a disponer en la ventana.
void windowClosing (WindowEvent e)
Se invoca cuando el usuario intenta cerrar la ventana
desde el menú del sistema de la ventana.

void windowDeactivated (WindowEvent e)

Se invoca cuando una ventana ya no es la ventana activa.

void windowDeiconified (WindowEvent e)

Se invoca cuando se cambia una ventana de un estado
minimizado a uno normal.
 void windowIconified (WindowEvent e)
Se invoca cuando se cambia una ventana de un estado
normal a un estado minimizado.

void windowOpened (WindowEvent e)

Se invoca la primera vez que se hace visible una ventana.

AdjustmentListener
Esta interfaz se utiliza para void adjustmentValueChanged (AdjustmentEvent e)
recibir los eventos de Se invoca cuando el valor del ajustable ha cambiado.
ajuste.

void componentAdded (ContainerEvent e)

ContainerListener Se invoca cuando se ha agregado un componente al
Esta interfaz se utiliza para contenedor.
recibir los eventos de void componentRemoved (ContainerEvent e)
contenedor. Se invoca cuando un componente se ha eliminado del
contenedor.

void mouseDragged (MouseEvent e)

MouseMotionListener Se invoca cuando se presiona un botón del mouse en un
Esta interfaz se utiliza para componente y luego se arrastra.
recibir los eventos de void mouseMoved (MouseEvent e)
movimiento del mouse. Se invoca cuando el cursor del mouse se ha movido a un
componente pero no se ha presionado ningún botón.

void focusGained (FocusEvent e)

FocusListener Se invoca cuando un componente gana el foco del
Esta interfaz se utiliza para teclado.
recibir los eventos de void focusLost (FocusEvent e)
enfoque. Se invoca cuando un componente pierde el foco del
teclado.
El AWT proporciona un conjunto de clases abstractas adaptadores (adapter) que
coindicen con las interfaces. Cada clase adaptador implementa una interfaz y
redefine todos los métodos declarados por la interfaz con métodos vacíos, con lo
cual se satisface el requerimiento de la redefinición de todos los métodos.

AWT Event Adapters [5]

Métodos de interfaz

void focusGained (FocusEvent e)

FocusAdapter
Se invoca cuando un componente gana el foco del teclado.
Una clase de adaptador
abstracto para recibir focusLost (FocusEvent e)
eventos de enfoque. Se invoca cuando un componente pierde el foco del
teclado.

void keyPressed (KeyEvent e)

KeyAdapter Se invoca cuando se ha pulsado una tecla.
Una clase de adaptador void keyReleased (KeyEvent e)
abstracta para recibir Se invoca cuando se ha liberado una tecla.
eventos clave.
void keyTyped (KeyEvent e)
Se invoca cuando se ha escrito una tecla.

void mouseClicked (MouseEvent e)

Se invoca cuando se hace clic (presionar y soltar) el botón
del mouse en un componente.

void mouseDragged (MouseEvent e)

MouseAdapter Se invoca cuando se presiona un botón del mouse en un
Una clase de adaptador componente y luego se arrastra.
abstracta para recibir
eventos del mouse. void mouseEntered (MouseEvent e)
Se invoca cuando el ratón entra en un componente.

void mouseExited (MouseEvent e)

Se invoca cuando el ratón sale de un componente.

void mouseMoved (MouseEvent e)

 Se invoca cuando el cursor del mouse se ha movido a un
componente pero no se ha presionado ningún botón.

void mousePressed (MouseEvent e)

Se invoca cuando se presiona un botón del mouse en un
componente.

void mouseReleased (MouseEvent e)

Se invoca cuando se ha soltado un botón del ratón en un
componente.

void mouseWheelMoved (MouseWheelEvent e)

Se invoca cuando se gira la rueda del ratón.

void mouseDragged (MouseEvent e)

MouseMotionAdapter
Se invoca cuando se presiona un botón del mouse en un
Una clase de adaptador
componente y luego se arrastra.
abstracta para recibir
eventos de movimiento del void mouseMoved (MouseEvent e)
mouse. Se invoca cuando el cursor del mouse se ha movido a un
componente pero no se ha presionado ningún botón.

void windowActivated (WindowEvent e)

Se invoca cuando se activa una ventana.

void windowClosed (WindowEvent e)

Se invoca cuando se ha cerrado una ventana.
WindowAdapter
void windowClosing (WindowEvent e)
Una clase de adaptador
Se invoca cuando una ventana está en proceso de cierre.
abstracta para recibir
eventos de ventana. void windowDeactivated (WindowEvent e)
Se invoca cuando se desactiva una ventana.

void windowDeiconified (WindowEvent e)

Se invoca cuando una ventana se des-iconifica.

void windowGainedFocus (WindowEvent e)

Se invoca cuando la Ventana está configurada para ser la
Ventana enfocada, lo que significa que la Ventana, o uno
de sus subcomponentes, recibirán eventos de teclado.

void windowIconified (WindowEvent e)

Se invoca cuando se iconifica una ventana.

void windowLostFocus (WindowEvent e)

Se invoca cuando la ventana ya no es la ventana enfocada,
lo que significa que los eventos del teclado ya no se
enviarán a la ventana ni a ninguno de sus
subcomponentes.

void windowOpened (WindowEvent e)

Se invoca cuando se ha abierto una ventana.

void windowStateChanged (WindowEvent e)

Se invoca cuando se cambia un estado de ventana.
 CONCLUSIÓN
En la vida cotidiana hemos estado siempre en interacción con la interfaz de algún
programa o de algún aparato tecnológico. Lo que se ve, lo que nos llama la atención,
con lo que podemos interactuar, lo primero que vemos. En esta investigación nos
enfocamos en la interfaz gráfica dentro de la programación, que aunque al principio
de un programa solo vemos código y letras, con las librerías SWING y AWT es
posible que cualquier persona pueda interactuar con el programa que creamos de
manera gráfica. Hay distintas funciones de acuerdo a los dispositivos que la
computadora tiene; como el teclado, el mouse; y la entrada de datos, realizando las
acciones por medio del manejo de los eventos ocurridos en la interacción con estos.
El usuario manipula directamente estos objetos visuales en el monitor cuando los
señala, seleccionándolos y arrastrándolos o moviéndolos por medio del cursor y es
sencillo realizar tal acción porque ya están programadas, pero es interesante como
detrás de todo ello se encuentran todos los componentes investigados que
conforman la GUI.

PROPUESTA DEL PROYECTO

Planteamiento
Farmacia Veterinaria el puente: Es una veterinaria dedicada al cuidado, compra y
venta de ganado y animales, como perros o gatos. Está ubicada cerca del centro de
la ciudad de San Andrés Tuxtla, en la calle Av. Benito Juárez 48, Centro, 95700.
Tiene buena ubicación y atrae a muchos clientes, sin embargo se necesita de un
software sólo para el negocio y administrar mejor los gastos e ingresos de la
empresa.
Problema
El problema encontrado en este negocio es que no hay una adecuada
administración de los productos, ingresos y gastos de la empresa por lo que a largo
plazo esto podría ser perjudicial para la empresa económicamente además de que
ante el gobierno se debe llevar una adecuada administración para rendir cuentas al
SAT. Otro punto es que con esto se podría analizar el rendimiento de la empresa y
saber con exactitud la rentabilidad del negocio y las pérdidas que se tienen. Por
último, también hay que pensar en que los medicamentos, inyecciones y demás
pueden caducar y si no se administran se convierten en pérdidas.
Motivaciones/Necesidades
Las principales motivaciones tanto para la empresa como para nosotros, son el
adecuado uso de los recursos económicos, así como la administración de los datos
con respecto al inventario de los productos que se manejan en esta empresa, lo
cual en conjunto lleva a un mejor funcionamiento de la empresa y a mayor
rentabilidad de la empresa.

Funcionalidad
Se desarrollará e instalará una GUI para que se use en la empresa ya antes
mencionada con el fin de solucionar los problemas detectados. Al desarrollar la GUI
tendrá que realizar las siguientes funciones:
-Ventas (registro de ventas, devoluciones de ventas)
-Inventario (Ingresos de mercancía por compras o devoluciones de compras, altas,
bajas, consultas de productos)
-Gastos
-Reportes de compras, ventas y resultados.

Alcance del programa/Objetivo

Se pretende entregar la funcionalidad y todos los apartados que conformarán parte
del programa, esencialmente los principales como los ingresos, gastos e inventarios
que ayudarán a administrar los principales productos.

Tipo de Proyecto
Real
REFERENCIAS BIBLIOGRÁFICAS
[1] Deitel, Paul J. Y Harvey M. Deitel
CÓMO PROGRAMAR EN JAVA. 7ª Edición
México 2008
PEARSON EDUCACIÓN

[2] Lic. Sosa Aguilar Omar

Manual Tópicos Avanzados de Programación
México 2013

[3] Class AWTEvent

https://docs.oracle.com/javase/7/docs/api/java/awt/AWTEvent.html
Java™ Platform, Standard Ed. 7

[4] Luis Joyanes Aguilar, Matilde Fernandez Azuela

JAVA 2 Manual de Programación
2001
McGraw-Hill Companies

[5] Javier González Sánchez

JAVA Manual de referencia. 7ª Edición
México 2007
McGRAW-HILL INTERAMERICANA EDITORES, S.A. DE C.V.