SlideShare une entreprise Scribd logo
1  sur  33
Interfaz gráfica de
usuario y eventos
Tópicos avanzados de programación

M.C. Edgar Omar Bañuelos Lozoya
Instituto Tecnológico de Parral
INTRODUCCIÓN

2
¿GUI?
• Graphical user interface
> Interfaz gráfica de usuario

…programa o entorno que gestiona la interacción con
el usuario con base en relaciones visuales como
iconos, menús o un puntero»

3
4
5
En nuestro caso...

6
Swing & AWT
• ¿Qué son?
– Conjuntos de librerías que agrupan componentes
para desarrollar interfaces gráficas

7
AWT (Abstract Window
ToolKit)
• Fue el primero en Java (y viene en todas sus
versiones)
• Sus componentes se denominan «pesados»
– … dependen de código nativo del sistema
operativo para realizar su funcionalidad

• Su paquete es java.awt

8
Swing
• Implementado «enteramente» en Java
– … no tiene código nativo del sistema operativo

• Sus componentes se denominan «ligeros»
• Los nombres de algunas clases de Swing
inician con la letra «J» para no confundirlas
con las equivalentes en AWT (por ejemplo
JButton y Button)
• Su paquete es javax.swing
9
• Junto con Java 2D (clases para manipular
imágenes y gráficos planos), AWT y Swing
conforman el JFC (Java Foundation Classes)
– … framework para construir interfaces gráficas de
usuario basadas en Java

10
Diagrama jerárquico de clases
para programación GUI en Java

11
Diagrama jerárquico de clases para
programación GUI en Java (cont.)

12
Clasificación GUI
• Se dividen en tres:
1. Contenedores
2. Auxiliares
3. Componentes

13
Clases contenedor
• Son componentes GUI usados para
«contener» otros componentes
• Son contenedores AWT:
– Window, Panel, Applet, Frame y Dialog

• Son contenedores Swing:
– Container, JFrame, JDialog, JApplet, y JPanel

14
Contenedores Swing
• Container
– Usado para agrupar componentes.
– Frames, panels y applets son ejemplos de contenedores

• JFrame
– Es una ventana no contenida dentro de otra ventana.
– Es el componente base para construir las interfaces basadas en Swing

• JDialog
– Es una ventana emergente o de mensaje, usada de manera temporal para
recibir información del usuario o dar alguna notificación

• JApplet
– Es subclase de Applet. Utilizada para crear applets basados en Swing

• JPanel
– Es un contenedor invisible para agrupar componentes de interfaz de usuario.
– Los paneles pueden ser anidados (“uno dentro de otro”)
– Pueden ser utlizados como “lienzo” para dibujar gráficos

15
Actividad
• Utilizando el entorno gráfico de Netbeans:
– Crear un JFrame
– Agregar botones para invocar cada uno de los
tipos de diálogo de la clase JOptionPane

16
Clases auxiliares
• No son subclases de Component
• Son usadas para describir propiedades de
componentes GUI, están en el paquete
java.awt
Nota. Los componentes Swing no reemplazan
todas las clases AWT, sólo las clases de
componentes
GUI
de
AWT
(como
Button, TextField, TextArea,…)
17
Clases auxiliares (cont.)
• Graphics
– Clase abstracta que proporciona un contexto gráfico para dibujar líneas y
figuras simples

• Color
– Trata los colores de los componentes GUI. Útil para especificar fondos, color
de letras o de líneas, figuras, etc.

• Font
– Especifica tipo, estilo y tamaño de letras mostradas en componentes GUI

• FontMetrics
– Clase abstracta utilizada para obtener propiedades de los tipos de letra

• Dimension
– Encapsula el largo y ancho de un componente (en precisión entera)

• LayoutManager
– Es una interface que especifica como son alineados los componentes dentro
de un contenedor

18
Clases componente GUI
• JComponent es la superclase de todos los
componentes Swing
• Como JComponent es una clase abstracta no
es posible usar new JComponent(), es
necesario usar los constructores de las
subclases

19
Clases componente GUI (cont.)
• ¿Cuál sería el resultado de ejecutar el
siguiente fragmento de código?
JButton jbtOK = new JButton("OK");
System.out.println(jbtOK instanceof
System.out.println(jbtOK instanceof
System.out.println(jbtOK instanceof
System.out.println(jbtOK instanceof
System.out.println(jbtOK instanceof
System.out.println(jbtOK instanceof

JButton);
AbstractButton);
JComponent);
Container);
Component);
Object);

True, para todos los casos
20
COMPONENTES GUI

21
Frames

22
Frames (cont.)

import javax.swing.*;
public class MyFrame {
public static void main(String[] args) {
JFrame frame = new JFrame("MyFrame");
frame.setSize(400, 300);
frame.setLocationRelativeTo(null);
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
frame.setVisible(true);
}
}

• El frame no es desplegado hasta que frame.setVisible(true);
es invocado
• frame.setSize(400, 300); especifica el tamaño (400px
ancho, 300px alto), si no es usado el formulario se ajusta sólo hasta
desplegar la barra de título
• setVisible() y setSize() están definidos en la clase Component
y son heredados a JFrame, por lo que estos métodos son utilizados
23
también por otras subclases
Frames (cont.)

• Invocando frame.setLocationRelativeTo(null)el
frame es centrado en la pantalla
• frame.setDefaultCloseOperation(JFrame.EXIT
_ON_CLOSE)le dice al programa que termine cuando se
cierra el formulario, si está opción no se especifica el
programa seguirá en ejecución aún y cuando el formulario se
haya cerrado

24
Frames (cont.)
• Propiedades comunes de un JFrame:
– contentPane
• Panel de contenido del frame

– iconImage
• Imagen que representa el frame, reemplaza la imagen por default de Java
en la barra de título y cuando el frame es minimizado
Image image = (new ImageIcon(Filename)).getImage();
frame.setIconImage(image);

– JMenuBar
• Barra de menú opcional

– resizable
• Valor booleano que indica si el frame puede cambiar de tamaño
frame.setResizable(Value);

– title
• Especifica el título del formulario
frame.setTitle(Title);
25
Frames (cont.)
• Para añadir componentes a un frame utilizar el método
add():
// Añadir un botón al frame
JButton jbtOK = new JButton("OK");
frame.add(jbtOK);

• Este método añade el componente al panel de contenido
del frame.
– El botón sería colocado al centro y ocupando todo el
frame, esto debido al layout manager que el frame tiene por
default

• Puede usarse la siguiente instrucción para remover el
botón:
frame.remove(jbtOK);
26
Actividad
1. Crear en bloc de notas una clase Java de
nombre PruebaFrames
2. En el método principal crear un objeto
formulario con titulo «Mi primer frame en
TAP»
3. Especificar el tamaño a 500px de alto por
400px de ancho
4. Guardar y ejecutar en línea de comandos
¿qué es lo que sucede?
27
Actividad (cont.)
5. Ubicarlo en las coordenadas (0, 0) de la pantalla
6. Hacer visible el frame
7. Guardar y ejecutar
¿qué pasa si cierran el formulario?

8. Comentar la línea de ubicación anterior y agregar lo
necesario para centrar el frame en la pantalla
9. Configurar que la aplicación termine al cerrar el
formulario
10. Guardar y ejecutar
28
Actividad (cont.)
11. Configurar una imagen para mostrar en la
barra de título
12.Establecer que el frame no pueda cambiar de
tamaño
13. Cambiar el título del frame a «Mi primer
frame modificado»
14.Guardar y ejecutar

29
EVENTOS

30
Programación dirigida por eventos
• Imaginen un programa para imprimir los
primeros 100 números de la serie de Fibonacci o
un programa para recibir dos números y escribir
el resultado de su suma
¿quién controla que se ejecutará primero y que
después?
• Ahora imaginen Microsoft Word con un nuevo
documento abierto
¿quién controla la secuencia de ejecución?
31
Programación dirigida por eventos (cont.)
• En este paradigma la estructura como la ejecución de
los programas van determinados por los sucesos que
ocurran en el sistema, generalmente provocados por
el usuario»
• Es la base para el desarrollo de interfaces gráficas de
usuario
• Maneja el concepto de evento y administrador de
eventos:
– Un evento es la señal que indica que sucedió una acción
predeterminada
– Un administrador de eventos es la parte de la aplicación
que se encarga de ejecutar ciertas tareas cuando se ha
detectado un evento en particular
32
Programación dirigida por eventos (cont.)

• Los eventos soportados estarán determinados
por
el
lenguaje
de
programación
utilizado, algunos son heredados por el propio
sistema operativo e incluso otros pueden ser
creados por el mismo programador
• En este tipo de aplicaciones generalmente hay
una fase de inicialización seguida de una fase de
espera a la detección de algún evento que
determine la secuencia de ejecución a seguir
33

Contenu connexe

Tendances

PROGRAMACION ORIENTADA A OBJETOS
PROGRAMACION ORIENTADA A OBJETOSPROGRAMACION ORIENTADA A OBJETOS
PROGRAMACION ORIENTADA A OBJETOS
Abraham Morales
 
Transiciones de Procesos
Transiciones de ProcesosTransiciones de Procesos
Transiciones de Procesos
sueich
 
Sql DML Lenguaje de manipulación de datos
Sql DML Lenguaje de manipulación de datos Sql DML Lenguaje de manipulación de datos
Sql DML Lenguaje de manipulación de datos
josecuartas
 
proyecto conexion netbeans con Mysql
proyecto conexion netbeans con Mysqlproyecto conexion netbeans con Mysql
proyecto conexion netbeans con Mysql
BrenditaLr
 

Tendances (20)

WHAT IS ABSTRACTION IN JAVA
WHAT IS ABSTRACTION IN JAVAWHAT IS ABSTRACTION IN JAVA
WHAT IS ABSTRACTION IN JAVA
 
Procesos Ligeros: Hilos o Hebras
Procesos Ligeros: Hilos o HebrasProcesos Ligeros: Hilos o Hebras
Procesos Ligeros: Hilos o Hebras
 
Array en java
Array en javaArray en java
Array en java
 
Cuadro comparativo AWT-SWING
Cuadro comparativo AWT-SWINGCuadro comparativo AWT-SWING
Cuadro comparativo AWT-SWING
 
Diapositivas sobre AWT
Diapositivas sobre AWTDiapositivas sobre AWT
Diapositivas sobre AWT
 
Normalizacion de bases de datos
Normalizacion de bases de datosNormalizacion de bases de datos
Normalizacion de bases de datos
 
Vectores y Objetos Programacion Orientada a Objetos
Vectores y Objetos Programacion Orientada a ObjetosVectores y Objetos Programacion Orientada a Objetos
Vectores y Objetos Programacion Orientada a Objetos
 
Arboles Binarios
Arboles BinariosArboles Binarios
Arboles Binarios
 
PROGRAMACION ORIENTADA A OBJETOS
PROGRAMACION ORIENTADA A OBJETOSPROGRAMACION ORIENTADA A OBJETOS
PROGRAMACION ORIENTADA A OBJETOS
 
Transacciones
TransaccionesTransacciones
Transacciones
 
Transiciones de Procesos
Transiciones de ProcesosTransiciones de Procesos
Transiciones de Procesos
 
Diagramas UML
Diagramas UMLDiagramas UML
Diagramas UML
 
Listas en prolog
Listas en prologListas en prolog
Listas en prolog
 
10.el diseño en el nivel de componentes
10.el diseño en el nivel de componentes10.el diseño en el nivel de componentes
10.el diseño en el nivel de componentes
 
Sql DML Lenguaje de manipulación de datos
Sql DML Lenguaje de manipulación de datos Sql DML Lenguaje de manipulación de datos
Sql DML Lenguaje de manipulación de datos
 
Otras relaciones y modelos bases de datos
Otras relaciones y modelos bases de datosOtras relaciones y modelos bases de datos
Otras relaciones y modelos bases de datos
 
Uml clase 04_uml_clases
Uml clase 04_uml_clasesUml clase 04_uml_clases
Uml clase 04_uml_clases
 
Arquitectura en capas
Arquitectura en capasArquitectura en capas
Arquitectura en capas
 
Java: GUI
Java: GUIJava: GUI
Java: GUI
 
proyecto conexion netbeans con Mysql
proyecto conexion netbeans con Mysqlproyecto conexion netbeans con Mysql
proyecto conexion netbeans con Mysql
 

En vedette

Componentes y Librerías - Tópicos avanzados de programación.
Componentes y Librerías - Tópicos avanzados de programación.Componentes y Librerías - Tópicos avanzados de programación.
Componentes y Librerías - Tópicos avanzados de programación.
Giancarlo Aguilar
 
Tópicos avanzados de programación eventos
Tópicos  avanzados  de programación   eventosTópicos  avanzados  de programación   eventos
Tópicos avanzados de programación eventos
Kanddy Mobylml
 
Java GUI La librería Swing
Java GUI La librería Swing Java GUI La librería Swing
Java GUI La librería Swing
Laura
 
Gui interfaz gráfica de usuario javax.swing y java.awt
Gui interfaz gráfica  de usuario javax.swing y java.awtGui interfaz gráfica  de usuario javax.swing y java.awt
Gui interfaz gráfica de usuario javax.swing y java.awt
carlosAhumada_12
 
CreacióN De Una Interfaz GráFica Del Usuario(Gui)
CreacióN De Una Interfaz GráFica Del Usuario(Gui)CreacióN De Una Interfaz GráFica Del Usuario(Gui)
CreacióN De Una Interfaz GráFica Del Usuario(Gui)
Arturo Salinas
 
Unidad 3 topicos avanzados de programacion
Unidad 3 topicos avanzados de programacionUnidad 3 topicos avanzados de programacion
Unidad 3 topicos avanzados de programacion
Irving Che
 
Tema 13 gráficas en java por gio
Tema 13   gráficas en java por gioTema 13   gráficas en java por gio
Tema 13 gráficas en java por gio
Robert Wolf
 
Un lenguaje de programación y una interfaz grafica
Un lenguaje de programación y una interfaz graficaUn lenguaje de programación y una interfaz grafica
Un lenguaje de programación y una interfaz grafica
Ing-D-SW-TorresKhano--ME
 
Tabla comparativa sistema de información
Tabla comparativa sistema de información Tabla comparativa sistema de información
Tabla comparativa sistema de información
vanebrambila
 

En vedette (20)

Unidad 2 tópicos avanzados de programacion
Unidad 2 tópicos avanzados de programacionUnidad 2 tópicos avanzados de programacion
Unidad 2 tópicos avanzados de programacion
 
Eventos en Java
Eventos en JavaEventos en Java
Eventos en Java
 
Componentes y Librerías - Tópicos avanzados de programación.
Componentes y Librerías - Tópicos avanzados de programación.Componentes y Librerías - Tópicos avanzados de programación.
Componentes y Librerías - Tópicos avanzados de programación.
 
Tópicos avanzados de programación eventos
Tópicos  avanzados  de programación   eventosTópicos  avanzados  de programación   eventos
Tópicos avanzados de programación eventos
 
Tópicos Avanzados de Programación - Unidad 1 GUI
Tópicos Avanzados de Programación - Unidad 1 GUITópicos Avanzados de Programación - Unidad 1 GUI
Tópicos Avanzados de Programación - Unidad 1 GUI
 
Topicos Avanzados de Programacion - Unidad 2 GUI Interfaz Grafica de Usuario
Topicos Avanzados de Programacion - Unidad 2 GUI Interfaz Grafica de UsuarioTopicos Avanzados de Programacion - Unidad 2 GUI Interfaz Grafica de Usuario
Topicos Avanzados de Programacion - Unidad 2 GUI Interfaz Grafica de Usuario
 
Diferencias swing y awt
Diferencias swing y awtDiferencias swing y awt
Diferencias swing y awt
 
Java GUI La librería Swing
Java GUI La librería Swing Java GUI La librería Swing
Java GUI La librería Swing
 
Empaquetado de aplicaciones Java con Netbeans
Empaquetado de aplicaciones Java con NetbeansEmpaquetado de aplicaciones Java con Netbeans
Empaquetado de aplicaciones Java con Netbeans
 
Gui interfaz gráfica de usuario javax.swing y java.awt
Gui interfaz gráfica  de usuario javax.swing y java.awtGui interfaz gráfica  de usuario javax.swing y java.awt
Gui interfaz gráfica de usuario javax.swing y java.awt
 
CreacióN De Una Interfaz GráFica Del Usuario(Gui)
CreacióN De Una Interfaz GráFica Del Usuario(Gui)CreacióN De Una Interfaz GráFica Del Usuario(Gui)
CreacióN De Una Interfaz GráFica Del Usuario(Gui)
 
Unidad 3 topicos avanzados de programacion
Unidad 3 topicos avanzados de programacionUnidad 3 topicos avanzados de programacion
Unidad 3 topicos avanzados de programacion
 
Manejo de eventos en java
Manejo de eventos en javaManejo de eventos en java
Manejo de eventos en java
 
Elemento tipicos de las interfaces graficas de usuario
Elemento tipicos de las interfaces graficas de usuario Elemento tipicos de las interfaces graficas de usuario
Elemento tipicos de las interfaces graficas de usuario
 
Tema 13 gráficas en java por gio
Tema 13   gráficas en java por gioTema 13   gráficas en java por gio
Tema 13 gráficas en java por gio
 
Diseno de Interfaces (2011)
Diseno de Interfaces (2011)Diseno de Interfaces (2011)
Diseno de Interfaces (2011)
 
Conceptos Basicos De ProgramacióN Dirigida A Eventos
Conceptos Basicos De ProgramacióN Dirigida A EventosConceptos Basicos De ProgramacióN Dirigida A Eventos
Conceptos Basicos De ProgramacióN Dirigida A Eventos
 
Un lenguaje de programación y una interfaz grafica
Un lenguaje de programación y una interfaz graficaUn lenguaje de programación y una interfaz grafica
Un lenguaje de programación y una interfaz grafica
 
GUI historia y evolucion (Hasta el 2008)
GUI historia y evolucion (Hasta el 2008)GUI historia y evolucion (Hasta el 2008)
GUI historia y evolucion (Hasta el 2008)
 
Tabla comparativa sistema de información
Tabla comparativa sistema de información Tabla comparativa sistema de información
Tabla comparativa sistema de información
 

Similaire à Interfaz gráfica de usuario y eventos (introducción)

Trabajo teórico exposcición
Trabajo teórico exposciciónTrabajo teórico exposcición
Trabajo teórico exposcición
Andy Bsc
 
Java ventajas y caracteristicas
Java ventajas y caracteristicasJava ventajas y caracteristicas
Java ventajas y caracteristicas
bat1820
 
Gu is awt_swing
Gu is awt_swingGu is awt_swing
Gu is awt_swing
LCA
 

Similaire à Interfaz gráfica de usuario y eventos (introducción) (20)

D0 gui
D0 guiD0 gui
D0 gui
 
Tema6resumido
Tema6resumidoTema6resumido
Tema6resumido
 
Jfc java
Jfc javaJfc java
Jfc java
 
Lps 15 gu-iconswing
Lps 15 gu-iconswingLps 15 gu-iconswing
Lps 15 gu-iconswing
 
JAVA Interfaz gráfica (GUI)
JAVA Interfaz gráfica (GUI)JAVA Interfaz gráfica (GUI)
JAVA Interfaz gráfica (GUI)
 
Trabajo teórico exposcición
Trabajo teórico exposciciónTrabajo teórico exposcición
Trabajo teórico exposcición
 
S5 p2
S5 p2S5 p2
S5 p2
 
S5-P2.pptx
S5-P2.pptxS5-P2.pptx
S5-P2.pptx
 
Java ventajas y caracteristicas
Java ventajas y caracteristicasJava ventajas y caracteristicas
Java ventajas y caracteristicas
 
Interfaces graficas(1)
Interfaces graficas(1)Interfaces graficas(1)
Interfaces graficas(1)
 
Java 120706083911-phpapp01
Java 120706083911-phpapp01Java 120706083911-phpapp01
Java 120706083911-phpapp01
 
7 y 8. interfaz grafica en java
7 y 8.  interfaz grafica en java7 y 8.  interfaz grafica en java
7 y 8. interfaz grafica en java
 
CLASE SWING
CLASE SWING CLASE SWING
CLASE SWING
 
Programacion.....swing
Programacion.....swingProgramacion.....swing
Programacion.....swing
 
Programacion_II_Interfaz_grafica_guia_I
Programacion_II_Interfaz_grafica_guia_IProgramacion_II_Interfaz_grafica_guia_I
Programacion_II_Interfaz_grafica_guia_I
 
Gu is awt_swing
Gu is awt_swingGu is awt_swing
Gu is awt_swing
 
Clase swing
Clase swingClase swing
Clase swing
 
Jyoc java-cap18 swing y java fx
Jyoc java-cap18 swing y java fxJyoc java-cap18 swing y java fx
Jyoc java-cap18 swing y java fx
 
matlab
matlabmatlab
matlab
 
Introduccion de-aplicaciones-visuales
Introduccion de-aplicaciones-visualesIntroduccion de-aplicaciones-visuales
Introduccion de-aplicaciones-visuales
 

Dernier

6°_GRADO_-_MAYO_06 para sexto grado de primaria
6°_GRADO_-_MAYO_06 para sexto grado de primaria6°_GRADO_-_MAYO_06 para sexto grado de primaria
6°_GRADO_-_MAYO_06 para sexto grado de primaria
Wilian24
 
2 REGLAMENTO RM 0912-2024 DE MODALIDADES DE GRADUACIÓN_.pptx
2 REGLAMENTO RM 0912-2024 DE MODALIDADES DE GRADUACIÓN_.pptx2 REGLAMENTO RM 0912-2024 DE MODALIDADES DE GRADUACIÓN_.pptx
2 REGLAMENTO RM 0912-2024 DE MODALIDADES DE GRADUACIÓN_.pptx
RigoTito
 
FORTI-MAYO 2024.pdf.CIENCIA,EDUCACION,CULTURA
FORTI-MAYO 2024.pdf.CIENCIA,EDUCACION,CULTURAFORTI-MAYO 2024.pdf.CIENCIA,EDUCACION,CULTURA
FORTI-MAYO 2024.pdf.CIENCIA,EDUCACION,CULTURA
El Fortí
 
Concepto y definición de tipos de Datos Abstractos en c++.pptx
Concepto y definición de tipos de Datos Abstractos en c++.pptxConcepto y definición de tipos de Datos Abstractos en c++.pptx
Concepto y definición de tipos de Datos Abstractos en c++.pptx
Fernando Solis
 
RESULTADOS DE LA EVALUACIÓN DIAGNÓSTICA 2024 - ACTUALIZADA.pptx
RESULTADOS DE LA EVALUACIÓN DIAGNÓSTICA 2024 - ACTUALIZADA.pptxRESULTADOS DE LA EVALUACIÓN DIAGNÓSTICA 2024 - ACTUALIZADA.pptx
RESULTADOS DE LA EVALUACIÓN DIAGNÓSTICA 2024 - ACTUALIZADA.pptx
pvtablets2023
 

Dernier (20)

Prueba libre de Geografía para obtención título Bachillerato - 2024
Prueba libre de Geografía para obtención título Bachillerato - 2024Prueba libre de Geografía para obtención título Bachillerato - 2024
Prueba libre de Geografía para obtención título Bachillerato - 2024
 
6°_GRADO_-_MAYO_06 para sexto grado de primaria
6°_GRADO_-_MAYO_06 para sexto grado de primaria6°_GRADO_-_MAYO_06 para sexto grado de primaria
6°_GRADO_-_MAYO_06 para sexto grado de primaria
 
Diapositivas de animales reptiles secundaria
Diapositivas de animales reptiles secundariaDiapositivas de animales reptiles secundaria
Diapositivas de animales reptiles secundaria
 
Infografía EE con pie del 2023 (3)-1.pdf
Infografía EE con pie del 2023 (3)-1.pdfInfografía EE con pie del 2023 (3)-1.pdf
Infografía EE con pie del 2023 (3)-1.pdf
 
Lecciones 05 Esc. Sabática. Fe contra todo pronóstico.
Lecciones 05 Esc. Sabática. Fe contra todo pronóstico.Lecciones 05 Esc. Sabática. Fe contra todo pronóstico.
Lecciones 05 Esc. Sabática. Fe contra todo pronóstico.
 
Tema 10. Dinámica y funciones de la Atmosfera 2024
Tema 10. Dinámica y funciones de la Atmosfera 2024Tema 10. Dinámica y funciones de la Atmosfera 2024
Tema 10. Dinámica y funciones de la Atmosfera 2024
 
2 REGLAMENTO RM 0912-2024 DE MODALIDADES DE GRADUACIÓN_.pptx
2 REGLAMENTO RM 0912-2024 DE MODALIDADES DE GRADUACIÓN_.pptx2 REGLAMENTO RM 0912-2024 DE MODALIDADES DE GRADUACIÓN_.pptx
2 REGLAMENTO RM 0912-2024 DE MODALIDADES DE GRADUACIÓN_.pptx
 
LA LITERATURA DEL BARROCO 2023-2024pptx.pptx
LA LITERATURA DEL BARROCO 2023-2024pptx.pptxLA LITERATURA DEL BARROCO 2023-2024pptx.pptx
LA LITERATURA DEL BARROCO 2023-2024pptx.pptx
 
La Sostenibilidad Corporativa. Administración Ambiental
La Sostenibilidad Corporativa. Administración AmbientalLa Sostenibilidad Corporativa. Administración Ambiental
La Sostenibilidad Corporativa. Administración Ambiental
 
FORTI-MAYO 2024.pdf.CIENCIA,EDUCACION,CULTURA
FORTI-MAYO 2024.pdf.CIENCIA,EDUCACION,CULTURAFORTI-MAYO 2024.pdf.CIENCIA,EDUCACION,CULTURA
FORTI-MAYO 2024.pdf.CIENCIA,EDUCACION,CULTURA
 
Concepto y definición de tipos de Datos Abstractos en c++.pptx
Concepto y definición de tipos de Datos Abstractos en c++.pptxConcepto y definición de tipos de Datos Abstractos en c++.pptx
Concepto y definición de tipos de Datos Abstractos en c++.pptx
 
Power Point: Fe contra todo pronóstico.pptx
Power Point: Fe contra todo pronóstico.pptxPower Point: Fe contra todo pronóstico.pptx
Power Point: Fe contra todo pronóstico.pptx
 
semana 4 9NO Estudios sociales.pptxnnnn
semana 4  9NO Estudios sociales.pptxnnnnsemana 4  9NO Estudios sociales.pptxnnnn
semana 4 9NO Estudios sociales.pptxnnnn
 
Revista Apuntes de Historia. Mayo 2024.pdf
Revista Apuntes de Historia. Mayo 2024.pdfRevista Apuntes de Historia. Mayo 2024.pdf
Revista Apuntes de Historia. Mayo 2024.pdf
 
Abril 2024 - Maestra Jardinera Ediba.pdf
Abril 2024 -  Maestra Jardinera Ediba.pdfAbril 2024 -  Maestra Jardinera Ediba.pdf
Abril 2024 - Maestra Jardinera Ediba.pdf
 
OCTAVO SEGUNDO PERIODO. EMPRENDIEMIENTO VS
OCTAVO SEGUNDO PERIODO. EMPRENDIEMIENTO VSOCTAVO SEGUNDO PERIODO. EMPRENDIEMIENTO VS
OCTAVO SEGUNDO PERIODO. EMPRENDIEMIENTO VS
 
RESULTADOS DE LA EVALUACIÓN DIAGNÓSTICA 2024 - ACTUALIZADA.pptx
RESULTADOS DE LA EVALUACIÓN DIAGNÓSTICA 2024 - ACTUALIZADA.pptxRESULTADOS DE LA EVALUACIÓN DIAGNÓSTICA 2024 - ACTUALIZADA.pptx
RESULTADOS DE LA EVALUACIÓN DIAGNÓSTICA 2024 - ACTUALIZADA.pptx
 
Análisis de los Factores Externos de la Organización.
Análisis de los Factores Externos de la Organización.Análisis de los Factores Externos de la Organización.
Análisis de los Factores Externos de la Organización.
 
BIOMETANO SÍ, PERO NO ASÍ. LA NUEVA BURBUJA ENERGÉTICA
BIOMETANO SÍ, PERO NO ASÍ. LA NUEVA BURBUJA ENERGÉTICABIOMETANO SÍ, PERO NO ASÍ. LA NUEVA BURBUJA ENERGÉTICA
BIOMETANO SÍ, PERO NO ASÍ. LA NUEVA BURBUJA ENERGÉTICA
 
Interpretación de cortes geológicos 2024
Interpretación de cortes geológicos 2024Interpretación de cortes geológicos 2024
Interpretación de cortes geológicos 2024
 

Interfaz gráfica de usuario y eventos (introducción)

  • 1. Interfaz gráfica de usuario y eventos Tópicos avanzados de programación M.C. Edgar Omar Bañuelos Lozoya Instituto Tecnológico de Parral
  • 3. ¿GUI? • Graphical user interface > Interfaz gráfica de usuario …programa o entorno que gestiona la interacción con el usuario con base en relaciones visuales como iconos, menús o un puntero» 3
  • 4. 4
  • 5. 5
  • 7. Swing & AWT • ¿Qué son? – Conjuntos de librerías que agrupan componentes para desarrollar interfaces gráficas 7
  • 8. AWT (Abstract Window ToolKit) • Fue el primero en Java (y viene en todas sus versiones) • Sus componentes se denominan «pesados» – … dependen de código nativo del sistema operativo para realizar su funcionalidad • Su paquete es java.awt 8
  • 9. Swing • Implementado «enteramente» en Java – … no tiene código nativo del sistema operativo • Sus componentes se denominan «ligeros» • Los nombres de algunas clases de Swing inician con la letra «J» para no confundirlas con las equivalentes en AWT (por ejemplo JButton y Button) • Su paquete es javax.swing 9
  • 10. • Junto con Java 2D (clases para manipular imágenes y gráficos planos), AWT y Swing conforman el JFC (Java Foundation Classes) – … framework para construir interfaces gráficas de usuario basadas en Java 10
  • 11. Diagrama jerárquico de clases para programación GUI en Java 11
  • 12. Diagrama jerárquico de clases para programación GUI en Java (cont.) 12
  • 13. Clasificación GUI • Se dividen en tres: 1. Contenedores 2. Auxiliares 3. Componentes 13
  • 14. Clases contenedor • Son componentes GUI usados para «contener» otros componentes • Son contenedores AWT: – Window, Panel, Applet, Frame y Dialog • Son contenedores Swing: – Container, JFrame, JDialog, JApplet, y JPanel 14
  • 15. Contenedores Swing • Container – Usado para agrupar componentes. – Frames, panels y applets son ejemplos de contenedores • JFrame – Es una ventana no contenida dentro de otra ventana. – Es el componente base para construir las interfaces basadas en Swing • JDialog – Es una ventana emergente o de mensaje, usada de manera temporal para recibir información del usuario o dar alguna notificación • JApplet – Es subclase de Applet. Utilizada para crear applets basados en Swing • JPanel – Es un contenedor invisible para agrupar componentes de interfaz de usuario. – Los paneles pueden ser anidados (“uno dentro de otro”) – Pueden ser utlizados como “lienzo” para dibujar gráficos 15
  • 16. Actividad • Utilizando el entorno gráfico de Netbeans: – Crear un JFrame – Agregar botones para invocar cada uno de los tipos de diálogo de la clase JOptionPane 16
  • 17. Clases auxiliares • No son subclases de Component • Son usadas para describir propiedades de componentes GUI, están en el paquete java.awt Nota. Los componentes Swing no reemplazan todas las clases AWT, sólo las clases de componentes GUI de AWT (como Button, TextField, TextArea,…) 17
  • 18. Clases auxiliares (cont.) • Graphics – Clase abstracta que proporciona un contexto gráfico para dibujar líneas y figuras simples • Color – Trata los colores de los componentes GUI. Útil para especificar fondos, color de letras o de líneas, figuras, etc. • Font – Especifica tipo, estilo y tamaño de letras mostradas en componentes GUI • FontMetrics – Clase abstracta utilizada para obtener propiedades de los tipos de letra • Dimension – Encapsula el largo y ancho de un componente (en precisión entera) • LayoutManager – Es una interface que especifica como son alineados los componentes dentro de un contenedor 18
  • 19. Clases componente GUI • JComponent es la superclase de todos los componentes Swing • Como JComponent es una clase abstracta no es posible usar new JComponent(), es necesario usar los constructores de las subclases 19
  • 20. Clases componente GUI (cont.) • ¿Cuál sería el resultado de ejecutar el siguiente fragmento de código? JButton jbtOK = new JButton("OK"); System.out.println(jbtOK instanceof System.out.println(jbtOK instanceof System.out.println(jbtOK instanceof System.out.println(jbtOK instanceof System.out.println(jbtOK instanceof System.out.println(jbtOK instanceof JButton); AbstractButton); JComponent); Container); Component); Object); True, para todos los casos 20
  • 23. Frames (cont.) import javax.swing.*; public class MyFrame { public static void main(String[] args) { JFrame frame = new JFrame("MyFrame"); frame.setSize(400, 300); frame.setLocationRelativeTo(null); frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); frame.setVisible(true); } } • El frame no es desplegado hasta que frame.setVisible(true); es invocado • frame.setSize(400, 300); especifica el tamaño (400px ancho, 300px alto), si no es usado el formulario se ajusta sólo hasta desplegar la barra de título • setVisible() y setSize() están definidos en la clase Component y son heredados a JFrame, por lo que estos métodos son utilizados 23 también por otras subclases
  • 24. Frames (cont.) • Invocando frame.setLocationRelativeTo(null)el frame es centrado en la pantalla • frame.setDefaultCloseOperation(JFrame.EXIT _ON_CLOSE)le dice al programa que termine cuando se cierra el formulario, si está opción no se especifica el programa seguirá en ejecución aún y cuando el formulario se haya cerrado 24
  • 25. Frames (cont.) • Propiedades comunes de un JFrame: – contentPane • Panel de contenido del frame – iconImage • Imagen que representa el frame, reemplaza la imagen por default de Java en la barra de título y cuando el frame es minimizado Image image = (new ImageIcon(Filename)).getImage(); frame.setIconImage(image); – JMenuBar • Barra de menú opcional – resizable • Valor booleano que indica si el frame puede cambiar de tamaño frame.setResizable(Value); – title • Especifica el título del formulario frame.setTitle(Title); 25
  • 26. Frames (cont.) • Para añadir componentes a un frame utilizar el método add(): // Añadir un botón al frame JButton jbtOK = new JButton("OK"); frame.add(jbtOK); • Este método añade el componente al panel de contenido del frame. – El botón sería colocado al centro y ocupando todo el frame, esto debido al layout manager que el frame tiene por default • Puede usarse la siguiente instrucción para remover el botón: frame.remove(jbtOK); 26
  • 27. Actividad 1. Crear en bloc de notas una clase Java de nombre PruebaFrames 2. En el método principal crear un objeto formulario con titulo «Mi primer frame en TAP» 3. Especificar el tamaño a 500px de alto por 400px de ancho 4. Guardar y ejecutar en línea de comandos ¿qué es lo que sucede? 27
  • 28. Actividad (cont.) 5. Ubicarlo en las coordenadas (0, 0) de la pantalla 6. Hacer visible el frame 7. Guardar y ejecutar ¿qué pasa si cierran el formulario? 8. Comentar la línea de ubicación anterior y agregar lo necesario para centrar el frame en la pantalla 9. Configurar que la aplicación termine al cerrar el formulario 10. Guardar y ejecutar 28
  • 29. Actividad (cont.) 11. Configurar una imagen para mostrar en la barra de título 12.Establecer que el frame no pueda cambiar de tamaño 13. Cambiar el título del frame a «Mi primer frame modificado» 14.Guardar y ejecutar 29
  • 31. Programación dirigida por eventos • Imaginen un programa para imprimir los primeros 100 números de la serie de Fibonacci o un programa para recibir dos números y escribir el resultado de su suma ¿quién controla que se ejecutará primero y que después? • Ahora imaginen Microsoft Word con un nuevo documento abierto ¿quién controla la secuencia de ejecución? 31
  • 32. Programación dirigida por eventos (cont.) • En este paradigma la estructura como la ejecución de los programas van determinados por los sucesos que ocurran en el sistema, generalmente provocados por el usuario» • Es la base para el desarrollo de interfaces gráficas de usuario • Maneja el concepto de evento y administrador de eventos: – Un evento es la señal que indica que sucedió una acción predeterminada – Un administrador de eventos es la parte de la aplicación que se encarga de ejecutar ciertas tareas cuando se ha detectado un evento en particular 32
  • 33. Programación dirigida por eventos (cont.) • Los eventos soportados estarán determinados por el lenguaje de programación utilizado, algunos son heredados por el propio sistema operativo e incluso otros pueden ser creados por el mismo programador • En este tipo de aplicaciones generalmente hay una fase de inicialización seguida de una fase de espera a la detección de algún evento que determine la secuencia de ejecución a seguir 33